JavaScript 비생성자 상속

1. "비생성자"의 상속이란 무엇입니까?
예를 들어 "중국어"라는 개체가 있습니다.

코드는 다음과 같습니다.

　var Chinese = { 
　　　　nation:'中国' 
　　};

"Doctor"라는 개체도 있습니다.

코드는 다음과 같습니다.

var Doctor ={ 
　　　　career:'医生' 
　　}

어떻게 "의사"가 "중국어"를 상속받게 할 수 있는지, 즉 "중국 의사"를 생성하려면 어떻게 해야 합니까? " "의 대상은 "?
여기서 주의해야 할 점은 이 두 개체는 생성자가 아닌 일반 개체이며, 생성자 메서드를 사용하여 "상속"을 구현할 수 없다는 점입니다.

2. Object() 메소드

json 형식의 창시자인 Douglas Crockford는 이를 수행할 수 있는 object() 함수를 제안했습니다. 작은.

코드는 다음과 같습니다.

　function object(o) { 
　　　　function F() {} 
　　　　F.prototype = o; 
　　　　return new F(); 
　　}

이 object() 함수는 실제로 하위 개체의 프로토타입 속성을 가리키는 한 가지 작업만 수행합니다. 상위 개체이므로 하위 개체를 상위 개체에 연결합니다.
사용 시 첫 번째 단계는 상위 개체를 기반으로 하위 개체를 생성하는 것입니다.
　var Doctor = object(English)
그런 다음 하위 개체 자체의 속성을 추가합니다.
Doctor.career = 'Doctor';
이때, 하위 개체는 상위 개체의 속성을 상속받습니다.
　alert(Doctor.nation); //중국

3. 얕은 복사

추가로 "프로토타입 체인" 사용 , 또 다른 생각이 있습니다. 상위 개체의 모든 속성을 하위 개체에 복사하면 상속도 달성할 수 있습니다.
다음 함수를 복사하고 있습니다.

코드는 다음과 같습니다.

　function extendCopy(p) { 
　　　　var c = {}; 
　　　　for (var i in p) { 
　　　　　　c[i] = p[i]; 
　　　　} 
　　　　c.uber = p; 
　　　　return c; 
　　}

사용 시에는 다음과 같이 작성하세요.

코드는 다음과 같습니다.

var Doctor = extendCopy(Chinese); 
　　Doctor.career = '医生'; 
　　alert(Doctor.nation); // 中国

그러나 이러한 복사본에는 문제가 있습니다. 즉, 부모 객체의 속성이 배열이나 다른 객체와 같다면 실제로 자식 객체가 얻는 것은 실제 복사본이 아닌 메모리 주소뿐이므로 부모 객체가 변조되었습니다.
이제 중국어에 "출생지" 속성을 추가하세요. 해당 값은 배열입니다.
Chinese.birthPlaces = ['Beijing','Shanghai','Hong Kong'];
extendCopy() 함수를 통해 Doctor는 중국어를 상속받습니다.
　var Doctor = extendCopy(중국어);
그런 다음 Doctor의 "출생지"에 대한 도시를 추가합니다.
　Doctor.birthPlaces.push('Xiamen')
무슨 일이 일어났나요? 중국인의 '출생지'도 변경되었습니다!
Alert(Doctor.birthPlaces); //Beijing, Shanghai, Hong Kong, Xiamen
Alert(China.birthPlaces); //Beijing, Shanghai, Hong Kong, Xiamen
그래서, extendCopy()는 복사만 합니다. 데이터의 기본 유형인 이 복사본을 "얕은 복사본"이라고 부릅니다. 이것이 초기 jQuery에서 상속이 구현된 방식입니다.

4. Deep Copy

소위 "Deep Copy"란 배열과 객체를 진정한 의미로 복사하는 기능입니다. 구현은 어렵지 않습니다. 그냥 "shallow copy"를 재귀적으로 호출하면 됩니다.

코드는 다음과 같습니다.

function deepCopy(p, c) { 
　　　　var c = c || {}; 
　　　　for (var i in p) { 
　　　　　　if (typeof p[i] === 'object') { 
　　　　　　　　c[i] = (p[i].constructor === Array) ? [] : {}; 
　　　　　　　　deepCopy(p[i], c[i]); 
　　　　　　} else { 
　　　　　　　　　c[i] = p[i]; 
　　　　　　} 
　　　　} 
　　　　return c; 
　　}

사용할 때는 다음과 같이 작성합니다.
var Doctor = deepCopy(중국어)
이제, add 값이 배열인 속성입니다. 그런 다음 하위 개체에서 이 속성을 수정합니다.

코드는 다음과 같습니다.

Chinese.birthPlaces = ['北京','上海','香港']; 
Doctor.birthPlaces.push('厦门');

이 때 상위 개체는 영향을 받지 않습니다.

코드는 다음과 같습니다.

alert(Doctor.birthPlaces); //北京, 上海, 香港, 厦门 
alert(Chinese.birthPlaces); //北京, 上海, 香港

현재 jQuery 라이브러리에서는 이 상속 방식을 사용하고 있습니다.

【관련 추천 튜토리얼】

1. JavaScript 동영상 튜토리얼
JavaScript 온라인 매뉴얼
3. 부트스트랩 튜토리얼