面向對象---構造函數

時間 2021-04-04

標籤 javascript html java 函數 this prototype code htm 對象接口欄目軟件設計简体版

原文原文鏈接

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>面向對象</title>
</head>
<body>
    一：建立對象
        1.Object構造函數或對象字面量建立單個對象
        2.工廠模式：（用函數來封裝特定接口建立對象的細節）
        3.構造函數：
        4.原型模式：
        5.組合模式（最經常使用*）
        6.動態原型模式
        7.寄生構造函數模式

</body>
<script type="text/javascript">
    // 工廠模式
    function createPerson(name,age,job) {
        var o = new Object();
        o.name = name;
        o.age = age;
        o.job = job;
        o.sayName = function(){
            alert(this.name);
        }
        return o;
    }
    var person1 = createPerson("leo",29,"doctor");
    var person2 = createPerson("jack",28,'teacher');
    // 缺點：函數createPerson()可以建立根據接受的參數來構建一個包含全部必要信息的     Person對象。
   //能夠無數次的調用這個函數，而每次他都會返回三個屬性和一個方法的對象。
   //工廠模式雖然解決了建立多個相同對象的問題，但卻沒有解決對象識別的問題！！！（不懂什麼意思）


    // 構造函數模式
    function Person(name,age,job){
        this.name = name;
        this.age = age;
        this.job = job;
        this.sayName = function(){
            alert(this.name);
        }
    }
    var person1 = new Person("leo",29,"doctor");
    var person2 = new Person("jack",28,'teacher');
    // 優勢：建立自定義構造函數意味着未來咱們能夠將他的實例標識爲一種特定的類型，
    //而這正是構造函數模式賽過工廠模式的地方
    // 缺點：就是每一個方法都要在每一個實例上建立一遍，在前面的例子中person1,person2都有一個一樣的sayName方法，等於建立了兩次相同的sayName方法

    
    //原型模式
    function Person(){

    }
    Person.prototype.name = 'leo';
    Person.prototype.age = 29;
    Person.prototype.job = 'doctor';
    Person.prototype.sayName = function(){
        alert(this.name);
    }
    var person1 = new Person();
    person1.sayName();  // leo
    var person2 = new Person();
    person2.sayName();  //  leo
    alert(person1.sayName == person2.sayName);  //true 
    // 優勢：能夠讓全部的對象實例共享它所包含的全部屬性和方法，
    //換句話說沒必要在構造函數中定義對象實例的信息，而是能夠將這些信息直接添加到原型對象中
    // 缺點：省略掉了爲構造函數傳遞初始化參數的步驟，使得全部實例在默認狀況下都取得相同的屬性值
          // 屬性共享

    // 組合模式  
    // 使用構造函數模式和原型模式，構造函數定義實例屬性，原型定義方法和共享屬性
    function Person(name,age,job){
        this.name = name;
        this.age = age;
        this.job = job;
    }
    Person.prototype = {
        constructor:Person,  // 對象字面量形式會使constructor屬性重寫，因此要從新賦值
        sayName:function(){
            alert(this.name);
        }
    }

</script>
</html>