對(duì)象創(chuàng)建的幾種方式
字面量方式
優(yōu)缺點(diǎn)
優(yōu)點(diǎn):
創(chuàng)建方式簡單, 簡潔, 可讀性好.
缺點(diǎn):
001 代碼不具備復(fù)用性
002 如果需要?jiǎng)?chuàng)建多個(gè)類似的對(duì)象, 則代碼冗余度很高
示例代碼
var book = {
name:'js面向?qū)ο?,
author:'liyajie',
showName:function(){
console.log('書名: '+this.name);
}
}
內(nèi)置構(gòu)造函數(shù)創(chuàng)建對(duì)象
內(nèi)置構(gòu)造函數(shù)有哪些? 特點(diǎn)是首字母全部大寫
String, Number, Object, Boolean, Function , Date, RegExp, Array, Math
優(yōu)缺點(diǎn)
缺點(diǎn):
和字面量方式一樣, 代碼不具備復(fù)用性, 如果需要?jiǎng)?chuàng)建多個(gè)類似對(duì)象, 則代碼冗余度還是很高
示例代碼:
var book = new Object();
book.name = 'java高級(jí)編程';
book.author = 'lihaojie';
book.showName = function(){
console.log('書名: '+ this.name);
}
簡單工廠函數(shù)創(chuàng)建對(duì)象
優(yōu)缺點(diǎn)
僅僅是對(duì)構(gòu)造函數(shù)方式創(chuàng)建對(duì)象的封裝, 代碼仍然不夠簡潔
本質(zhì):
是對(duì)使用構(gòu)造函數(shù)創(chuàng)建對(duì)象的封裝.
示例代碼
function createBook(name,author){
var book = new Object();
book.name = name;
book.author = author;
book.showName = function(){
console.log('書名: ' + this.name);
}
return book;
}
// 使用工廠創(chuàng)建一本書
var book1 = createBook('心靈雞湯', 'liyajie');
var book2 = createBook('心靈雞湯2', 'liyajie');
自定義構(gòu)造函數(shù)創(chuàng)建對(duì)象
優(yōu)缺點(diǎn)
缺點(diǎn):
每個(gè)對(duì)象的方法都是一樣的, 每次在創(chuàng)建的時(shí)候都會(huì)創(chuàng)建方法, 而這些方法都是一樣的, 如果每次創(chuàng)建同樣的方法優(yōu)點(diǎn)資源浪費(fèi)
與工廠方法對(duì)比:
- 函數(shù)首字母大寫, 主要用于區(qū)分構(gòu)造函數(shù)和普通函數(shù)
- 創(chuàng)建對(duì)象的過程是通過new關(guān)鍵字來實(shí)現(xiàn)的
- 在構(gòu)造函數(shù)內(nèi)部會(huì)自動(dòng)創(chuàng)建新對(duì)象, 并賦值給this指針
- 自動(dòng)返回創(chuàng)建后的對(duì)象.
構(gòu)造函數(shù)的執(zhí)行過程 - 默認(rèn)會(huì)使用new創(chuàng)建一個(gè)空的對(duì)象.
- 把新創(chuàng)建出來的對(duì)象賦值給this指針
- 把this.prototype 賦值給創(chuàng)建出來的新對(duì)象的proto
- 把this.contrustor 賦值給新創(chuàng)建出來的新對(duì)象的constructor
- 在構(gòu)造函數(shù)內(nèi)部使用this為新創(chuàng)建出來的對(duì)象設(shè)置屬性和方法.
- 默認(rèn)返回新創(chuàng)建的對(duì)象.如果函數(shù)沒有返回值, 則默認(rèn)返回的是undefined, 如果我們手動(dòng)返回一個(gè)對(duì)象, 那么返回的值就是這個(gè)對(duì)象 , 如果我們手動(dòng)返回的是一個(gè)值類型的值, 則將忽略.
示例代碼
// 創(chuàng)建構(gòu)造函數(shù)
function CreateBook(name,author){
this.name = name;
this.author = author;
this.showName = function(){
console.log('書名: '+ this.name);
}
}
// 使用構(gòu)造函數(shù)創(chuàng)建對(duì)象
var book1 = new CreateBook('java高級(jí)編程','liyajie');
book1.showName();// 調(diào)用showName方法
構(gòu)造函數(shù)的使用注意
- 封裝固定不變的部分, 把變化的部分提取為參數(shù).
- 如何檢查對(duì)象的類型, 使用
instanceof
var person = new Person();
console.log(person instanceof Person);// true
- 獲取對(duì)象的真實(shí)類型
Object.prototype.toString.call(對(duì)象實(shí)例) - 函數(shù)的調(diào)用和this
- 構(gòu)造器屬性
constructor
構(gòu)造函數(shù)的原型對(duì)象
什么是構(gòu)造函數(shù)的原型對(duì)象?
在構(gòu)造函數(shù)創(chuàng)建出來的時(shí)候, 系統(tǒng)會(huì)默認(rèn)為構(gòu)造函數(shù)創(chuàng)建并關(guān)聯(lián)一個(gè)新對(duì)象, 而這個(gè)對(duì)象就是原型, 自定義構(gòu)造函數(shù)的原型對(duì)象默認(rèn)就是一個(gè)空對(duì)象.
作用
構(gòu)造函數(shù)的原型對(duì)象上的屬性和方法, 可以被該構(gòu)造函數(shù)所創(chuàng)建的對(duì)象使用.
即自定義的構(gòu)造函數(shù)所創(chuàng)建出來的所有對(duì)象, 將共享原型對(duì)象中的所有屬性和方法.
如何訪問原型
- 構(gòu)造函數(shù).prototype
- 對(duì)象.proto (不推薦使用, 因?yàn)橛行g覽器解析不到該屬性, 這個(gè)主要是為了方便開發(fā)者調(diào)試使用)
- Object.getPrototypeOf(對(duì)象)
設(shè)置原型對(duì)象
- 利用對(duì)象的動(dòng)態(tài)特性來設(shè)置屬性和方法.
- 替換原型對(duì)象的時(shí)候, 替換前和替換后創(chuàng)建的對(duì)象所指向的原型不是同一個(gè).
注意事項(xiàng)
- 訪問屬性:
構(gòu)造函數(shù)在創(chuàng)建出來的對(duì)象在訪問原型對(duì)象的時(shí)候, 首先會(huì)先會(huì)在實(shí)例內(nèi)查找, 如果沒有則取查找原型對(duì)象上的屬性. - 當(dāng)我們使用.語法設(shè)置對(duì)象屬性的時(shí)候, 無法操作到原型對(duì)象上的該屬性, 不管增加還是刪除. 如果我們需要修改原型對(duì)象上的屬性和方法的時(shí)候需要在訪問的時(shí)候使用:
構(gòu)造函數(shù).prototype.屬性 = '';這樣才可以 - 設(shè)置原型對(duì)象的屬性和方法
3.1 只能通過構(gòu)造函數(shù).prototype.屬性 的方式來設(shè)置或者修改
3.2 如果原型對(duì)象的屬性是值類型, 只能通過構(gòu)造函數(shù).prototype.屬性 的方式來設(shè)置.
3.2. 如果原型的屬性是引用類型, 那么可以通過構(gòu)造函數(shù)的實(shí)例對(duì)象進(jìn)行修改, 如果是直接覆蓋的話則是給實(shí)例對(duì)象新增了屬性.
function Person(){}
Person.prototype.friends = ['小名', '小白','小黃'];
var p = new Person();
// 如果使用實(shí)例對(duì)象來修改friends,
p.friends.push('小綠');
console.log(p.friends);// ['小名', '小白','小黃', '小綠'];
p.friends = [1,2,3,4];
console.log(p.friends);// [1,2,3,4];
