본문 바로가기

JavaScript4

[JavaScript] 클로저(Closure) 자바스크립트에서 클로저는 어떤 함수와, 그 함수가 선언된 렉시컬 환경의 조합입니다. 다만 이렇게 말하면 조금 추상적이라 이해하기가 쉽지 않습니다. 좀 더 말을 정리해본다면, 클로저란 상위 함수보다 하위 함수가 더 오래 살아있는 경우를 의미한다고 할 수 있습니다. 클로저의 개념 function getNumber() { const number = 5; function innerGetNumber() { return number; } return innerGetNumber; } const runner = getNumber(); console.log(runner()); // 5 위 코드를 보면, innerGetNumber 함수는 상위 실행 컨텍스트를 참조할 수 있기 때문에 number 변수를 발견할 수 있습니다... 2023. 11. 23.
[JavaScript] this 자바스크립트는 렉시컬 스코프를 사용하기 때문에, 함수의 상위 스코프는 함수가 정의되는 시점에 평가됩니다. 하지만 this 키워드는 객체가 생성되는 시점에 결정됩니다. this가 동작하는 방식 const testFunction = function() { return this; } console.log(testFunction()) // this 객체는 window, global을 가리킨다. 위 testFunction의 this는 함수(=객체) 생성 시점에 결정되게 되는데, testFunction은 일반 함수로서 호출되었기 때문에 이때 testFunction의 this는 전역 객체인 window 또는 global을 가리키게 됩니다. const changuk = { name: '우창욱', year: 1998, .. 2023. 11. 23.
[JavaScript] 실행 컨텍스트 (Execution Context) 정의 실행 컨텍스트는 실행하려는 자바스크립트 코드와 코드를 실행할 때 필요한 정보를 담고있는 특수한 환경입니다. 즉 코드를 실행하는 데 필요한 모든 데이터를 가지고 있는 환경을 실행 컨텍스트라고 할 수 있습니다. 실행 컨텍스트는 전역 컨텍스트(Global Context), 함수 컨텍스트(Function Context)로 나눌 수 있습니다. 전역 컨텍스트는 자바스크립트 코드를 실행하게 되면 반드시 생성되는 컨텍스트로, 웹에서는 window 객체, NodeJS 환경에서는 global 객체를 생성합니다. 함수 컨텍스트는 함수 선언문이 실행될 때 마다 함수별로 실행되는 컨텍스트입니다. 이 컨텍스트에는 함수 실행에 대한 모든 정보를 갖고 있습니다. 자바스크립트의 컨텍스트는 콜 스택(Call Stack) / 실행 .. 2023. 11. 20.
[JavaScript] 객체 리터럴(Object Literal) 객체 리터럴의 정의 자바스크립트에서 객체(Object)란 키-값 쌍으로 이루어진 데이터를 의미합니다. 원시(Primitive) 데이터 타입인 string, number, symbol, undefined, null, boolean 총 6개를 제외하고 자바스크립트의 데이터 타입들은 모두 객체 타입입니다. 이 객체 타입을 생성하는 방법 중의 하나로 객체 리터럴이 있습니다. 객체 리터럴은 중괄호({...})안에 0개 이상의 프로퍼티를 정의하는 객체 생성 표기법을 의미합니다. 객체 리터럴을 사용하면 아래 코드처럼 일반적이고 간단한 방법으로 객체를 생성할 수 있습니다. 프로퍼티의 값이 함수인 경우 메서드라고 부릅니다. const user = { name: 'Woo', getName: function() { cons.. 2023. 11. 14.