Hi, I'm JeongHun

1. 함수란 1) 함수란? 함수란 일련의 과정을 문(최소 실행 단위)으로 구현하여 코드 블록으로 감싸 하나의 실행 단위로 정의한 것이다. js에서 함수를 생성하는 방법은 함수 정의를 통해 생성한다. ※ 리터럴의 뜻 값을 생성하기 위한 표기법으로 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용하여 값을 생성하는 표기법을 말한다. 2) 함수 리터럴 js에서 함수는 객체 타입의 값이다. 함수 리터럴은 function 키워드, 함수 이름, 매개변수, 함수 몸체로 구성된다. var f = function add(x, y) { return x + y; } // 변수 f에 함수 리터럴을 할당하여 함수를 만들 수 있다. 함수 리터럴은 평가 과정을 통해 값이 되며 이는 객체로 간주된다. 즉 함수 리터럴은 평가되면 ..

1. 객체 리터럴 1) 자바스크립트의 객체 ● js에서는 원시값을 제외하고 함수, 배열, 정규 표현식 등 js의 모든 것은 객체로 이루어져있다. 객체는 프로퍼티와 메소드로 구성된 집합체이다. 객체 리터럴은 값으로 평가가 될 수 있는 표현식이다! var person = { num : 0, increase : function() { this.num++; } }; js에서 객체와 함수는 밀접한 관계를 가지는데 함수로 객체를 생성(생성자 함수)하거나 함수 자체가 객체이다.(일급 객체) ● 메서드와 함수 구분 js에서 함수는 일급 객체이다. 함수는 값으로 취급되기 떄문에 객체의 프로퍼티의 값으로 사용될 수 있다. 프로퍼티 값이 함수인 경우 이를 메서드라고 한다. 이는 일반 함수와 구분해서 부르는 용어이다. 2. ..

1. 프로토타입이란 자바스크립트의 모든 객체는 하나의 "프로토타입"을 가진다. 또한 모든 "프로토타입"은 생성자 함수와 연결되어있다. 모든 객체라고 하면 막연하니 ( 객체 리터럴, 생성자 함수, 생성자 함수로 생성된 객체 ..) 이정도 범위로 생각하자.. 모든 객체는 [[Prototype]]이라는 내부 슬롯을 가진다. 이 내부 슬롯에는 프로토타입의 참조가 들어있게 된다. 즉 예를 들어 객체 리터럴로 생성된 객체의 내부 슬롯 [[Prototype]]의 값에는 객체 리터럴로 생성된 객체의 "프로토타입"이 들어있다. 프로토타입 prototype __proto__ XXX.prototype (ex Object.prototype) 위와 같이 앞으로 이 절을 정리하면서 위와 같은 용어가 메인인데 위 용어들은 엄밀히 ..

10절부터 계속 프로토타입에 대해 정리할 것이며 10절의 첫 주제로 프로토타입과 스코프 체인을 어느 정도 공부한 시점에서 헷갈릴 수 있는 내용인 스코프 체인 vs 프로토 타입 체인 두 개념 구분해 정리할려고 한다. 1. 스코프 체인이란 자바스크립트에는 4가지 타입의 소스코드가 있다. 전역코드 함수코드 eval코드 모듈 코드 4가지 소스코드의 타입은 스코프라는 것을 가지는데 예를 들어 함수 코드의 스코프를 설명하면 함수 내부에 선언된 변수 a가 있다고 해보자 이 a가 유효한 범위를 해당 함수의 스코프라고 한다. 함수 코드를 생각해보면 함수 선언문이 작성된 스코프(전역 객체라고 하겠다.)의 "평가" 과정 즉 전역 코드의 평가 과정이 이루어지면 함수 선언문의 이름을 key로 하며 그 값으롷 함수 객체를 생성하..

