面向?qū)ο蟮暮诵?/h1>
面向?qū)ο蟮暮诵模焊邇?nèi)聚低耩合(就是對(duì)面向過程的高度封裝)
+ 找到一個(gè)機(jī)器,能批量生產(chǎn)對(duì)象
+生產(chǎn)出來的對(duì)象,每一個(gè)對(duì)象都有自己的屬性和方法
+ 每一個(gè)對(duì)象可能類似,但是內(nèi)容不太一樣
=>構(gòu)造函數(shù)
=> 可以批量生產(chǎn)對(duì)象
=>可以向函數(shù)一樣傳遞參數(shù),可以給每一個(gè)對(duì)象添加一些不同的內(nèi)容
=>當(dāng)你需要完成一個(gè)功能的時(shí)候,我們先制造一個(gè)構(gòu)造函數(shù)
->利用構(gòu)造函數(shù)去創(chuàng)建一個(gè)可以完成任務(wù)的對(duì)象
->依賴這個(gè)對(duì)象完成功能
- 這個(gè)“機(jī)器"(構(gòu)造函數(shù))要生產(chǎn)有屬性有方法的合理的對(duì)象
=>機(jī)器:就是構(gòu)造函數(shù)
=>屬性:直接寫在構(gòu)造兩數(shù)體內(nèi)
=>方法:寫在構(gòu)造兩數(shù)的原型上
創(chuàng)建對(duì)象方式
- 字面量方式
var obj = { ... }
可以后期動(dòng)態(tài)添加
var obj = {
name: 'jack',
age: 18,
sayHi: function () {
console.log('helloworld');
}
}
- 內(nèi)置構(gòu)造函數(shù)創(chuàng)建對(duì)象
var obj = new Object()
var obj = new Object();
obj.name = 'rose';
obj.age = 19;
obj.sayHi = function () {
console.log('hw');
}
可以后期動(dòng)態(tài)添加
- 工廠函數(shù)創(chuàng)建對(duì)象
3.1 制造一個(gè)工廠函數(shù)
3.2 使用工廠函數(shù)去創(chuàng)造對(duì)象
//創(chuàng)建工廠函數(shù)
function createObj() {
//手動(dòng)創(chuàng)建一個(gè)對(duì)象
var obj = {};
//手動(dòng)向里面添加屬性
obj.name = 'alan';
obj.age = 17;
obj.sayHi = function () {
console.log('hi');
}
// 手動(dòng)返回這個(gè)對(duì)象
return obj;
}
//使用工廠函數(shù)創(chuàng)造對(duì)象
var obj1 = createObj();
var obj2 = createObj();
console.log(obj1,obj2);
//創(chuàng)建工廠函數(shù)
function createObj(name,age) {
//手動(dòng)創(chuàng)建一個(gè)對(duì)象
var obj = {};
//手動(dòng)向里面添加屬性
obj.name = name;
obj.age = age;
obj.sayHi = function () {
console.log('hi');
}
// 手動(dòng)返回這個(gè)對(duì)象
return obj;
}
//使用工廠函數(shù)創(chuàng)造對(duì)象
var obj1 = createObj('jack',18);
var obj2 = createObj('rose',19);
console.log(obj1,obj2);
4.自定義構(gòu)造函數(shù)創(chuàng)建對(duì)象
4.1 創(chuàng)造一個(gè)自定義構(gòu)造函數(shù)
4.2使用自定義構(gòu)造函數(shù)去創(chuàng)建對(duì)象
// 自定義構(gòu)造函數(shù)
// 1. 構(gòu)造函數(shù)會(huì)自動(dòng)創(chuàng)建對(duì)象,自動(dòng)返回這個(gè)對(duì)象
//我們只需要手動(dòng)向里面添加內(nèi)容就可以了
function createObj() {
//自動(dòng)創(chuàng)建對(duì)象
//手動(dòng)向?qū)ο罄锩嫣砑映蓡T
// this 指向當(dāng)前實(shí)例
this.name = 'jack';
this.age = 19;
this.sayHi = function () {
console.log('hi');
}
//自動(dòng)返回對(duì)象
}
// 2. 使用自定義構(gòu)造函數(shù)去創(chuàng)建對(duì)象
// 構(gòu)造函數(shù)在使用的時(shí)候 需要和new關(guān)鍵字連用
// 如果不連用,那么沒有意義
//第一次調(diào)用createObj時(shí) 和new 關(guān)鍵字連用
//createObj里面的this指向obj1
//函數(shù)內(nèi)部的代碼在執(zhí)行的時(shí)候 就是向obj1添加了name age sayHi
var obj1 = new createObj();
// 第二次相同
var obj2 = new createObj();
console.log(obj1,obj2);
構(gòu)造函數(shù)的使用
- 構(gòu)造函數(shù)和普通函數(shù)沒有區(qū)別
只不過要在調(diào)用的時(shí)候和new連用 - 書寫構(gòu)造函數(shù),函數(shù)名首字母大寫
看到名字時(shí) 就知道要和new連用 - 電泳的二十號(hào) 需要和new連用
因?yàn)橹挥泻蚽ew連用的時(shí)候,這個(gè)函數(shù)才會(huì)有自動(dòng)創(chuàng)建和返回對(duì)象的能力
我們之所以寫構(gòu)造函數(shù),就是為了使用它去批量生產(chǎn)對(duì)象
如果不和new連用,這個(gè)函數(shù)就沒有創(chuàng)建對(duì)象的能力,沒有自動(dòng)返回對(duì)象的能力 - 調(diào)用構(gòu)造函數(shù)的時(shí)候,如果不需要傳遞參數(shù),可以不寫后面的小括號(hào)
若要傳遞參數(shù),必須寫小括號(hào)
function person() {
console.log('hi');
}
function Person() {
this.name = 'jack'
}
//3
var obj = new Person()
console.log(obj);
//4
var obj2 = new Person;
console.log(obj2);
- 當(dāng)函數(shù)名和new關(guān)鍵字連用時(shí)
函數(shù)內(nèi)部的this指向當(dāng)前實(shí)例(new關(guān)鍵字前面的變量)
直接在函數(shù)體內(nèi)寫 this.xxx = 值,就是在向自動(dòng)創(chuàng)建出來的對(duì)象里面添加內(nèi)容 - 構(gòu)造函數(shù)內(nèi)部不要對(duì)編寫return
當(dāng)你return了一個(gè)基本數(shù)據(jù)類型的時(shí)候,寫了白寫
當(dāng)你return了一個(gè)復(fù)雜數(shù)據(jù)類型的時(shí)候,構(gòu)造函數(shù)白寫
構(gòu)造函數(shù)的不合理
當(dāng)在構(gòu)造函數(shù)體內(nèi)書寫方法時(shí)
當(dāng)你需要在對(duì)象上添加方法時(shí) 只需要new一次 就會(huì)有一個(gè)函數(shù)在占用空間
當(dāng)創(chuàng)建多個(gè)對(duì)象時(shí) 會(huì)有多個(gè)一樣的函數(shù)出現(xiàn),但是其中很多都是重復(fù)的,沒必要存在
// 1. 準(zhǔn)備一個(gè)構(gòu)造函數(shù)
function Person(name,age){
this.name = name;
this.age = age;
this.sayHi = function () {
console.log('hi');
}
}
// 2. 創(chuàng)建對(duì)象
var p1 = new Person('jack',20);
var p2 = new Person('rose',20);
console.log(p1,p2);
//強(qiáng)用兩個(gè)對(duì)象的sayHi方法
p1.sayHi();
// 兩個(gè)對(duì)象是否一樣?false
console.log( p1 === p2);
// 兩個(gè)對(duì)象里面的函數(shù)
console.log(p1.sayHi);
console.log(p2.sayHi);
console.log(p1.sayHi == p2.sayHi);//false 是兩個(gè)函數(shù)

image.png