본문 바로가기

개발지식23

[Javascript] 스코프 체이닝이란 무엇인가? 1. 스코프 체이닝이란? 스코프 체이닝은 프로그래밍에서 변수나 함수의 유효 범위 즉 스코프를 결정하는 과정을 설명하는 개념이다. 변수나 함수가 참조될 때 해당하는 범위를 찾는 메커니즘을 말한다. 스코프는 일반적으로 중첩된 함수나 블록의 범위를 가리키는데 이렇게 중첩된 스코프에서 변수나 함수를 참조할 때, 현재에 있는 스코프에서 찾지 못하면 외부 스코프로 차례차례 이동하여 탐색하는 과정을 스코프 체이닝이라고 한다. 이때 탐색의 과정은 최상위인 전역스코프부터 시작해서 필요한 변수나 함수가 있는 스코프까지 계속해서 진행되는데 이것이 스코프 체이닝의 과정이다. 대부분의 프로그래밍 언어에서 스코프 체이닝은 정적 스코프와 동적 스코프 두 가지 방식 중 하나를 따른다. 대부분의 언어는 정적 스코프를 사용하는데, 정.. 2024. 3. 5.
[Javascript] 이벤트 버블링과 캡쳐링 우리가 웹서비스를 이용할 경우 사용자와 웹이 동적으로 상호작용할 때 브라우저에서 이벤트가 발생된다. 이벤트 버블링과 캡처링은 웹 개발에서 이벤트 처리에 관련된 두 가지 중요한 개념인데, 이벤트 캡처링과 버블링은 이벤트가 DOM 트리를 통해 어떻게 전파가 되는 지 그 방식을 설명하는 데 사용된다. 이를 통해 이벤트 핸들링의 동작을 이해하고, 원하는 대로 이벤트를 처리할 수 있다. 1. 이벤트 버블링이란 이벤트 버블링은 웹 개발에서 이벤트 처리 메커니즘 중 하나로, 이벤트 버블링은 HTML 요소들 간에 이벤트가 발생할 때, 이벤트가 발생한 요소부터 그 부모 요소들로 이벤트가 전파되는 현상을 말한다. 이벤트가 해당 요소에서 시작하여 최상위 요소까지 흐른 후 이벤트 핸들러가 호출된다. 아래의 예시처럼 html .. 2024. 2. 29.
[Javascript] 자바스크립트의 실행 컨텍스트 1. 실행 컨텍스트란? 실행컨텍스트는 코드가 실행될 때 생성되는 환경을 의미한다. 실행 컨텍스트는 코드의 실행을 관리하고 변수, 함수, 스코프 등의 코드가 실행되기 위해 필요한 정보를 담고 있는 객체이다. 크게 세 가지 타입으로 구분된다. 실행 컨텍스트는 실행 가능한 코드 블록(전역 코드, 함수 코드, eval 코드 등)이 실행될 때 생성되며, 해당 코드 블록 내에서 사용되는 변수 및 함수 등의 정보를 담고 있는데 변수 객체, 스코프체인, this 등의 정보를 가지고 있다. 변수 객체는 해당 컨텍스트의 변수, 함수 선언, 인자 등을 포함하고 있으며, 스코프 체인은 실행 컨텍스트의 스코프를 구성하는 변수 및 함수에 접근할 때 사용되는 스코프의 집합이다. this는 함수가 호출될 때 설정되는 특별한 값으로,.. 2024. 2. 19.
[Javascript] 콜스택과 이벤트루프 1. 콜스택과 이벤트루프란? Javascript가 어떻게 동작하는지 이해를 잘하면, 효율적이고 안정적인 코드를 작성할 수 있다.  Javascript는 싱글 스레드 기반의 언어이기 때문에 한 번에 하나의 작업만 처리할 수 있다. 따라서 여러 개의 작업을 처리하려면 비동기적으로 처리해야 하는데 이 때 콜스택과 이벤트 루프를 이용하여 비동기 처리를 구현한다. 1) 콜스택 Javascript는 함수 호출 시 콜스택을 사용하여 함수의 실행 순서를 관리한다. 콜스택은 함수 호출을 기록하는 데이터 구조인데, 함수가 호출될 때마다 콜스택에 새로운 프레임(실행 컨텍스트 - 로컬변수, 매개변수 등)이 추가되고, 함수가 종료될 때마다 프레임이 제거된다. 이렇게 스택에 쌓인 함수들은 자료구조 스택 처럼 LIFO(Last .. 2024. 2. 16.
[Javascript] 클로저가 무엇인가? 1. 클로저란? 클로저는 외부 변수를 기억하고, 이 외부 변수에 접근할 수 있는 함수를 의미한다. 자신이 생성될 때의 환경을 기억하는 함수인 것이다. 클로저는 함수와 해당 함수가 선언될 때의 렉시컬 환경을 함께 기억한다. 이는 함수가 선언될 당시의 스코프 체인을 기억하고, 이 함수가 실행될 때에도 그 스코프 체인에 접근할 수 있도록 하는 메커니즘이다. 이는 해당 함수 내부에서 선언된 변수들을 포함하여, 함수가 선언된 위치에 대한 정보를 가지고 있다. 이렇게 클로저가 기억하는 렉시컬 환경은 해당 함수가 실행되는 동안에도 유지된다. 이러한 클로저의 특성을 이용하면, 함수가 선언될 때 생성된 렉시컬 환경에 있는 변수를 계속해서 사용할 수 있다. 예를 들어, 함수 내부에서 선언된 변수를 함수 외부에서 사용하려고.. 2024. 2. 15.
[Javascript] 호이스팅이란 무엇인가? 1. 호이스팅이란? Javascript 엔진은 코드를 실행하기 전, 컴파일러가 실행되기 전 단계에서 변수와 함수를 위한 공간을 메모리에 확보한다. 이때 변수와 함수의 선언 부분이 끌어올려진(hoisted) 것처럼 보여지는 현상을 호이스팅이라고 한다. Javascript에서 변수를 선언하면, 해당 변수는 스코프 내에서 사용할 수 있게 된다. 하지만 선언과 할당은 다르기 때문에, 변수를 선언하고 초기화하지 않으면 undefined 값으로 할당된다. 호이스팅은 변수나 함수를 선언할 때만 발생하며, 할당은 호이스팅 되지 않는다. 2. 변수 호이스팅 변수가 선언되면, 해당 변수는 스코프의 최상단으로 끌어올려지게 된다. 이렇게 되면 변수를 선언하기 전에 해당 변수를 사용해도 에러가 발생하지 않는다. 또한, let과.. 2024. 2. 14.