분류 전체보기 89

this 톺아보기: 함수 호출 시점과 this 바인딩

this란?this는 함수 내부에서 특정한 객체를 가리키는 식별자다. 자세히 살펴보자.먼저, this는 식별자다. 식별자란 데이터가 올려진 메모리에 붙여진 이름이다(또는, 데이터가 저장된 메모리 주소 그 자체이다). 변수, 함수, 함수의 파라미터 등이 식별자에 해당한다. 마찬가지로, this도 메모리에 올려진 어떠한 데이터(객체)의 메모리 주소를 가리킨다(참조한다). 물론, 특별한 메서드를 사용하지 않으면 사용자가 직접 this의 값을 지정할 수 없다는 점에서(호출 시 동적으로 바인딩 대상이 결정된다) 다른 식별자들과의 차이점이 있긴 하다. 하지만, 식별자의 본질인 '데이터가 저장된 주소를 참조하는' 역할은 동일하게 수행한다.this는 함수에 위치하고 객체를 가리킨다. 실제로, this에 대한 정보는 실..

JavaScript 2024.10.28

실행 컨텍스트 톺아보기: 실행 컨텍스트 구성 요소

실행 컨텍스트의 구성 요소실행 컨텍스트는 자바스크립트 코드가 동작을 관리하고, 코드 실행을 위해 필요한 환경(스코프, this 등)과 데이터 상태 정보를 관리하는 자바스크립트 엔진의 동작 메커니즘이다. 실행 컨텍스트는 자바스크립트의 동작을 관리하는 핵심적인 역할을 하며 스코프 체인, 호이스팅, this, 변수 관리(메모리 관리), 클로저 등 중요한 개념을 이해하는 배경이 된다.실행 컨텍스트는 작성된 코드 평가 시 생성되며, 콜 스택에 선입선출(FIFO; First In, First Out) 방식으로 공간을 할당하여 스코프를 관리한다. 실행 컨텍스트의 메모리 점유 방식에 대해선 포스트에 기록해뒀다.이번 포스트에선 실행 컨텍스트의 구성 요소들에 대해 조금 더 알아보려고 한다. 먼저, 실행 컨텍스트는 렉시컬 ..

JavaScript 2024.10.22

실행 컨텍스트 톺아보기: 기본 개념, 메모리 사용 방식

실행 컨텍스트란?실행 컨텍스트는 자바스크립트 코드를 실행하기 위해 필요한 다양한 환경 정보와 데이터들의 상태를 관리하기 위한 자바스크립트 엔진의 동작 메커니즘이다. 자바스크립트로 작성된 모든 코드는 자바스크립트 엔진에서 관리하는 '실행 컨텍스트'를 통해서만 동작할 수 있고, 그런 의미에서 실행 컨텍스트를 제대로 알아야지만 자바스크립트의 핵심적인 개념들(호이스팅, 클로저, 스코프 체인 등)을 제대로 이해할 수 있다.가장 먼저 실행 컨텍스트에 대한 이해를 방해했던 요인 중 하나가 바로 '실행 컨텍스트에 대한 정의'였다. 많은 자료에서 실행 컨텍스트를 '코드 실행을 위한 환경 정보들을 모아놓은 객체'라고 표현한다. 여기서 '객체'라는 표현이 처음 공부할 때 참 많은 오해를 불러일으켰다. 대표적으론 '자바스크립..

JavaScript 2024.10.19

프로퍼티 톺아보기: 데이터 프로퍼티와 접근자 프로퍼티

