您好,登錄后才能下訂單哦!
本文實例講述了JavaScript編程設計模式之構造器模式。分享給大家供大家參考,具體如下:
經典的OOP語言中,構造器(也叫構造函數)是一個用于初始化對象的特殊方法。在JS中,因為一切皆對象,對象構造器經常被提起。
對象構造器用于建立制定類型(Class)的對象,可以接受參數用于初始化對象的屬性和方法。
對象建立
在JS中,有三個常用的方法用于建立對象:
//1, 推薦使用 var newObject = {}; //2, var newObject = Object.create( null ); //3, 不推薦 var newObject = new Object();
但是,這也只是建立了三個空對象, 并沒有任何屬性和方法。我們可以通過以下四種方法,為對象設立屬性和方法。
// ECMAScript 3 兼容的方式 // 1. 常規對象定義方式 //設置屬性 newObject.someKey = "Hello World"; //獲取屬性 var key = newObject.someKey; // 2. 方括號方式 // 設置屬性 newObject["someKey"] = "Hello World"; //獲取屬性 var key = newObject["someKey"]; // 僅僅用于ECMAScript 5 // 3. Object.defineProperty // 設置屬性 Object.defineProperty( newObject, "someKey", { value: "for more control of the property's behavior", writable: true, enumerable: true, configurable: true }); //可以通過下面的函數簡化屬性設置 var defineProp = function ( obj, key, value ){ config.value = value; Object.defineProperty( obj, key, config ); }; // 使用方法 var person = Object.create( null );defineProp( person, "car", "Delorean" ); defineProp( person, "dateOfBirth", "1981" ); defineProp( person, "hasBeard", false ); // 4. Object.defineProperties //設置屬性 Object.defineProperties( newObject, { "someKey": { value: "Hello World", writable: true }, "anotherKey": { value: "Foo bar", writable: false } }); // 3和4的獲取屬性方法同1,2.
基本的構造器
我們知道, JS中沒有Class的概念,但它也支持用構造器建立對象。
通過使用【new】關鍵字,我們可以使一個函數的舉止類似于構造器,從而建立自己的對象實例。
一個基礎的構造器形式如下:
function Car( model, year, miles ) { //這里,this指向新建立的對象自己 this.model = model; this.year = year; this.miles = miles; this.toString = function () { return this.model + " has done " + this.miles + " miles"; }; } //用法 // 建立兩個car實例 var civic = new Car( "Honda Civic", 2009, 20000 ); var mondeo = new Car( "Ford Mondeo", 2010, 5000 ); // 輸出結果 console.log( civic.toString() ); console.log( mondeo.toString() );
這就是簡單的構造器模式, 它有兩個主要問題,
第一,它很難繼承;第二,toString()被每一個對象實例定義一遍,作為函數,它應該被每一個Car類型的實例共享。
使用原型的構造器
JS中有一個很好的特性:原型【Prototype】,
利用它,建立對象時,所有構造器原型中的屬性都可以被對象實例獲得。
這樣多個對象實例就可以共享同一個原型。
我們改善前面的Car例子如下:
function Car( model, year, miles ) { this.model = model; this.year = year; this.miles = miles; } Car.prototype.toString = function () { return this.model + " has done " + this.miles + " miles"; }; // 用法 var civic = new Car( "Honda Civic", 2009, 20000 ); var mondeo = new Car( "Ford Mondeo", 2010, 5000 ); //輸出 console.log( civic.toString() ); console.log( mondeo.toString() );
在上面的例子中,toString()方法被多個Car對象實例共享。
更多關于JavaScript相關內容可查看本站專題:《javascript面向對象入門教程》、《JavaScript切換特效與技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。