在JavaScript中,建構器是一個當新物件的記憶體被指派後,用來初始化該物件的一個特殊函數,物件建構器是用來建立特殊類型的對象,在物件初次被創建時,透過接收參數,用來對成員的屬性和方法進行賦值。
本教學操作環境:windows10系統、javascript1.8.5版、Dell G3電腦。
JavaScript建構器是什麼
在物件導向程式設計中,建構器是一個當新物件的記憶體被指派後,用來初始化該物件的一個特殊函數。在 JavaScript 中一切皆物件。對象建構器是用來創建特殊類型的對象,首先它要準備使用的對象,其次在對像初次被創建時,透過接收參數,用來對成員的屬性和方法進行賦值。
物件建立
建立物件的三種基本方式:
var newObject = {}; // or var newObject = Object.create( null ); // or var newObject = new Object();
在Object 建構器為特定的值建立物件封裝,或沒有傳遞值時,它將建立一個空物件並返回它。
將一個鍵值對賦給一個物件的四種方式:
// ECMAScript 3 兼容形式 // 1. “点号”法 // 设置属性 newObject.someKey = "Hello World"; // 获取属性 var key = newObject.someKey; // 2. “方括号”法 // 设置属性 newObject["someKey"] = "Hello World"; // 获取属性 var key = newObject["someKey"]; // ECMAScript 5 仅兼容性形式 // For more information see: http://kangax.github.com/es5-compat-table/ // 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 ){ var config = { value } Object.defineProperty( obj, key, config ); }; // 为了使用它,我们要创建一个“person”对象 var person = Object.create( null ); // 用属性构造对象 defineProp( person, "car", "Delorean" ); defineProp( person, "dateOfBirth", "1981" ); defineProp( person, "hasBeard", false ); // 还可以创建一个继承于Person的赛车司机 var driver = Object.create( person ); // 设置司机的属性 defineProp(driver, "topSpeed", "100mph"); // 获取继承的属性 (1981) console.log( driver.dateOfBirth ); // 获取我们设置的属性 (100mph) console.log( driver.topSpeed ); // 4. Object.defineProperties方式 // 设置属性 Object.defineProperties( newObject, { "someKey": { value: "Hello World", writable: true }, "anotherKey": { value: "Foo bar", writable: false } }); // 3和4中的读取属行可用1和2中的任意一种
基礎建構器
如我們先前所看到的, JavaScript 不支援類別的概念,但它有一個與物件一起工作的建構器函數。使用 new 關鍵字來呼叫該函數,我們可以告訴 JavaScript 把這個函數當作一個建構器來用,它可以用自己定義的成員來初始化一個物件。
在這個建構器內部,關鍵字 this 引用到剛被建立的物件。回到物件創建,一個基本的建構子看起來像這樣:
function Car( model, year, miles ) { 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 ); // 打开浏览器控制台查看这些对象toString()方法的输出值 console.log( civic.toString() ); console.log( mondeo.toString() );
上述是個簡單版本的建構子模式,但它有兩個問題:
難以繼承
#每個Car 建構函數所建立的物件中,toString() 之類的函數都被重新定義
這不是非常好,理想的情況是所有Car 類型的物件都應該引用同一個函數
使用「原型( prototype )」的建構子
在JavaScript 中函數有一個prototype 的屬性。當我們呼叫JavaScript 的建構器建立一個物件時,建構子prototype 上的屬性對於所建立的物件都能被存取和呼叫
function Car( model, year, miles ) { this.model = model; this.year = year; this.miles = miles; } // 注意这里我们使用 Object.prototype.newMethod 而不是 Object.prototype ,以避免我们重新定义原型对象 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構造器是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章!