프로퍼티는 메서드인 프로퍼티와 메서드가 아닌 프로퍼티로 구분할 수 있다(포스트 참고). 메서드인 프로퍼티는 값으로 동작 가능한 함수를 갖고, 메서드가 아닌 프로퍼티는 그 이외의 값을 갖는다. 메서드인 프로퍼티도 프로퍼티이지만, 메서드가 아닌 프로퍼티와의 구분을 위해 보통 '메서드'라고 부른다.데이터 프로퍼티와 접근자 프로퍼티프로퍼티를 나누는 구분은 또 있다. 바로, 데이터 프로퍼티와 접근자 프로퍼티다. 둘에 대해서 한번 살펴보자.데이터 프로퍼티일반적으로 사용하는 객체의 프로퍼티들이 데이터 프로퍼티다. 어떠한 값이 오든 상관없이, 프로퍼티 키와 값으로 구성된 모든 프로퍼티는 데이터 프로퍼티다.function Person(name, age, marriage, hobby, address) { this.nam..

JavaScript 2024.10.17

프로퍼티 톺아보기: 프로퍼티 vs 메서드, 프로퍼티 vs 변수

Javascipt의 거의 모든 것은 객체다(원시 타입 데이터를 제외한 모든 값은 객체다). 그래서, 객체에 대해 잘 이해하는 게 중요하다. 객체는 프로퍼티(Property; 속성)와 어트리뷰트(Attribute; 값)로 구성되는데, 한번 자세히 살펴보자.객체와 프로퍼티객체는 여러 데이터의 묶음으로, 키(Key)를 통해 값(Value)에 접근하도록 도와주는 자료구조이다. 프로퍼티는 객체 내부에 정의된 어떠한 속성으로, 데이터 프로퍼티와 접근자 프로퍼티로 구분된다. 그리고, 특정 프로퍼티가 갖는 속성(메타 데이터)을 어트리뷰트(Attribute)라고 부른다. 어트리뷰트는 데이터 프로퍼티와 접근자 프로퍼티에 따라 각각 다르게 생성되며, 각각에 대해서는 별도의 포스트에 조금 더 자세히 남겨놓았다.그러면, 객체..

JavaScript 2024.10.14

얕은 복사(Shallow Copy)와 깊은 복사(Deep Copy)

얕은 복사(Shallow Copy)와 깊은 복사(Deep Copy)JavaScript의 데이터 타입은 크게 원시 타입(Primitive Type)과 참조 타입(Reference Type)으로 나눌 수 있다. 원시 타입은 확보된 스택 메모리에 값을 직접 저장하지만, 참조 타입은 값을 힙 영역에 저장하고, 스택에는 데이터가 저장된 힙 메모리 영역의 첫 주소값이 저장된다. 값을 스택에 직접 저장하는지 참조할 주소를 저장하는지에 따라 차이가 있으며, 그 차이로 인해 데이터 복제 방법에서 차이가 생긴다(원시 타입과 참조 타입 참고).원시 타입 데이터는 변수로 데이터를 복제하면 값이 저장된 동일한 메모리 주소를 가리킨다. 원시 타입의 값은 불변이기 때문에 복제한 변수에 다른 값을 재할당하면 가리키던 메모리 공간에 ..

JavaScript 2024.10.11

원시 타입의 메서드(Method) 사용

원시 타입과 메서드JavaScript의 데이터 타입은 원시 타입과 참조 타입, 크게 두 가지로 나뉜다. 그 중 원시 타입에는 문자열(String), 숫자(Number), 불리언(Boolean; 논리 연산의 결과를 True 또는 False로 표현), Undefined(값이 할당되지 않은 변수에 엔진이 자동으로 부여하는 값), Null(명시적으로 값이 없다는 것을 나타냄), 심볼(Symbol; ES6에서 추가된 타입으로, 보통 객체의 프로퍼티 키를 고유하게 생성하기 위해 사용)이 있다. JavaScript에서 원시 타입을 제외한 나머지 모든 데이터는 객체(Object)다(원시 타입과 참조 타입 참고). 다시 말해, 원시 타입은 객체가 아니다(개념 상 구분된다). 하지만, 일부 원시 타입에는 사용 가능한 메서..

JavaScript 2024.10.10

원시 타입과 참조 타입

원시 타입과 참조 타입JavaScript의 데이터 타입은 원시 타입(Primitive Type)과 참조 타입(Reference Type)으로 구분된다. 원시 타입에는 문자열(String), 숫자(Number), 불리언(Boolean; 논리 연산의 결과를 True 또는 False로 표현), Undefined(값이 할당되지 않은 변수에 엔진이 자동으로 부여하는 값), Null(명시적으로 값이 없다는 것을 나타냄), 심볼(Symbol; ES6에서 추가된 타입으로, 보통 객체의 프로퍼티 키를 고유하게 생성하기 위해 사용)이 있고, 참조 타입에는 객체(Object)가 있다. 배열 등도 참조형 데이터 타입으로 생각될 수 있다. 실제로 특정 프로그래밍 언어에서 배열은 별도의 데이터 타입으로 분류된다. 하지만, Jav..

JavaScript 2024.10.09

var, let, const의 차이: var 사용을 지양해야 하는 이유

JavaScript의 변수 선언자는 var, let, const 세 가지다. 그중 var는 JavaScript 초기부터 사용된 방식이고, let과 const는 2015년 발표된 ES6를 통해 추가된 문법이다. 모든 기술이 그렇지만, 후에 나온 기술은 기존 기술의 한계를 보완하기 위해 등장하는 게 일반적이다. let과 const 역시 var가 가진 한계를 극복하기 위해 추가됐고, 그렇다 보니 개발할 때 var가 아닌 let과 const 사용이 권장된다.흔히 var와 let, const의 차이로 아래 세 가지가 얘기된다.let과 const는 한번 선언된 변수의 재선언이 불가능지만, var는 변수를 재선언 할 수 있다.let과 const는 블록 스코프가 적용되지만, var는 함수 스코프가 적용된다.let은 실..

JavaScript 2024.10.07