함수를 일급 객체로 취급하면 클로저가 필요해지는 것인가? 클로저 앞부분을 읽다보니 이런 의문이 먼저 생겼습니다.결론부터 말하자면. 일급 객체만으로 필요해지는 건 아니고. 렉시컬 스코프와 만났을 때 클로저가 필요해진다고 볼 수 있더라구요. 함수가 일급 객체라는 것은 함수를 값처럼 변수에 담고, 인수로 전달하고, 반환값으로 돌려받을 수 있다는 뜻입니다. 그러면 자연스럽게 함수가 정의된 곳과 호출되는 곳이 달라지는 상황이 생깁니다. 이때 스코프를 정의된 위치 기준으로 결정하겠다고 약속했다면(= 렉시컬 스코프), 함수는 자신이 어디서 호출되든 자신이 정의된 환경을 기억하고 있어야만 합니다. 그 기억 장치가 바로 클로저입니다.그래서 이 글은 렉시컬 스코프에서 출발해 실행 컨텍스트를 거쳐 클로저로 도착하는 순서로 ..
최근 글
-
JS Deep Dive 24장. 클로저자바스크립트로의 깊은 잠수 2026.08.18 20:21
함수를 일급 객체로 취급하면 클로저가 필요해지는 것인가? 클로저 앞부분을 읽다보니 이런 의문이 먼저 생겼습니다.결론부터 말하자면. 일급 객체만으로 필요해지는 건 아니고. 렉시컬 스코프와 만났을 때 클로저가 필요해진다고 볼 수 있더라구요. 함수가 일급 객체라는 것은 함수를 값처럼 변수에 담고, 인수로 전달하고, 반환값으로 돌려받을 수 있다는 뜻입니다. 그러면 자연스럽게 함수가 정의된 곳과 호출되는 곳이 달라지는 상황이 생깁니다. 이때 스코프를 정의된 위치 기준으로 결정하겠다고 약속했다면(= 렉시컬 스코프), 함수는 자신이 어디서 호출되든 자신이 정의된 환경을 기억하고 있어야만 합니다. 그 기억 장치가 바로 클로저입니다.그래서 이 글은 렉시컬 스코프에서 출발해 실행 컨텍스트를 거쳐 클로저로 도착하는 순서로 ..
-
JS Deep Dive 23장. 실행 컨텍스트 (2)카테고리 없음 2026.07.28 20:17
저번 글에서 실행 컨텍스트와 렉시컬 환경이란 뭘까? 그 정의를 알아봤습니다.이번 글은 그것들이 어떻게 동작하는지를 이해하는 글입니다. 시간 순으로 전체 순서 훑어보기일단 어떤 코드가 있을 때 실행 컨텍스트와 렉시컬 환경이 생성되는 순서를 쭉 훑어봅시다.책에는 다음과 같은 예제가 나와 있습니다. var x = 1;const y = 2;function foo (a) { var x = 3; const y = 4; function bar (b) { const z = 5; console.log(a + b + x + y + z); } bar(10);}foo(20); // 42 왜 변수 이름을 x, y, z 따위로 지으면 안되는지를 명확하게 알 수 있는 코드입니다.얼른 읽히지를 않습니다. 제가..
-
JS Deep Dive 23장. 실행 컨텍스트 (1)자바스크립트로의 깊은 잠수 2026.07.21 20:32
실행 컨텍스트는 참 재밌는 녀석입니다.자바스크립트 코드에 우리가 수많은 변수와 함수를 정의해도 꼬이지 않고 빠른 성능을 유지할 수 있는 이유는 무엇일까요? 바로 요 실행 컨텍스트가 그걸 관리해주기 때문입니다. 한번 어떤 기특한 녀석인지 알아봅시다. 소스 코드 평가자바스크립트는 인터프리터 언어지만.. 마치 컴파일 언어처럼 먼저 소스 코드 평가라는 것을 합니다.ECMAScript 사양에 따르면 이 평가되는 소스 코드에는 4가지 타입이 있다고 합니다.타입에 따라 실행 컨텍스트를 생성하는 과정도 달라지고, 내부에서 관리되는 내용도 달라집니다.전역 코드함수 코드eval 코드모듈 코드 그럼 이 소스 코드 평가가 뭐냐.실행 컨텍스트를 생성하고 변수, 함수 등의 선언문만 먼저 실행하여 변수, 함수 식별자를 실행 컨텍스..
-
JS Deep Dive 22장. this자바스크립트로의 깊은 잠수 2026.07.14 20:43
충격적인 코드를 하나 보면서 시작해 봅시다..const circle = { radius: 5, getDiameter() { return 2 * circle.radius; // 이 객체가 할당될 식별자 이름 circle을 미리 참조하고 있다! }};circle.getDiameter();이런 짓이 가능하다는 것에 적잖은 충격을 받았지만…아무튼 위와 같이 객체 리터럴로 인스턴스를 생성하면 같은 형태의 인스턴스들을 많이 뽑아내는 것이 어렵습니다.radius 프로퍼티와 getDiameter() 메서드를 가진 인스턴스를 여러 개 만드려면 매번 똑같은 객체를 다시 적어줘야 하기 때문에 코드 중복이 너무 많겠죠.그래서 본래 목적대로 효율적인 재사용을 하기 위해서는 생성자 함수 또는 (추후 배울) class를..
-
JS Deep Dive 20장. strict mode자바스크립트로의 깊은 잠수 2026.07.07 19:47
자바스크립트에는 strict mode라는 기능이 있습니다.앞선 장에서 살펴봤듯이, 자바스크립트는 높은 자유도를 가진 언어입니다. 최대한 에러를 발생시키지 않는 쪽으로 설계되어 있죠.하지만 에러가 발생하지 않으면 문제가 생겼을 때 원인을 찾기가 정말 어려워집니다. 어디가 잘못되었는지 콘솔에 안 찍히기 때문이에요.그래서 에러를 일부러 발생시키는, 좀 더 엄격한 모드인 strict mode가 ES5부터 추가되었어요. strict mode 사용법전역의 맨 첫줄 또는 함수 몸체의 맨 첫줄에 'use strict'; 를 추가하면 됩니다. strict mode가 발생시켜주는 에러암묵적 전역 방지선언하지 않은 변수를 참조했을 때 ReferenceError를 발생시킵니다.원래는 선언 없이 x = 1; 같은 짓을 했을때 ..
-
JS Deep Dive 18장. 함수와 일급 객체자바스크립트로의 깊은 잠수 2026.06.16 20:19
개념 알아보기아래 조건을 만족하는 객체를 일급 객체라고 합니다. - 무명의 리터럴로 생성할 수 있다. 즉 런타임 생성이 가능하다.- 변수 또는 자료구조(객체, 배열)에 저장할 수 있다.- 함수의 매개변수에 전달할 수 있다.- 함수의 반환값으로 사용할 수 있다. 자바스크립트의 함수는 위 조건들을 모두 만족하므로 일급 객체입니다. 함수는 일급 객체이므로, 함수는 객체처럼 쓸 수 있습니다.또 객체는 값이므로 함수는 값처럼 쓸 수 있습니다.따라서 함수는 값이 들어갈 수 있는 자리에 다 들어갈 수 있어요.(변수 할당문, 객체의 프로퍼티 값, 배열의 요소, 함수 호출의 인수, 함수 반환문 등) 함수가 일급 객체면 뭐가 좋냐, 바로 함수형 프로그래밍이 가능하다는 것입니다.아래와 같은 짓을 할 수 있어요. functi..
-
자바스크립트의 함수를 잘못 사용하는 방법자바스크립트로의 깊은 잠수 2026.06.09 20:34
자바스크립트의 모든 함수는 호출할 수 있습니다.당연한 얘기죠.함수는 호출하라고 있는 것 아닌가요? 그런데 호출하면 안되는 함수도 존재합니다.이게 무슨 소릴까요? 생성자 함수자바스크립트에는 생성자 함수라는 개념이 있습니다. function Dog(name) { this.name = name; this.bark = function() { console.log(name + "(이)가 짖었습니다! 월월"); }} 위의 함수는 생성자 함수로 사용할 수 있습니다.이런 함수를 쓰는 표준적인 방법은 new 키워드를 사용해서 인스턴스를 생성하는 것입니다.아래 코드처럼 말입니다. function Dog(name) { this.name = name; this.bark = function() { con..
-
프로퍼티 어트리뷰트가 뭔가요?자바스크립트로의 깊은 잠수 2026.06.02 20:35
자바스크립트에는 프로퍼티 어트리뷰트(Property Attribute)라는 것이 있습니다.이걸 그냥 보면 이해하기 어렵습니다.객체지향 프로그래밍을 먼저 이해해야 프로퍼티 어트리뷰트가 왜 존재하는 것인지, 어떤 역할을 하는건지 감을 잡을 수 있어요. 객체지향 프로그래밍OOP(Object Oriented Programming)라고도 불리는 객체지향 프로그래밍은 소프트웨어 개발 방식의 하나입니다.모든 것을 객체로 보고, 그 객체들이 서로 협력하며 프로그램을 이루어냅니다. 객체지향이 뭐가 좋냐, 하면현실 세계의 개념을 그대로 코드로 가져오기가 쉽습니다. 쇼핑몰 웹사이트를 만들어야 한다고 생각해볼까요?현실 세계의 경우를 먼저 생각해봅시다.소비자가 쇼핑몰에 가서 마음에 드는 상품을 카트에 담고 카운터로 가서 계산하..