建站
咨詢
售后
建站咨詢
新聞中心
本文小編為大家詳細(xì)介紹“JavaScript構(gòu)造器怎么創(chuàng)建”，內(nèi)容詳細(xì)，步驟清晰，細(xì)節(jié)處理妥當(dāng)，希望這篇“JavaScript構(gòu)造器怎么創(chuàng)建”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學(xué)習(xí)新知識吧。
曲陽網(wǎng)站建設(shè)公司成都創(chuàng)新互聯(lián),曲陽網(wǎng)站設(shè)計(jì)制作，有大型網(wǎng)站制作公司豐富經(jīng)驗(yàn)。已為曲陽近1000家提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\成都外貿(mào)網(wǎng)站建設(shè)要多少錢，請找那個(gè)售后服務(wù)好的曲陽做網(wǎng)站的公司定做！
在JavaScript中，構(gòu)造器是一個(gè)當(dāng)新建對象的內(nèi)存被分配后，用來初始化該對象的一個(gè)特殊函數(shù)，對象構(gòu)造器是被用來創(chuàng)建特殊類型的對象，在對象初次被創(chuàng)建時(shí)，通過接收參數(shù)，用來對成員的屬性和方法進(jìn)行賦值。
本教程操作環(huán)境：windows10系統(tǒng)、javascript1.8.5版、Dell G3電腦。
JavaScript構(gòu)造器是什么
在面向?qū)ο缶幊讨校瑯?gòu)造器是一個(gè)當(dāng)新建對象的內(nèi)存被分配后，用來初始化該對象的一個(gè)特殊函數(shù)。在 JavaScript 中一切皆對象。 對象構(gòu)造器是被用來創(chuàng)建特殊類型的對象，首先它要準(zhǔn)備使用的對象，其次在對象初次被創(chuàng)建時(shí)，通過接收參數(shù)，用來對成員的屬性和方法進(jìn)行賦值。
對象創(chuàng)建
創(chuàng)建對象的三種基本方式:
var newObject = {};
// or
var newObject = Object.create( null );
// or
var newObject = new Object();在 Object 構(gòu)造器為特定的值創(chuàng)建對象封裝，或者沒有傳遞值時(shí)，它將創(chuàng)建一個(gè)空對象并返回它。
將一個(gè)鍵值對賦給一個(gè)對象的四種方式:
// ECMAScript 3 兼容形式
// 1. “點(diǎn)號”法
// 設(shè)置屬性
newObject.someKey = "Hello World";
// 獲取屬性
var key = newObject.someKey;
// 2. “方括號”法
// 設(shè)置屬性
newObject["someKey"] = "Hello World";
// 獲取屬性
var key = newObject["someKey"];
// ECMAScript 5 僅兼容性形式
// For more information see: http://kangax.github.com/es5-compat-table/
// 3. Object.defineProperty方式
// 設(shè)置屬性
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 );
};
// 為了使用它，我們要?jiǎng)?chuàng)建一個(gè)“person”對象
var person = Object.create( null );
// 用屬性構(gòu)造對象
defineProp( person, "car", "Delorean" );
defineProp( person, "dateOfBirth", "1981" );
defineProp( person, "hasBeard", false );
// 還可以創(chuàng)建一個(gè)繼承于Person的賽車司機(jī)
var driver = Object.create( person );
// 設(shè)置司機(jī)的屬性
defineProp(driver, "topSpeed", "100mph");
// 獲取繼承的屬性 (1981)
console.log( driver.dateOfBirth );
// 獲取我們設(shè)置的屬性 (100mph)
console.log( driver.topSpeed );
// 4. Object.defineProperties方式
// 設(shè)置屬性
Object.defineProperties( newObject, {
"someKey": {
value: "Hello World",
writable: true
},
"anotherKey": {
value: "Foo bar",
writable: false
}
});
// 3和4中的讀取屬行可用1和2中的任意一種基礎(chǔ)構(gòu)造器
正如我們先前所看到的，JavaScript 不支持類的概念，但它有一種與對象一起工作的構(gòu)造器函數(shù)。使用 new 關(guān)鍵字來調(diào)用該函數(shù)，我們可以告訴 JavaScript 把這個(gè)函數(shù)當(dāng)做一個(gè)構(gòu)造器來用，它可以用自己所定義的成員來初始化一個(gè)對象。
在這個(gè)構(gòu)造器內(nèi)部，關(guān)鍵字 this 引用到剛被創(chuàng)建的對象。回到對象創(chuàng)建，一個(gè)基本的構(gòu)造函數(shù)看起來像這樣:
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";
};
}
// 使用:
// 我們可以實(shí)例化一個(gè)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() );上述是個(gè)簡單版本的構(gòu)造器模式，但它有兩個(gè)問題：
難以繼承
每個(gè) Car 構(gòu)造函數(shù)創(chuàng)建的對象中，toString() 之類的函數(shù)都被重新定義
這不是非常好，理想的情況是所有 Car 類型的對象都應(yīng)該引用同一個(gè)函數(shù)
使用“原型( prototype )”的構(gòu)造器
在 JavaScript 中函數(shù)有一個(gè) prototype 的屬性。當(dāng)我們調(diào)用 JavaScript 的構(gòu)造器創(chuàng)建一個(gè)對象時(shí)，構(gòu)造函數(shù) prototype 上的屬性對于所創(chuàng)建的對象來說都能被訪問和調(diào)用
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() );通過上面代碼，單個(gè) toString() 實(shí)例被所有的 Car 對象所共享了。
讀到這里，這篇“JavaScript構(gòu)造器怎么創(chuàng)建”文章已經(jīng)介紹完畢，想要掌握這篇文章的知識點(diǎn)還需要大家自己動(dòng)手實(shí)踐使用過才能領(lǐng)會，如果想了解更多相關(guān)內(nèi)容的文章，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
當(dāng)前名稱：JavaScript構(gòu)造器怎么創(chuàng)建
文章網(wǎng)址：http://fisionsoft.com.cn/article/pjeedo.html
