ES5_對象 與 繼承

1. 對象的定義

　　//定義對象
　　function User(){

        //在構造方法中定義屬性
        this.name = '張三';
        this.age = 12;

        //在構造方法中定義方法：
        this.run = function(){
            alert(this.name + '在跑步')
        }
    }

    //原型鏈中定義屬性
    User.prototype.sex = '男';

    //原型鏈中定義方法
    User.prototype.work = function(){
        alert(this.name + '在工作')
    }

    // 靜態方法的聲明
    User.getInfo =  function () {
        alert('我是靜態方法')
    }

    //對象的使用: 實例化對象
    var user = new User('張三',  3);

    //屬性的調用
    alert('姓名：'+ user.name + '; 性別：' + user.sex); // 彈出：  姓名：張三; 性別：男

    //給對象屬性重新賦值
    user.name = '李四';
    user.sex = '女';

    //方法的調用
    user.run(); // 彈出：李四在跑步
    user.work(); // 彈出：李四在工作

    //靜態方法的調用
    User.getInfo(); // 彈出:  我是靜態方法

註意： 原型鏈中聲明屬性將會多個實例共用，而構造函數不會

對象的繼承

1. 對象的繼承 之 對象冒充繼承

 function User(){
        this.name = '張三';
        //在構造方法中定義方法：
        this.run = function(){
            alert(this.name + '在跑步')
        }
    }

    //原型鏈中定義屬性
    User.prototype.sex = '男';

    //原型鏈中定義方法
    User.prototype.work = function(){
        alert(this.name + '在工作')
    }

    //對象中的繼承一： 對象冒充繼承
    function Student(){
        
        //Student 繼承 User對象，此方法叫： 對象冒充繼承
        User.call(this);
    }

    var student = new Student();
    student.run(); // 彈出：張三在跑步
    student.work(); //報錯，原因是：  對象冒充繼承的方法只繼承對象的構造函數的屬性和方法

註意： 對象冒充繼承的方法 只能 繼承對象的構造函數的屬性和方法，不能 繼承原型鏈中的函數和方法

2. 對象的繼承 之 原型鏈繼承

 function User(){
        this.name = '張三';
        //在構造方法中定義方法：
        this.run = function(){
            alert(this.name + '在跑步')
        }
    }

    //原型鏈中定義屬性
    User.prototype.sex = '男';

    //原型鏈中定義方法
    User.prototype.work = function(){
        alert(this.name + '在工作')
    }

    //對象中的繼承一： 原型鏈繼承實現繼承
    function Student(){
    }
    Student.prototype = new User();

    var student = new Student();
    student.run(); // 彈出：張三在跑步
    student.work(); // 彈出：張三在工作

註意：原型鏈繼承的方法 可以 繼承對象的構造函數的屬性和方法，也可以 繼承原型鏈中的函數和方法

　　function User(name){
        this.name = name;
        //在構造方法中定義方法：
        this.run = function(){
            alert(this.name + '在跑步')
        }
    }

    //原型鏈中定義屬性
    User.prototype.sex = '男';

    //原型鏈中定義方法
    User.prototype.work = function(){
        alert(this.name + '在工作')
    }

    //帶參數對象的實例化方法： 
    var user1 = new User('張三');
    user1.run(); // 彈出： 張三在跑步
    user1.work(); // 彈出：張三在工作


    //對象中的繼承一： 原型鏈繼承實現繼承
    function Student(name){
    }
    Student.prototype = new User();

    var student = new Student('李四');
    student.run(); // 彈出： undefined在跑步
    student.work(); // 彈出：undefined在工作

註意：原型鏈繼承有個缺點就是 在實例化子類時，無法 給父類傳參，如上代碼，子類調用父類的方法時， 彈出傳參屬性為 undefined

為瞭解決此缺點，則可以使用  冒充對象繼承 + 原型鏈繼承的組合模式

3.  冒充對象繼承 + 原型鏈繼承的組合模式

function User(name){
        this.name = name;
        //在構造方法中定義方法：
        this.run = function(){
            alert(this.name + '在跑步')
        }
    }

    //原型鏈中定義屬性
    User.prototype.sex = '男';

    //原型鏈中定義方法
    User.prototype.work = function(){
        alert(this.name + '在工作')
    }


    //對象中的繼承一： 原型鏈繼承實現繼承
    function Student(name){

        //冒充對象繼承時，可以給父類傳參
        User.call(this, name);
    }
   
    //原型鏈繼承父類
    //Student.prototype = new User();

    //因冒充對象繼承時，已經繼承了父類的構造函數中的屬性和方法，因此在原型鏈繼承中也可只繼承父類的原型鏈的屬性和方法，即
    Student.prototype = User.prototype;
    
    
    var student = new Student('李四');
    student.run(); // 彈出： 李四在跑步
    student.work(); // 彈出：李四在工作