js創(chuàng)建對象的幾種模式

JaysonWang 發(fā)布于2019-08-19 17:51 / 1173人閱讀

摘要：組合使用構造函數(shù)模式和原型模式推薦例子所有實例共享原型中的屬性和方法相同的屬性在構造函數(shù)中定義。穩(wěn)妥構造函數(shù)模式穩(wěn)妥對象指的是沒有公共屬性，而且其方法也不再引用的對象。

1.工廠模式

例子：

function createPerson(name,age){
    var o = new Object();
    o.name = name;
    o.age = age;
    o.sayName = function () {
        alert(this.name);
    }
    return o;    
}
var person1 = createPerson("EvanChen",18,"Software Engineer");//創(chuàng)建一個對象

問題：沒有解決對象識別問題

    alert(person1 instanceof createPerson)//fasle 會發(fā)現(xiàn)其實并不存在一個createPerson類

2.構造函數(shù)模式

例子：

    function Person(name,age){
        this.name = name;
        this.age = age;
        this.sayName = function(){
            alert(this.name);
        }
    }
    var p1 = new Person("EvanChen",18);//創(chuàng)建一個Person類

用new操作符調(diào)用構造函數(shù)經(jīng)歷了以下4個步驟：

(1)創(chuàng)建一個新對象

(2)將構造函數(shù)的作用域賦給新對象

(3)執(zhí)行構造函數(shù)中的代碼

(4)返回新對象

解決了工廠模式兌現(xiàn)識別問題：

alert(typeof(p1));// Person
alert(p1 instanceof(Person));// true

3.原型模式

例子：

    function Person(){        
    }
    Person.prototype.name = "EvanChen";
    Person.prototype.age= 18;
    Person.prototype.sayName= function(){
        alert(this.name);
    }
    
    var p1 = new Person();
    p1.sayName(); //"EvanChen"
    
    var p2 = new Person();
    p2.sayName(); //"EvanChen"
    
    alert(p1.sayName == p2.sayName); //true

將所有屬性和方法都加在Person的prototype屬性中，因此新對象具有相同的屬性和方法。

4.組合使用構造函數(shù)模式和原型模式（推薦）

例子：

function Person(name,age){
    this.name = name;
    this.age = age;
    this.friends = ["Shelby","Court"];
};

Person.prototype = {
    constructor:Person,
    sayName:function(){
        alert(this,name);
    }
}
//Person.prototype.sayName = function(){
//   return this.name;
//};

var person1 = new Person("EvanChen",18);
var person2 = new Person("Greg",16);

person1.friends.push("Van");
alert(person1.friends);//"Shelby,Court,Van"
alert(person2.friends);//"Shelby,Court"
alert(person1.friends == person2.friends);//false
alert(person1.sayName == person2.sayName );//true

所有實例共享原型中的屬性constructor和方法sayName(),相同的屬性在構造函數(shù)中定義。

5.動態(tài)原型模式（推薦）

例子：

function Person(name,age){
    this.name = name;
    this.age = age;
    if (typeof this.sayName != "function"){
        Person.prototype.sayName = function(){
            alert(this.name);
        };
    }
};
var person1 = new Person("EvanChen",18);
person1.sayName();

在sayName()方法不存在的情況下，才會將它添加到原型中，當原型完成初始化后，能夠立即在所有實例中得到共享。

6.寄生構造函數(shù)模式

基本思想是：創(chuàng)建一個函數(shù)，該函數(shù)的作用僅僅是封裝對象的代碼，然后再返回新構建函數(shù)的對象
例子：

function SpecialArray(){
    var values = new Array();//創(chuàng)建數(shù)組
    values.push.apply(values,arguments);//添加值
    values.toPipedString = function () {
        return this.join("|");
    }//添加方法
    return values//返回數(shù)組    
}

var colors = new SpecialArray("red","blue","green");
alert(colors.toPipedString());//red|blue|green

構造函數(shù)返回的對象與構造函數(shù)外部創(chuàng)建的對象沒有什么不同，因此不能依賴instanceof操作符來確定對象類型。

7.穩(wěn)妥構造函數(shù)模式

穩(wěn)妥對象指的是沒有公共屬性，而且其方法也不再引用this的對象。穩(wěn)妥對象最適合在一些安全的環(huán)境中，或者防止數(shù)據(jù)被其他應用程序刪改時使用。

