快捷導(dǎo)航

javascript面向?qū)ο髣?chuàng)建對象的方式小結(jié)

更新時間：2019年07月29日 08:41:53 作者：Johnny丶me

這篇文章主要介紹了javascript面向?qū)ο髣?chuàng)建對象的方式,結(jié)合實例形式總結(jié)分析了javascript常見的7種創(chuàng)建對象的方式,需要的朋友可以參考下

本文實例講述了javascript面向?qū)ο髣?chuàng)建對象的方式。分享給大家供大家參考，具體如下：

方式一：通過內(nèi)置Object對象的方式創(chuàng)建然后通過點(diǎn)語法，動態(tài)給對象創(chuàng)建屬性，方法

var o1 = new Object();
o1.name = 'Tom';
o1.sing = function() {
 console.log('I am singing');
}

方式二：通過字面量json形式創(chuàng)建對象

var o2 = {
 "name":"jackson",
 "age":"10",
 "say":function(){
  console.log("say hi");
 };
};

方式三：通過構(gòu)造函數(shù)創(chuàng)建

var o3 = function() {
 this.name = "Lucy",
 this.age = "10",
 this.say = function() {
  console.log("say hello");
 }
}

方式四：通過原型創(chuàng)建

var o4 = function() {}
o4.prototype = {
 "name":"Taylor",
 "age":10,
 "say":function(){
  console.log("say h1");
 }
}

方式五：通過原型和構(gòu)造函數(shù)混合的形式創(chuàng)建(推薦使用這種，原因：盡量將方法定義為原型方法，原型方法避免了每次調(diào)用構(gòu)造函數(shù)時對屬性或方法的構(gòu)造，節(jié)省空間，創(chuàng)建對象快)

var o5 = function() {
 this.name = 'James';
 this.age = 10;
}
o5.prototype = {
 "say":function() {
   console.log("say hi");
 }
}

方式六：拷貝模式創(chuàng)建對象

// 先要有一個拷貝模塊
function extend(target,source){
 for(var k in source){
  target[k] = source[k];
 }
 return target;
};
var o6 = {
 "name":"o6",
 "age":10
}
var o7 = {
 "say":function() {
  console.log('say hi');
 }
}
// o6拷貝o7的方法，然后構(gòu)建成一個新的對象
var o8 = extend(o6,o7);
o8.say(); // say hi

方式七：通過第三方庫來創(chuàng)建對象

有 base2.js 和 simplejavascriptinheritance.js 來實現(xiàn), 網(wǎng)上有資料。

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運(yùn)行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

您可能感興趣的文章: