본문 바로가기

전체 글

 (40)
[React JS] 리액트 setState의 원리 리액트에서 리렌더링을 어떻게 하는지, render() 함수로 처리하지 않고 자동으로 렌더링하는 방법을 알아보자. 리액트의 useState()는 계속해서 업데이트할 데이터와 그 값을 바꾸는 함수를 배열로 갖는다. 즉, React.useState(0)은 자바스크립트에서 다음과 같은 역할을 한다. 변수 counter에 0으로 값을 초기화한다. countUp 함수는 해당 counter 변수를 증가시킬 것이다. let counter = 0; function countUp() {} useState()의 배열을 자바스크립트의 비구조화할당 문법을 통해 새로운 변수로 할당해보자. useState는 [0]인덱스의 값에 데이터를 저장하고 [1] 인덱스에 데이터를 업데이트하는 함수를 갖고 있다. 어떤 값을 부여하던, set..
[자바스크립트 문법] 객체와 배열의 구조분해할당 구조분해할당이란? 배열, 객체와 같이 구조화되어 있는 iterable한 데이터를 분해시켜서 각각의 변수에 담는 것을 의미한다. iterable한 데이터란, 배열과 객체처럼 순회 가능한 데이터를 의미한다. 배열과 구조분해할당 다음은 arr 이라는 배열이 있다. 배열의 각 요소를 변수로 선언하려면 하나씩 총 5개의 변수가 필요하다. let arr = [1, 2, 3, 4, 5]; let one = arr[0]; let two = arr[1]; ... console.log(one, two); // 1,2 출력 그런데 구조분해할당을 사용한다면, 한 줄로 코드를 줄일 수 있다. 좌측에는 let, const와 같은 변수 선언 키워드를 적고 대괄호 []안에 변수명을 작성한다. 이 대괄호는 배열이기 때문에 가능하다. ..
[자바스크립트 문법] 전역 스코프와 지역 스코프, 함수레벨 스코프와 블록레벨 스코프 전역 스코프(Global Scope)와 지역 스코프(Local Scope) Global scope, 전역 스코프란 변수에 접근 또는 참조할 수 있는 범위가 전역적으로 정의된 것이다. Local scope, 지역 스코프란 변수에 접근 또는 참조할 수 있는 범위가 함수 내부에만 정의된 것이다. 전역 스코프의 변수는 지역 스코프에서 사용이 가능하나, 그 반대의 경우는 사용이 불가하다. 지역 스코프에서 선언된 변수는 해당 범위 안에서만 사용가능하다. 지역 스코프의 종류 : 함수 레벨 스코프와 블록 레벨 스코프 함수 레벨 스코프란, 함수를 실행할 때 생겨나는 '지역 스코프'이다. 함수를 만들면, 함수마다 지역 스코프가 생겨나게 된다. var 키워드는 함수 레벨 스코프를 따른다. 블록 레벨 스코프를 따르지 않는다..

티스토리툴바