js類式繼承與原型式繼承詳解

字號(hào):


    本文實(shí)例為大家分享了js類式繼承與原型式繼承相關(guān)代碼,供大家參考,具體內(nèi)容如下
    1.js類式繼承
    /* -- 類式繼承 -- */
    //先聲明一個(gè)超類
    function Person(name) {
    this.name = name;
    }
    //給這個(gè)超類的原型對(duì)象上添加方法 getName 
    Person.prototype.getName = function() {
    return this.name;
    }
    //實(shí)例化這個(gè)超
    var a = new Person('Darren1')
    console.log(a.getName());//Darren1
    //再聲明類
    function Programmer(name, sex) {
    //這個(gè)類中要調(diào)用超類Person的構(gòu)造函數(shù),并將參數(shù)name傳給它
    Person.call(this, name);
    this.sex = sex;
    }
    //這個(gè)子類的原型對(duì)象等于超類的實(shí)例
    Programmer.prototype = new Person();
    //因?yàn)樽宇惖脑蛯?duì)象等于超類的實(shí)例,所以prototype.constructor這個(gè)方法也等于超類構(gòu)造函數(shù),你可以自己測試一下,如果沒這一步,console.log(Programmer.prototype.constructor這個(gè)是Person超類的引用,所以要從新賦值為自己本身
    console.log(Programmer.prototype.constructor);
    /*function Person(name) {
    this.name = name;
    } */
    Programmer.prototype.constructor = Programmer;
    console.log(Programmer.prototype.constructor);
    /*function Programmer(name, sex) {
    Person.call(this, name);
    this.sex = sex;
    } 
    */
    //子類本身添加了getSex 方法
    Programmer.prototype.getSex = function() {
    return this.sex;
    }
    //實(shí)例化這個(gè)子類
    var _m = new Programmer('Darren2', 'male');
    //自身的方法
    console.log(_m.getSex());//male
    //繼承超類的方法
    console.log(_m.getName());//Darren2
    2.js原型式繼承
    /* -- 原型式繼承 -- */
    //clone()函數(shù)用來創(chuàng)建新的類Person對(duì)象
    var clone = function(obj) {
    4
    var _f = function() {};
    //這句是原型式繼承最核心的地方,函數(shù)的原型對(duì)象為對(duì)象字面量
    _f.prototype = obj;
    return new _f;
    }
    //先聲明一個(gè)對(duì)象字面量
    var Person = {
    name: 'Darren',
    getName: function() {
    return this.name;
    }
    }
    //不需要定義一個(gè)Person的子類,只要執(zhí)行一次克隆即可
    var Programmer = clone(Person);
    //可以直接獲得Person提供的默認(rèn)值,也可以添加或者修改屬性和方法
    alert(Programmer.getName())
    Programmer.name = 'Darren2'
    alert(Programmer.getName())
    //聲明子類,執(zhí)行一次克隆即可
    var Someone = clone(Programmer);
    以上就是本文的全部內(nèi)容,希望對(duì)大家學(xué)習(xí)javascript程序設(shè)計(jì)有所幫助。