1. 일반 함수에서 this는 window에 바인딩 된다. 자바스크립트를 하면서 항상 이해가 안된던 내용이 함수 선언문으로 작성된 함수의 this는 왜 window에 바인딩이 되는 것인가?? 자바스크립트 Depp Dive 교재에는 콜백함수이건 중첩함수이건 생성자 함수로 사용되지 않는 일반 함수의 this는 window에 바인딩된다. 라고 나와있다. 그것이 왜 그런지에 대한 설명은 없으며 마치 정의를 내리듯이 설명하고있다. 아래 예시 코드를 보면 2. 예시 코드1 count = 100; const countObj = { count: 1, addCount () { this.count++ console.log('Counter Value > ', this.count) const addCount2 = functi..

함수의 객체 생성 시점과 함수의 평가 과정이 어떻게 다르며 이들의 개념들이 어떻게 유기적으로 연결되는지 오랫동안 헷갈렸던 내용도 이 포스팅 중간에 정리해봤다. 1. 함수 리터럴이란? 함수 리터럴은 function 키워드, 함수 이름, 매개변수 목록, 함수 몸체로 구성된다. var f = function add(x, y) { return x+y; } 위 식은 변수 f에 함수 리터럴을 대입했다고 할 수 있다. 자바스크립트의 함수는 객체 타입의 값으로 함수 리터럴 또한 '평가'되어 값을 생성하는데 이 값은 객체이다. 즉 함수는 객체이다. 함수는 일반적인 객체와 다르게 호출할 수 있으며 일반 객체에는 없는 함수 객체만의 고유한 프로퍼티가 존재한다. 2. 함수의 정의 함수를 정의한다함은 매개변수, 실행할 문, 반..

1. 예시를 통해 클로저 정의하기 const x = 1; function outer() { const x = 10; const inner = function() { console.log(x);}; return inner; } const innerFunc = outer(); innerFunc(); //10 위 예시를 평가와 실행 과정으로 생각해보면 위 코드의 평가 과정에서는 x는 일시적 사각지대 상태가 되며 outer 라는 key의 값으로 함수 객체가 생성되어 저장된다. 이때 outer의 상위 스코프가 [[Environment]]의 값에 할당된다. 그리고 innerFunc은 일시적 사각지대 상태가 된다. 이제 '실행' 과정을 보자 런타임이 진행되면 x =1; 이 할당되고 innerFunc = outer()..

1. 소스코드의 평가와 실행 도입 및 용어정리 1) 평가와 실행 도입 ECMAScript에서는 소스코드를 4가지의 타입으로 분류한다 전역 코드 전역에 존재한다. 함수 코드 함수 내부에 존재하는 소스코드이다. eval 코드 빌트인 전역 함수인 eval 함수에 인수로 전달하여 실행되는 소스코드 모듈 코드 모듈 내부에 존재하는 소스코드이다. 자바스크립트에서 모든 소스코드는 '평가'과정을 거친 뒤 '실행' (런타임) 과정을 거치게 된다. '평가' 과정은 실행에 앞서 코드를 실행하기 위한 준비를 하는 단계이며 '실행' 단계는 실제 런타임을 말한다. 소스코드에서 '평가' 과정에서는 어떤 작업이 일어나며 '실행' 과정에서는 어떤 작업이 일어나는지 설명한다. 2) 실행 컨텍스트 소스 코드가 실행되면 스코프, 식별자, ..

호이스팅의 개념을 정리하는데 있어 js코드의 '평가'와 '실행' 과정을 알아야한다. 이 내용은 실행 컨텍스트 절 에서 자세히 다룰거며 지금은 호이스팅의 개념을 정리하는데 단순히 '평가'와 '실행' 용어만 사용하여 호이스팅을 정리하는데 중점을 두어 글을 작성했다. 1. var 호이스팅 js코드는 '평가'와 '실행' 과정을 거치게 된다. 이 두 과정에서 변수의 호이스팅이라는 현상이 발생한다. var 키워드로 선언된 var a= 10; 이란 코드를 보면 코드의 평가 과정에서는 a가 등록되고 값으로 undefind가 할당된다. 그리고 '실행' 과정에서 비로서 a에 10이라는 값이 할당된다. console.log(a); var a = 10; 위 코드를 보면 '평가' 과정에서는 console.log()문이 실행되지..

더보기 1. 스코프란? 2. 스코프의 종류 3. 함수 레벨 스코프 vs 블록 레벨 스코프 이 절에서는 궁극적으로 정리할 내용인 실행 컨텍스트와 클로저를 이해하는데 있어 선행되는 개념인 스코프를 정리하였다. 실행 컨텍스트와 클로저의 개념을 이해하는데 있어 '스코프' , '함수 레벨 스코프', '블록 레벨 스코프', '렉시컬 스코프'와 같은 용어들이 계속해서 사용될건데 이런 용어적인 측면에서 막힘이 없게 하기 위해 스코프라는 큰 주제로 내용들을 단순히 정리한 글이다. 따라서 스코프의 정말 심도 깊은(메모리 관점..)내용을 정리한 글이 아니다 1. 스코의 정의 변수 이름, 함수 이름, 클래스 이름 등 모든 식별자는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정된다. 이..