자바스크립트 객체지향 프로그래밍 (3) 비생성자 함수의 상속_js 객체지향

오늘은 생성자를 사용하지 않고 "상속"을 소개하는 마지막 부분입니다.
1. "비생성자"의 상속이란 무엇입니까?
예를 들어 "중국어"라는 개체가 있습니다.

코드 복사 코드는 다음과 같습니다.

var Chinese = {
nation: '중국'
　};

"닥터"라는 개체가 또 있습니다.

코드 복사 코드는 다음과 같습니다.

var Doctor ={
경력: 'Doctor'
　}

"Doctor"가 " Chinese"를 상속받게 하려면 어떻게 해야 할까요?
여기서 주의해야 할 점은 이 두 개체는 생성자가 아닌 일반 개체이며, 생성자 메서드를 사용하여 "상속"을 구현할 수 없다는 점입니다.
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(중국어)
　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"를 재귀적으로 호출하면 됩니다.




코드 복사


코드는 다음과 같습니다.
함수 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(중국어);
이제 값을 배열로 사용하여 상위 개체에 속성을 추가합니다. 그런 다음 하위 개체에서 이 속성을 수정합니다.

코드 복사 코드는 다음과 같습니다.

　 Chinese.birthPlaces = ['Beijing','Shanghai','Hong Kong'];
Doctor.birthPlaces.push('Xiamen')

이때 부모는 개체는 영향을 받지 않습니다.

코드 복사 코드는 다음과 같습니다.

　alert(Doctor.birthPlaces) // Beijing, Shanghai , Hong Kong, Xiamen
　alert(China.birthPlaces); //Beijing, Shanghai, Hong Kong

현재 jQuery 라이브러리에서는 이 상속 방법을 사용합니다.
(끝)