JavaScript 프로토타입 상속에 대한 빠른 소개

프로토타입 상속은 JavaScript에서 개체 전체에서 재사용 가능한 속성과 메서드를 공유하는 방법입니다. 이 기사에서 우리는 그것이 어떻게 작동하는지 볼 것입니다.

다음 객체로 사용자를 표현했다고 가정해 보겠습니다.

let user = {
  name: 'John Snow',

  getName() {
    return this.name;
  },
};

추가 isAdmin 속성이 true 로 설정된 동일한 모양과 기능을 가진 관리 사용자가 필요합니다. 반복하지 않고 프로토타입 상속을 통해 이를 달성하는 방법은 다음과 같습니다.

let user = {
  // ...
};

let admin = Object.create(user);
admin.isAdmin = true; // "isAdmin" is a new property set only in `admin`
admin.name = 'Daenerys Targaryen'; // "name" is an inherited property that is overwritten

console.log(admin.getName()); // Daenerys Targaryen ("getName" is also inherited from `user`)

Object.create(user)를 호출하여 user의 프로토타입을 admin 만들었습니다. 이는 user ~ admin 의 모든 속성과 메서드에 액세스할 수 있음을 의미합니다.

프로토타입 체인

user.getName() 및 admin.geName() 를 호출하면 두 가지 다른 일이 발생합니다.

우리는 getName에서 직접 user를 찾지만 admin에서는 찾지 않습니다.

admin 의 경우 프로토타입( user )에서 암묵적으로 한 단계 더 나아가 파악하기 어려운 getName 을 찾습니다.

프로토타입에 도달하기 위해 한 단계 더 나아가 프로토타입 체인을 살펴보고 있습니다. 예를 들어 다음과 같이 루트 사용자를 도입하면 이 체인이 확장될 수 있습니다.

let user = {
  //...
};

let admin = Object.create(user);
//...

let root = Object.create(admin);
root.isRoot = true;
root.name = 'Night King';

console.log(root.getName()); // Night King (inherited from `user`)
console.log(root.isAdmin); // true (inherited from `admin`)
console.log(root.isRoot); // true (proper to `root`)

여기에서 root.getName 를 조회할 때 user 프로토타입까지 프로토타입 체인을 살펴봅니다.

ES6 클래스

ES6 클래스와 해당 인스턴스도 이면에서 프로토타입을 사용합니다. 생성자를 정의하면 모든 속성과 메서드가 prototype 속성에 저장됩니다. User 클래스와 일부 인스턴스를 정의하여 실제로 작동하는지 살펴보겠습니다.

class User {
  constructor(name) {
    this.name = name;
  }

  getName() {
    return this.name;
  }
}

const user1 = new User('Joe');
const user2 = new User('Kim');

console.log(User.prototype === user1.__proto__); // true
console.log(user1.__proto__ === user2.__proto__); // true

보시다시피 생성자와 인스턴스는 모두 동일한 프로토타입을 공유합니다. 생성자에서 prototype를 사용하고 인스턴스에서 __proto__를 사용하여 프로토타입에 액세스합니다.

마무리

개체 간에 속성과 메서드를 공유하는 것은 코드를 재사용 가능하고 체계적으로 만들 수 있기 때문에 중요합니다. 프로토타입 상속이라는 개념을 통해 JavaScript에서 이를 달성합니다. 프로토타입은 동일한 속성과 메서드를 찾는 다른 객체가 참조하는 객체입니다. 프로토타입은 또한 프로토타입을 가질 수 있으며 프로토타입 체인을 형성하는 식으로 프로토타입을 가질 수 있습니다. 주어진 개체에서 속성이나 메서드를 직접 찾을 수 없을 때 이 사슬을 거칩니다.