Javascript가 프로토타입 기반이라는 것은 무엇을 의미합니까?

Javascript와 OOP를 처음 배우기 시작했을 때 Javascript는 클래스가 아니라 프로토타입을 기반으로 하지만 객체 지향 언어라는 말을 계속해서 들었습니다.
이 기사에서 우리는 이것이 무엇을 의미하는지, 그리고 우리가 하고 있는 것을 인정하기 위해 프로토타입이 무엇인지 아는 것이 왜 중요한지 이해하려고 노력할 것입니다.

다른 객체 지향 언어에서는 클래스를 선언할 때 새로운 복합 데이터 유형, 즉 기본 데이터 유형으로 구성된 데이터 유형을 생성합니다. 하지만 ES2015부터 클래스라는 키워드를 사용했음에도 불구하고 자바스크립트에서는 그렇지 않습니다. 프로토타입은 개체 인스턴스입니다. 클래스는 청사진이지만 객체는 기본적으로 Javascript에서 다른 객체로부터 직접 상속됩니다.

이것이 무엇을 의미하는지 이해하려면 프로토타입 체인이 무엇인지 이해해야 합니다.

프로토타입 체인은 객체 기능을 연결하는 트리 모양의 구조이며 이 트리의 루트에는 Object.prototype이 있습니다.
Object.prototype은 toString( ), hasOwnProperty( ) 또는 keys( )와 같이 모든 객체에 표시되는 몇 가지 메서드를 제공합니다.

Javascript의 거의 모든 개체는 프로토타입 체인을 따르는 경우 Object의 인스턴스입니다. 아시다시피 Javascript의 거의 모든 것이 객체입니다. even some primitive data types (string, boolean and number specifically) can be objects for a tiny fraction of time. 따라서 배열도 객체이고 함수도 객체이며 물론 객체도 객체입니다.

프로토타입 체인을 사용하면 예를 들어 map, forEach, reduce, filter 및 big 등과 같이 배열에 사용할 수 있는 모든 메서드에 액세스할 수 있는 배열의 인스턴스를 만들 수 있습니다. .prototype 기능.

어떻게 이런 일이 발생합니까?
예제에 배열을 사용하고 있기 때문에 명확하게 하기 위해 배열은 Javascript의 구문 설탕입니다. 그것들은 배열처럼 보이고 느껴지도록 하는 특별한 동작을 가진 객체이지만 내부적으로는 다음과 같습니다.

{
  '0': value,
  '1': value,
  '2': value
}

모든 객체에는 생성자의 프로토타입 객체에 대한 참조를 보유하는 __proto__라는 속성이 있습니다. 따라서 배열 예제에 따르면 배열은 모든 배열이 Array 객체의 인스턴스이고 Array 객체가 Object 객체의 인스턴스이기 때문에 Object.prototype의 모든 메서드에 액세스할 수 있습니다. 그리고 이 체인은 null이 될 Object.prototype의 프로토타입에 도달할 때까지 계속됩니다.

이렇게 하면 개체에서 메서드를 실행하려고 할 때 먼저 JS가 개체 자체의 속성을 조회합니다. 해당 이름을 가진 속성을 찾지 못하면 생성자의 프로토타입 개체에 대한 참조를 보유하는 __proto__ 속성을 찾습니다. 찾지 못하면 생성자 개체의 __proto__ 속성을 찾습니다. 이것을 찾거나 찾지 못하고 TypeError를 던질 때까지 계속됩니다.

이것이 의미하는 바는 예를 들어 배열을 선언할 때마다 언어와 함께 제공되는 Array 객체의 인스턴스를 생성한다는 것입니다. 콘솔에서 보면 __proto__ 속성이 Array 객체에 연결되어 있음을 알 수 있습니다.



그리고 토끼 구멍을 계속 내려다보면 __proto__ 객체에 Object.prototype에 대한 참조를 보유하는 __proto__ 속성 ​​자체가 있음을 알 수 있습니다(DRY를 알고 있기 때문에 콘솔에서 모든 속성을 볼 수 있지만 참조입니다). .



그렇다면 Javascript에서 프로토타입 없이 객체를 생성하는 방법이 있을까요?

네, 있습니다. 객체를 생성하는 방법 중 하나는 Object.create( )를 사용하는 것입니다. 이 객체에 원하는 프로토타입(기본적으로 Object.prototype)을 인수로 전달할 수 있습니다. 인수로 null을 전달하면 바로 해시 테이블인 객체를 얻게 됩니다.

const objectWithoutPrototype = Object.create(null);

마음에 들면 공유하고 연결합시다! 팔로우하고 😊