JS設計模式讀書筆記之原型模式

原型樣例:

//創建一個撲克類
let Poker=function () {
    this.numbers=54;
    this.cates=4;
    this.users="classmates";
};
let poker=new Poker();
poker.numbers=52;
poker.cates=1;
poker.users="students";
Object.create=Object.create||function(obj){
    let Func=function () {};
    Func.prototype=obj;
    return new Func()
};
let clonePoker=Object.create(poker);
console.log(clonePoker);

關於__proto__屬性:


function Person(name) {
    this.name=name;
}
Person.prototype.getName=function () {
    return this.name;
};
let objectFactory = function () {
    let obj = {};//這裏類似於new Object();
    let Constructor = [].shift.call(arguments);//獲取第一個參數
    obj.__proto__ = Constructor.prototype;//對象的__proto__屬性指向Constructor.prototype屬性
    let ret = Constructor.apply(obj, arguments);//用構造函數給對象設置屬性
    return typeof ret === 'object' ? ret : obj;//保證是一個對象
};
let el=objectFactory(Person,'xuhacker');
console.log(el.name);
console.log(el.getName());
console.log(Object.getPrototypeOf(el) === Person.prototype);

關於繼承

//孫子請求父親,若無相關的屬性,則該父親會去它的構造函數的原型(孫子的爺爺)找該屬性
let obj={id:1};
//設置一個構造函數
let Func=function () {};
Func.prototype=obj;//obj的對象屬性指向構造函數的原型
let el=new Func();//這時候就能new了
console.log(el.id);//輸出1
//JS本質上是以一種基於原型創建(克隆)對象的語言,雖然在ES6裏面有了新的Class,本質上還是基於原型
//ES6裏面的面向對象
class Person {
    constructor(name){
        this.name=name;
    };
    getName(){
        return this.name;
    }
}
let person=new Person("xuhacker");
console.log(person.getName());
class Student extends Person{
    constructor(name,age){
        super(name);
        this.age=age;
    }
    getSays(){
        return 'goodnight';
    }
}
let student=new Student("lee",23);
console.log(student.age);
console.log(student.name);
console.log(student.getSays());


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章