對象的創(chuàng)建
- 字面量
- 內置構造函數(Object)
- 工廠函數
- 自定義構造函數
- Object.create()
01 字面量方式創(chuàng)建對象
代碼示例
var book1 = {
name:"聲名狼藉者的生活",
price:42.00,
author:"???,
press:"北京大學出版社",
read:function () {
console.log("我的書名為:聲名狼藉者的的生活,作者為???...");
}
};
存在問題
- 代碼復用性差
- 如果要創(chuàng)建大量的同類型對象,則需要些大量重復性代碼
02 內置構造函數創(chuàng)建對象
-
內置構造函數
- String Number Boolean 注意:(區(qū)別于string number boolean)
- Date Array Function Object RegExp....
代碼示例
var book1 = new Object();
book1.name = "聲名狼藉者的生活";
book1.price = 42.00;
book1.author = "???;
book1.press = "北京大學出版社";
book1.read = function () {
console.log("我的書名為:聲名狼藉者的的生活,作者為???...");
};
問題
01 創(chuàng)建的對象無法復用,復用性差
02 如果需要創(chuàng)建多個同類型的對象,如(書籍)則需要寫大量重復的代碼,代碼的冗余度高
03 簡單工廠函數創(chuàng)建對象
代碼示例
function createBookNew (name,price,author,press) {
var book = new Object();
book.name = name;
book.price = price;
book.author = author;
book.press = press;
book.read = function () {
console.log("我的書名為:"+book.name+",作者為"+book.author+"....");
};
return book;
}
//使用工廠函數來創(chuàng)建對象
var book1 = createBookNew("聲名狼藉者的的生活","42.00","???,"北京大學出版社");
var book2 = createBookNew("人性的枷鎖","49.00","毛姆","華東師范大學出版社");
var book3 = createBookNew("悟空傳","28.00","今何在","湖南文藝出版社");
//打印對象的屬性,調用對象的方法
console.log(book1.name);
console.log(book2.name);
console.log(book3.name);
book1.read();
book2.read();
book3.read();
工廠函數創(chuàng)建對象說明
工廠函數方法其本質就是對內置構造函數創(chuàng)建對象的一個封裝,適用于大批量創(chuàng)建同種類型的對象
function createBook (name,price,author,press) {
//001 參數 = 原料
var book = new Object();
//002 創(chuàng)建對象并設置對象的屬性和方法 = 對原料進行加工
book.name = name;
book.price = price;
book.author = author;
book.press = press;
book.read = function () {
console.log("我的書名為:"+book.name+",作者為"+book.author+"....");
};
//003 把處理好的對象返回給我們 == 產品出廠
return book;
}
封裝思路
使用函數把固定不變的部分封裝起來,變化的部分提取為函數的參數
工廠函數創(chuàng)建對象的實現過程
① 提供一個創(chuàng)建對象的函數(參數)
② 在該函數內部使用new 關鍵字和Object構造器創(chuàng)建對象
③ 設置對象的屬性
④ 設置對象的方法
⑤ 返回對象
04 自定義構造函數創(chuàng)建對象
構造函數與普通函數的區(qū)別:
- 本質上沒有區(qū)別
- 構造函數一般首字母大寫
- 調用的時候,構造函數一般與new結合使用創(chuàng)建對象
核心過程:
01 提供一個(構造)函數
02 在函數通過this設置屬性和方法
03 通過new 函數()創(chuàng)建對象
-
內部實現具體過程
- 默認在函數內部創(chuàng)建一個空對象 var o=new Object()
- 將創(chuàng)建的新對象賦值給this this=o
- 默認會把新創(chuàng)建的對象的原型對象設為當前構造函數的原型對象 o.proto=Person.prototype
- 默認會設置新創(chuàng)建對象的構造器屬性為當前構造函數 o.proto.constructor=Person
- 通過this設置屬性和方法
- 默認會把新創(chuàng)建的對象返回 return o
代碼示例
function CreateBook (name,price,author,press) {
this.name = name;
this.price = price;
this.author = author;
this.press = press;
this.read = function () {
console.log("我的書名為:"+this.name+",作者為"+this.author+"....");
};
}
var b1 = new CreateBook("聲名狼藉者的的生活","42.00","???,"北京大學出版社");
var b2 = new CreateBook("人性的枷鎖","49.00","毛姆","華東師范大學出版社");
var b3 = new CreateBook("悟空傳","28.00","今何在","湖南文藝出版社");
//打印對象的屬性,并調用對象的方法測試
console.log(b1.author);
console.log(b2.author);
console.log(b3.author);
b1.read();
b2.read();
b3.read();
console.log(b1 == b2); // false,創(chuàng)建的對象為引用類型,存儲的是地址,兩次創(chuàng)建對象,存儲的地址不同,自然不相等
console.log(b1.read == b2.read); //false,同上
構造函數的返回值
01 如果在構造函數中沒有顯示的return,則默認返回的是新創(chuàng)建出來的對象
02 如果在構造函數中顯示的return,則依照具體的情況處理
[01] return 的是對象,則直接返回該對象,取而代之本該默認 返回的新對象
[02] return 的是null或基本數據類型值,則返回新創(chuàng)建的對象
構造函數方式創(chuàng)建對象存在的問題
每次創(chuàng)建對象,都會重新創(chuàng)建函數,那么如果創(chuàng)建的對象數量很多,而對象方法內部的實現一模一樣,則造成了資源浪費