[모던자바스크립트] WIL-3 (7.11 ~ 7.17)

  이번주는 빠르게 공부를 하기 보다는 정확한 개념을 숙지하기 위해서 공부를 했다. 이번주에 공부한 내용은 함수와 일급 객체, 프로토타입, strict mode에 대해서 공부했다. strict mode에 대해서는 단순한 규칙과 같은 느낌이기에 시간을 들여 많은 내용을 보지는 않았지만, 함수와 일급객체 그리고 스코프에 대해서는 많은 시간을 투자해서 천천히 읽고 또 읽으면서 이해하려고 노력했다.

 

  함수는 일급 객체다. 일급 객체란, 몇 가지 조건이 필요한데 무명의 리터럴로 생성할 수 있어야 하며, 변수나 객체 배열에 저장할 수도 있고, 함수의 매개변수에도 전달할 수 있으며 함수의 반환값으로 사용할 수 있는 객체를 일급 객체라고 하는데 함수는 이 모든 요건을 충족하기에 자바스크립트에 있어서 일급 객체이다. 즉 함수는 호출되는 방식에 따라 생성자 함수, 메서드, 일반 함수로서 기능을 하기도 하고 또 객체로서 객체 즉, 값이 들어갈 수 있는 자리에 들어갈 수 있다. 또 함수는 객체이기 때문에 프로퍼티를 가질 수 있고, 함수만의 프로퍼티를 갖는다.

arguments, caller, name, length, prototype 프로퍼티를 갖는데, 그 중에서도 가장 중요한 프로퍼티가 바로 prototype 프로퍼티이다. 이 prototype은 객체를 가리키며 이 객체를 통해서 prototype기반 객체 지향 프로그래밍을 만들어 내기 때문이다. 가장 중요한 상속을 prototype객체를 통해서 하기 때문이다. 하지만 한 가지 중요한것은 prototype프로퍼티는 constructor인 함수만 함수가 정의가 평가될 때 생긴다는것을 꼭 알아야 한다.(ES6 메서드 축약, 화살표 함수는 non-constructor이다.)

 

  이렇게 함수가 일급 객체이고, constructor인 함수는 prototype프로퍼티를 갖다는다는것을 배움과 동시에 바로 프로토타입을 배웠다. 자바스크립트는 객체 기반의 프로그래밍 언어이며, 자바스크립트를 이루고 있는 거의 모든 것이 객체다. 모든 객체는 프로토타입 내부 슬롯을 갖고, 이 프로토타입 내부 슬롯이 가리키는것이 해당 객체의 프로토타입 객체를 가리킨다. 이 해당 프로토타입 객체는 생성자 함수의 프로토타입 프로퍼티가 가리키는 객체이며, 프로토타입 객체는 constructor라는 프로퍼티를 갖고 constructor 프로퍼티는 해당 프로토타입 객체를 가리키고 있는 생성자 함수를 가리킨다. 즉, 생성자 함수와 프로토타입과 생성자 함수가 만들어낸 인스턴스는 한 몸이다. 객체 리터럴로 만든 객체는 어떨까? 객체리터럴로 만든 객체 또한 객체이기에 프로토타입 내부슬롯을 가지고 constructor프로퍼티를 프로퍼티 객체로부터 상속받아 접근해보면 배열리터럴의 프로토타입 constructor가 가리키는 것은 Array 생성자 함수를 가리키고, 객체 리터럴의 프로토타입 constructor가 가리키는 것은 Object 생성자 함수를 가리키고 있다. 그리고 Array 생성자 함수도 객체이기에 프로토타입 내부슬롯을 가지고 있으며 Object생성자 함수를 가리키고 있다. 즉 프로토타입과 생성자 함수는 단독으로 존재할 수 없고 언제나 쌍으로 존재한다. 이렇게 연결된 프로토타입을 일컫는 말이 프로토타입 체인이라고 말한다. 프로토타입 체인을 통해 상속을 받고, 부모 객체의 프로퍼티와 메서드를 활용할 수 있다. 한 가지 주의해야 할 점은 프로토타입 체인의 최상위에 위치하는 객체는 언제나 Object.prototype이라는 것이다. 즉 프로토타입 체인의 종점이다. 

 

  이 처럼 프로토타입은 정말 중요한 역할을 하고 있다. 위의 내용을 이해하기까지 정말 많은 시간이 걸렸다. 프로토타입, 프로토타입 객체, 프로토타입 체인 ,프로토타입 프로퍼티 등등 완전히 다른 의미이지만 읽을때는 익숙하지 않은 단어들의 연속이라 조금만 집중하지 않으면 이해하기 굉장히 어려웠다. 하지만 처음부터 차근차근 읽다보니 어느 순간 프로토타입 기반 객체 지향 프로그래밍이라는 의미를 알 수 있었다. 타 언어와 비교해서 이것이 얼마나 효율적이고 좋은 방법인지에 대해서 비교할 정도의 지식 수준을 갖추지는 못했지만, 상속을 통해서 상위 객체의 프로퍼티와 메서드를 이용할 수 있다는것만 해도 매번 해당 객체에 직접 프로퍼티와 메서드를 정의하지 않아도 된다는것 하나만으로도 정말 엄청난 이점이 있을것이라는 생각이 들었다. 생성자 함수를 통해 인스턴스를 생성할 때도 객체들마다 동일한 데이터를 갖는다면 생성자 함수의 prototype 프로퍼티에 프로퍼티와 메서드를 추가하면 단 몇 줄의 코드만 추가해도 해당 생성자 함수를 통해 만든 모든 인스턴스는 따로 구현하지 않아도 프로토타입의 메서드와 프로퍼티를 사용할 수 있으니 말이다. 이번주에 공부한 내용을 토대로 조금은 자바스크립트 언어에 대해서 이해할 수 있게 된 것 같아 매우 뿌듯하다. ㅎ

 

 

2022.07.12 - [언어 공부 및 정리/자바스크립트[모던자바스크립트]] - 18장 함수와 일급 객체

18장 함수와 일급 객체

2022.07.13 - [언어 공부 및 정리/자바스크립트[모던자바스크립트]] - 19장 프로토타입

19장 프로토타입

2022.07.16 - [언어 공부 및 정리/자바스크립트[모던자바스크립트]] - 20장 strict mode

20장 strict mode