Skip to content

Latest commit

 

History

History
24 lines (17 loc) · 2.68 KB

prototype.md

File metadata and controls

24 lines (17 loc) · 2.68 KB

https://mooneedev.netlify.app/JavaScript/%ED%94%84%EB%A1%9C%ED%86%A0%ED%83%80%EC%9E%85/

프로토타입

먼저 프로토타입이란?

  • 먼저, 클래스 언어와 달리 자바스크립트에는 클래스가 없습니다. 대신, 자바스크립트는 기존 객체의 프로토타입을 복사하여 새로운 객체를 생성합니다.
  • 따라서 자바스크립트의 모든 객체는 자신의 원형이 되는 객체를 가지며, 이 원형이 되는 객체를 '프로토타입'이라고 합니다.
  • 어떠한 객체/함수를 생성했을 때 prototype 프로퍼티로 해당 객체의 원형이 되는 프로토타입 객체를 참조하게 됩니다.
  • 그리고 해당 프로토타입 객체에서는 constructor 프로퍼티로 원본 객체를 참조하게 됩니다.
  • 만약 new 키워드로 해당 객체/함수의 인스턴스를 생성한다면 해당 인스턴스에서는 __proto__ 프로퍼티로 원본 객체의 프로토타입 객체에 접근 가능합니다.

프로토타입 체이닝이란?

  • 자바스크립트는 기존 객체의 프로토타입을 복사하여 새로운 객체를 생성합니다.
  • 따라서, 만약 어떤 객체에 특정 프로퍼티를 참조했는데, 해당 객체에 프로퍼티가 존재하지 않을경우 __proto__ 프로퍼티를 참조하여 상위 객체의 프로토타입에 해당 프로퍼티가 존재하는지 찾습니다. 만약에 존재한다면 해당 프로퍼티를 참조하게 되고 아니면 또 다시 __proto__ 를 참조하여 더 상위 객체 프로토타입에서 해당 프로퍼티를 찾습니다.
  • 이렇게 특정 프로퍼티를 참조할 때, __proto__ 링크를 계속 참조하여 참조하는 프로퍼티를 찾는 것을 프로토타입 체이닝이라고 합니다.
  • 예를 들면 일반 문자열 변수를 선언할 때에도 프로토타입 체이닝을 쉽게 경험할 수 있습니다.
  • 만약 const v = 'hello' 와 같은 변수를 선언한 후 v.toUpperCase() 라는 메서드를 실행하는 상황을 떠올리면 쉽습니다. 우리는 v 변수에 toUpperCase 라는 프로퍼티를 정의한 적이 없는데 잘 실행이 됩니다. 이는 변수 v 가 String 객체의 인스턴스이며, 따라서 String 객체의 프로토타입에 존재하는 toUpperCase 라는 메서드를 참조하고 있음을 가리킵니다.

쉐도잉 현상

  • 객체에서 어떤 프로퍼티를 찾을 때, 해당 객체와 이 객체를 기점으로 한 prototype 연쇄의 상위 수준 두 곳에서 동시에 발견될 때 쉐도잉 현상이 일어납니다.
  • 즉, 해당 객체에 직속으로 연결되어있는 프로퍼티 때문에, 상위 연쇄의 프로퍼티가 가려지는 현상입니다.