例子：

function Person(name, age) {
    //創(chuàng)建要返回的對象
    var o = new Object();
    //定義私有變量和函數(shù)
    o.sayName = function (){
        alert(name);
    }
    return o;
}

var person1 = Person("EvanChen", 18);
person1.sayName();//"EvanChen"

在這種模式創(chuàng)建的對象中，除了使用sayName()方法外，沒有其他方法訪問name的值。

云服務器 GPU云服務器 java創(chuàng)建對象的幾種方式 js 創(chuàng)建對象安全模式 js的幾種數(shù)據(jù)類型 js緩存的幾種方法

文章版權歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/78910.html

js 創(chuàng)建對象的幾種方式

摘要：可以無數(shù)次地調(diào)用這個函數(shù)，而每次它都會返回一個包含三個屬性一個方法的對象構造函數(shù)模式原型模式組合使用構造函數(shù)模式和原型模式創(chuàng)建自定義類型的最常見方式，就是組合使用構造函數(shù)模式與原型模式。 JS中創(chuàng)建對象的主要模式有工廠模式工廠模式抽象了具體創(chuàng)建對象的過程例如 function?createPerson(name,?age,?job){ ????var?o?=?new?Object(...

seanlook 2019-08-22 14:03 評論0 收藏0
JS中創(chuàng)建對象的幾種設計模式

摘要：構造函數(shù)模式定義構造函數(shù)模式是語言創(chuàng)建對象的通用方式。但兩種語言用構造函數(shù)創(chuàng)建對象的方式略有不同在中沒有類的概念，函數(shù)即為一等公民，因此，不必顯式聲明某個類，直接創(chuàng)建構造函數(shù)即可，類的方法和屬性在構造函數(shù)中或原型對象上處理。工廠模式定義：工廠模式非常直觀，將創(chuàng)建對象的過程抽象為一個函數(shù)，用函數(shù)封裝以特定接口創(chuàng)建對象的細節(jié)。通俗地講，工廠模式就是將創(chuàng)建對象的語句放在一個函數(shù)里，通...

Galence 2019-08-23 15:34 評論0 收藏0
細節(jié)：js 創(chuàng)建對象的幾種模式舉例

摘要：工廠模式不推薦應該把方法放在函數(shù)的外面，避免重復創(chuàng)建該方法定義的不是構建函數(shù)，因該使用方法創(chuàng)建實例，而不是方法不要忘記在函數(shù)的最后構造函數(shù)模式不推薦使用指代，函數(shù)無需明確應該把方法放在函數(shù)的外面，避免重復創(chuàng)建該方法原型模式不推薦函數(shù)中不對屬工廠模式（不推薦） var sayName = function(){ return this.name; }; function cr...

laznrbfe 2019-08-19 17:08 評論0 收藏0
js面向對象淺析---對象創(chuàng)建的幾種常見方式

摘要：前言雖然使用構造函數(shù)或者使用對象字面量可以很方便的用來創(chuàng)建一個對象，但這種方式有一個明顯的缺點使用一個接口創(chuàng)建多個對象會產(chǎn)生很多冗余的代碼。即調(diào)用構造函數(shù)所創(chuàng)建的那個對象的原型對象好處是可以讓所有對象的實例共享他的屬性的方法。前言雖然使用Object構造函數(shù)或者使用對象字面量可以很方便的用來創(chuàng)建一個對象，但這種方式有一個明顯的缺點：使用一個接口創(chuàng)建多個對象會產(chǎn)生很多冗余的代碼。因此...

Invoker 2019-08-21 10:46 評論0 收藏0
JS對象創(chuàng)建的幾種方式

摘要：上述每次都需要寫可以優(yōu)化但是此處改變了的屬性，故我們需要顯示的指出構造函數(shù)和原型組合模式二創(chuàng)建空對象前兩種方式創(chuàng)建的對象含有原型，最后一種方式創(chuàng)建的對象無原型，是真正意義上的空對象參考資料一.創(chuàng)建對象的幾種方式 1. 使用new關鍵字創(chuàng)建 var ob = new Object() ob.name = name ob.say = function() {} 2.使用字面量的方式創(chuàng)建 ...

ixlei 2019-08-26 10:23 評論0 收藏0