> 웹 프론트엔드 > JS 튜토리얼 > Crockford의 프로토타입 상속은 중첩된 객체와 그 상속을 어떻게 처리합니까?

Crockford의 프로토타입 상속은 중첩된 객체와 그 상속을 어떻게 처리합니까?

Barbara Streisand
풀어 주다: 2024-12-01 13:01:10
원래의
661명이 탐색했습니다.

How Does Crockford's Prototypal Inheritance Handle Nested Objects and Their Inheritance?

Crockford의 프로토타입 상속: 중첩된 객체와 상속

Douglas Crockford의 "Javascript: The Good Parts"는 객체 상속을 단순화하는 것을 옹호합니다. .create() 메소드를 사용하면 new 키워드의 함정을 피할 수 있습니다. 그러나 이 패턴을 사용할 때 중첩된 개체의 동작에 대한 우려가 발생했습니다.

문제를 설명하려면 다음 예를 고려하십시오.

var flatObj = {
    firstname: "John",
    lastname: "Doe",
    age: 23
}
var person1 = Object.create(flatObj);

var nestObj = {
    sex: "female",
    info: {
        firstname: "Jane",
        lastname: "Dough",
        age: 32  
    }
}
var person2 = Object.create(nestObj);
로그인 후 복사

위 예에서 person1 개체는 다음을 상속합니다. flatObj에서, person2 객체는 NestObj에서 상속됩니다. 상속된 객체 내에서 중첩된 객체의 속성이 수정되면 프로토타입 체인의 중첩된 객체에 영향을 미칩니다.

person1.age = 69; // Overwrites `age` in `person1`
person2.info.age = 96; // Overwrites `age` in `person2` and `nestObj`
로그인 후 복사

그 결과 변경 의도가 있었음에도 불구하고 원래 중첩된 객체가 변경됩니다. 상속된 개체에만 적용됩니다.

이 동작은 일반 개체에 대해서는 일관되지 않습니다. flatObj.age를 수정해도 person1의 age 속성에는 영향을 주지 않습니다.

flatObj.age = 23; // Only affects `flatObj`
로그인 후 복사

이 상속 패턴에서는 중첩된 개체가 일반 개체와 다르게 처리되므로 불일치가 발생합니다.

제한 사항 해결

중첩된 객체의 패턴 제한은 다음과 같이 해결할 수 있습니다. 할당하기 전에 중첩된 속성에 대한 독립 객체 생성:

person3 = {
    sex: "male"
}
person3.info = Object.create(nestObj2.info);
로그인 후 복사

이렇게 하면 person3의 info 속성은 프로토타입 체인의 중첩 객체에 대한 변경 사항에 영향을 받지 않는 독립 객체가 됩니다.

그러나 이 접근 방식은 완전히 독립적인 개체를 생성하지 않는다는 점에 유의하는 것이 중요합니다. 중첩된 개체의 속성이 상속된 개체에서 삭제되면 프로토타입 개체에서도 삭제됩니다.

delete child.x; // (child).x.a == 0, because child inherits from parent
로그인 후 복사

요약하면 중첩된 개체가 있는 Crockford의 프로토타입 상속 패턴에는 제한이 있습니다. 그러나 이러한 제한 사항은 중첩된 속성을 할당하기 전에 독립적인 개체를 생성하여 부분적으로 해결할 수 있습니다.

위 내용은 Crockford의 프로토타입 상속은 중첩된 객체와 그 상속을 어떻게 처리합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