Dev Diary

가상 DOM은 리액트와 같은 프레임워크에서 UI 업데이트를 효율적으로 관리하기 위해 만들어진 기술임.  가상 DOM의 정의가상 DOM은 웹 페이지의 실제 DOM 구조를 모방한 가벼운 버전임. 브라우저가 화면에 보이는 내용을 유지하는 데 사용하는 진짜 DOM은 변화할 때마다 업데이트가 복잡하고 시간이 많이 걸림. 이를 해결하기 위해, 가상 DOM은 메모리 안에서만 존재하는 가벼운 객체로, 실제 DOM과 비슷한 구조를 갖고 있지만 더 빠르게 조작할 수 있음.  가상 DOM의 동작 원리1. 렌더링 준비: React는 컴포넌트의 상태(state)나 속성(props)이 변경되면 새로운 가상 DOM 트리를 생성함. 2. 비교 과정: React는 이전 가상 DOM과 새로 생성된 가상 DOM을 비교하여 어떤 부분이 변..

this란? 현재 실행되는 코드의 문맥(context)에서 참조하는 객체를 가리킨다.쉽게 말해, this는 “누가 나를 호출했는가?”에 대한 답변이라 볼 수 있다.  this는 함수가 어떻게 호출되는지에 따라 참조하는 객체가 달라진다. 1. 일반 함수 호출2. 메소드 호출3. 생성자 함수4. 화살표 함수5. 명시적 바인딩  크게 이런 호출 방식에 따라 객체가 달라지는데, 우선은 명시적 바인딩은 다음에 자세히 살펴보는 것으로 하고 나머지 4개 호출 방식에서 this가 어떻게 동작하는지부터 이해하자.   1. 일반 함수 호출이 때 this 는 전역 객체를 가리킨다. 브라우저에서는 window를, Node.js 에서는 global을 가르킨다.  2. 메소드 호출this 는 메소드를 호출한 객체를 가리킨다. 해..

1. 매개변수와 인수매개변수: 함수를 정의할 때 어떤 정보를 받아 올 지를 지정하는 변수임. 인수: 함수를 호출할 때 매개변수에 실제로 전달되는 값.   2. 반환 값(return) 2-1) 값 반환 : 함수가 실행된 결과를 호출한 곳으로 반환.  2-2) 함수 종료: 함수를 즉시 종료하고, 그 다음에 있는 코드는 실행하지 않음. 2-3) 반환하는 요소들: 값, 객체, 배열   3. 스코프스코프는 변수와 함수가 접근할 수 있는 범위를 결정. 전역 스코프, 지역(함수)스코프, 블록스코프가 있으며, 자바스크립트는 렉시컬 스코프를 따름.스코프 체인은 변수의 검색 규칙을 정의하여, 현재 스코프에서 변수를 찾고 상위 스코프까지 거슬러 올라가는 구조를 가짐.렉시컬 스코프:함수가 정의된 위치에 따라 상위 스코프가 결..

❓궁금증 생성자 함수는 일반 함수랑 구문이 동일한데 왜 생성자 함수와 일반 함수와 구분지어 부를까? 구문이 동일하지만 new 키워드가 있을 때만 일반 함수를 생성자 함수라고 부르는 것인가? 1. 구문적 동일성: 생성자 함수와 일반 함수는 정의할 때 구문적으로 차이가 없습니다. JavaScript에서는 모든 함수가 잠재적으로 생성자 함수가 될 수 있습니다.2. new 키워드의 역할: 함수가 new 키워드와 함께 호출될 때만 해당 함수는 생성자 함수로서 동작합니다. 이때 새로운 객체가 생성되고, 함수 내의 this가 이 새 객체를 가리키게 됩니다.3. 호출 방식에 따른 구분: - new 키워드와 함께 호출: 생성자 함수로 동작- new 키워드 없이 호출: 일반 함수로 동작 예제: function User(n..