[JavaScript] [대상] 생 성 대상, 대상 계승 의 실 용적 인 방식 및 이해

5845 단어 대상자바 script
본 고 는 특수 성명 이 없 는 상황 에서 대지 를 약정 한다.
창설 대상, 대상 계승 은 사실상 하나의 것 이다. 우리 가 필요 로 하 는 실례 대상 은 구조 함 수 를 통 해 사유 속성 을 얻 고 원형 체인 을 통 해 공 유 된 속성 을 얻는다.무엇이 좋 은 방식 입 니까?개인 속성 은 구조 함 수 를 통 해 얻 을 수 있 으 며, 다시 쓸 필요 가 없습니다. 공유 속성 은 원형 체인 을 통 해 찾 을 수 있 으 며, 중복 생 성 이 필요 없습니다.
보편적 인 방식
조합 사용 구조 함수 모드 와 원형 모드 생 성 대상
function HNU_student(name) {
    this.name = name;
    this.sayName = function() {
        return this.name;
    };
}
HNU_student.prototype = {
    school: 'HNU',
    saySchool: function() {
        return this.school;
    }
};
Object.defineProperty(HNU_student, 'constructor', {value: HNU_student});

var hiyohoo = new HNU_student('xujian');

글자 의 양 을 통 해 재 작성 prototype 되 고 원형 constructorObject 을 가리 키 며 필요 한 경우 재 정의 constructor 가 필요 하 며 Object.defineProperty() 방법 을 사용 하면 constructorenumerable 등 특성 을 초기 기본 false 으로 바 꿀 수 있다.
기생 조합 식 계승
function object(o) {
    function F() {};
    F.prototype = o;
    return new F();
}
function inheritPrototype(child, parent) {
    var prototype = object(parent.prototype);
    prototype.constructor = child;
    child.prototype = prototype;
}

function HNU_student(name) {
    this.name = name;
    this.sayName = function() {
        return this.name;
    };
}
HNU_student.prototype.school = 'HNU';
HNU_student.prototype.saySchool = function() {
    return this.school;
};

function Student_2011(name, number) {
    HNU_student.call(this, name);
    this.number = number;
    this.sayNumber = function() {
        return this.number;
    }
}
inheritPrototype(Student_2011, HNU_student);
Student_2011.prototype.graduationTime = 2015;
Student_2011.prototype.sayGraduationTime = function() {
    return this.graduationTime;
};

var hiyohoo = new Student_2011('xujian', 20110803203);
object() 의 역할: 매개 변수 로 들 어 오 는 대상 을 인 스 턴 스 의 원형 으로 바 꾸 고 이 대상 의 속성 은 모든 인 스 턴 스 에 의 해 공유 된다.
공유 속성: inheritPrototype(Student_2011, HNU_student); 서브 구조 함수 원형 은 초 구조 함수 원형 의 인 스 턴 스 가 되 고 초 구조 함수 원형 중의 속성 은 서브 구조 함수 에 공유 된다.개인 속성: HNU_student.call(this, name); 하위 구조 함수 로 인 스 턴 스 를 만 들 때 초 구조 함수 로 개인 속성 을 만 듭 니 다.
대상 을 만 드 는 다른 방식
동적 원형 모드
function HNU_student(name) {
    this.name = name;
    this.sayName = function() {
        return this.name;
    };

    if (!HNU_student.prototype.school) {
        HNU_student.prototype.school = 'HNU';
        HNU_student.prototype.saySchool = function() {
            return this.school;
        };
    }
}

var hiyohoo = new HNU_student('xujian');

원형 에 정 의 된 공유 속성 을 구조 함수 에 넣 고 판단 문 구 를 사용 하여 구조 함수 생 성 인 스 턴 스 를 처음 호출 할 때 원형 공유 속성 을 초기 화 합 니 다.
기생 구조 함수 모드
function SpecialArray() {
    var values = new Array();
    values.push.apply(values, arguments);
    values.toPipedString = function() {
        return this.join('|');
    };

    return values;
}

var colors = new SpecialArray('red', 'black', 'white');

원생 구조 함수 에 특수 한 속성 을 추가 하 는 데 사용 합 니 다.
대상 상속 의 기타 방식
조합 상속
function HNU_student(name) {
    this.name = name;
    this.sayName = function() {
        return this.name;
    };
}
HNU_student.prototype.school = 'HNU';
HNU_student.prototype.saySchool = function() {
    return this.school;
};

function Student_2011(name, number) {
    HNU_student.call(this, name);
    this.number = number;
    this.sayNumber = function() {
        return this.number;
    };
}
Student_2011.prototype = new HNU_student();    //                   
Student_2011.prototype.constructor = Student_2011;
Student_2011.prototype.graduationTime = 2015;
Student_2011.prototype.sayGraduationTime = function() {
    return this.graduationTime;
}

var hiyohoo = new Student_2011('xujian', 20110803203);

공유 속성: Student_2011.prototype = new HNU_student(); 서브 구조 함수 의 원형 은 초 구조 함수 의 원형 을 가리 키 고 인 스 턴 스 는 원형 체인 을 통 해 모든 공유 속성 을 찾 습 니 다.개인 속성: HNU_student.call(this, name); 하위 구조 함수 로 인 스 턴 스 를 만 들 때 초 구조 함수 로 개인 속성 을 만 듭 니 다.
결함: 초 구조 함수 가 두 번 호출 되 었 습 니 다.Student_2011.prototype = new HNU_student(); 이 동시에 서브 구조 함수 원형 에서 초 구조 함수 가 정의 하 는 개인 속성 을 만 들 었 습 니 다. 이 원형 들 의 개인 속성 은 인 스 턴 스 의 동명 속성 에 의 해 덮어 져 차단 되 었 습 니 다.
원형 식 계승, 기생 식 계승
function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}

var student1 = {
    school: 'HNU',
    saySchool: function() {
        return this.school;
    }
};

var student2 = object(student1);
Object.creat()ECMAScript 5 새로 추 가 된 방법 으로 두 가지 인 자 를 받 아들 인 다. 하 나 는 원형 의 원래 대상 이 고, 다른 하 나 는 속성 을 다시 쓰 거나 새로 추 가 된 대상 이 며, 역할 은 사용자 정의 object() 와 같다.
var student1 = {
    name: 'xujian',
    school: 'HNU'
};
var student2 = Object.create(student1, {
    name: {
        value: 'huangjing'
    }
});

기생 식 계승 은 원형 식 계승 을 바탕 으로 대상 을 강화 하기 위해 추가 속성 을 추가 했다.
function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}
function creatAnother(original) {
    var clone = object(original);
    clone.sayHi = function() {
        alert('Hi!');
    };
    return clone;
}

var student1 = {
    school: 'HNU',
    saySchool: function() {
        return this.school;
    }
};

var student2 = creatAnother(student1);

원형 계승 과 기생 식 계승 은 기 존 대상 과 유사 한 인 스 턴 스 대상 을 만 드 는 데 사 용 됩 니 다.
전재 출처 를 밝 혀 주 십시오:https://segmentfault.com/a/1190000004559437
글 이 비정 기적 으로 완벽 하 게 업데이트 되 었 는데, 만약 당신 에 게 약간의 깨 우 침 이 있다 면, 나 는 매우 영 광 스 럽 게 생각 할 것 입 니 다.

좋은 웹페이지 즐겨찾기