物件導向 建構函式 原型物件

2021-10-20 18:20:06 字數 4517 閱讀 6745

3.建構函式的執行過程

4.建構函式的返回值

5.與普通函式的區別

原型物件

物件的封裝

`__proto__`

繼承使用prototype實現繼承

組合式繼承

定義:在js中,使用new關鍵字來呼叫的函式,被稱為建構函式。

建構函式的作用:建立物件。

假如需要建立多個類似的物件,我們會書寫很多重複的無意義**。此時我們使用建構函式,方便快捷的建立乙個物件。

將乙個物件的特徵作為屬性,將它的行為作為方法。

function

dog(name,age,breed,color)

this

.bark

=function()

}

【注意】建構函式的名字首字母大寫。

function

animal

(color)

當乙個函式建立完成後,我們並不知道它是不是乙個建構函式。像上面案例中,即使函式名首字母大寫,我們也不確定它是建構函式。只有當乙個函式前用new關鍵字來呼叫時,我們才能說它是乙個建構函式。

var dog =

newanimal

("black"

)

建構函式的執行過程有以下4個步驟。

當用new關鍵字呼叫建構函式時,會開闢乙個新的記憶體空間,這個內容空間就是新的物件例項。將建構函式內部的this指向當前的記憶體空間(新的物件)。執行函式內的**。(物件的屬性和方法的賦值。)將記憶體空間的位址作為返回值返回。建構函式不需要手動新增返回值,預設返回新物件的記憶體位址。

(1)手動新增乙個基礎資料型別的返回值,最終還是返回新物件的記憶體位址。

function

person

(name)

var p =

newperson

("范丞丞");

console.

log(p.name)

;//范丞丞

(2)手動新增乙個復合資料型別的返回值,返回手動新增的物件的記憶體位址。

function

person

(name);}

var p =

newperson

("范丞丞");

console.

log(p.name)

;//蔡徐坤

5.1呼叫方式的不同

普通函式使用函式名呼叫

建構函式通過new關鍵字來呼叫

5.2 返回值不同

普通函式的返回值是函式內return的結果

建構函式的返回值是函式內建立物件的位址。

5.3 作用的不同

建構函式時專門用來建立物件。

普通函式的作用可以自由定義。

我們建立的每乙個函式都有乙個prototype屬性,這個屬性指向乙個物件。而這個物件所有的屬性和方法都會被建構函式擁有。

function

dog(name,age)

var dog1 =

newdog

("來福",3

)var dog2 =

newdog

("常威",2

)dog.prototype.

bark

=function()

dog.prototype.breed =

"哈士奇"

;alert

(dog1.bark===dog2.bark)

;//true

alert

(dog1.breed)

//哈士奇

alert

(dog2.breed)

//哈士奇

一般情況下,公共屬性定義到建構函式裡面,公共的方法定義到原型物件身上。

function

dog(name,age,breed,color)

dog.prototype.

show

=function()

dog.prototype.

bark

=function()

每乙個物件都有乙個屬性__proto__,這個屬性指向建構函式的prototype,也就是建構函式的原型物件。我們之所以可以在物件中使用原型物件中的方法和屬性就是因為物件中有__proto__屬性的存在。

如果例項物件中呼叫了該物件沒有的方法或屬性,去__proto__去找方法或屬性,如果還沒有則繼續往上尋找,直到null。

面上物件的三大特性:封裝(封裝建構函式),繼承,多型

es6之前沒有給我們提供 extends 繼承。我們可以通過建構函式+原型物件的模式去模擬實現繼承。這種方法也被稱為組合繼承。

function

dog(age)

dog.prototype.

bark

=function()

function

huskie

(name,age)

huskie.prototype.

bark

=function()

像上面的案例中,哈士奇是屬於狗的一種,如果我們重複定義了一樣的屬性和方法,寫了一些重複的**也造成了資源的浪費,所以我們讓哈士奇繼承狗的所有屬性和方法。

function

dog(age)

dog.prototype.

swimming

=function()

function

huskie

(name,age)

var hsq =

newhuskie

("二哈",2

);hsq.

swimming()

;//報錯

特點:

優點:繼承了父類建構函式中所有的屬性和方法

缺點:不能繼承父類原型物件中的屬性和方法

在原型物件中有乙個constructor屬性,該屬性指向該原型物件的建構函式。

function

dog(age)

dog.prototype.

bark

=function()

function

huskie

(name,age)

// 這樣寫相當於讓子類與父類指向了同乙個原型物件。如果修改了子類的原型物件,則父類的原型物件也會隨之修改

// huskie.prototype = dog.prototype;

huskie.prototype =

newdog(3

);huskie.prototype.constructor = huskie;

// var h = new huskie("二哈");

// console.log(h.age);

// h.bark();

// var dog = new dog();

// console.dir(dog)

// console.dir(h.constructor === h.__proto__.constructor); true

優點:繼承了父級原型上的屬性和方法缺點:實現化多個子類時,必須使用共同的屬性值。

function

dog(age)

dog.prototype.

bark

=function()

function

huskie

(name,age)

//此時不需要給父類新增引數

huskie.prototype =

newdog()

;huskie.prototype.constructor = huskie;

var h =

newhuskie

("二哈",5

物件導向精要 建構函式和原型物件

function person 建構函式 首字母大寫 function person var person1 new person instanceof 方法 function person var person1 new person console.log person1 instanceof ...

建構函式,原型物件,

概念 如果函式中的邏輯生成乙個物件的並將其返回,我們就將其稱之為建構函式 回顧,普通函式,如下圖 一 建構函式嚴格意義就是用來生物件的 示例 用普通函式模擬的建構函式 二 建構函式是必須通過new這個關鍵字呼叫的 要改變this的指向 也稱為 例項化乙個物件 執行這個函式,生成乙個物件 它的作用就是...

建構函式 原型物件

物件都會有乙個屬性 proto 指向建構函式的prototype原型物件,之所以我們物件可以使用建構函式prototype原型物件的屬性和方法,就是因為物件有 proto 原型的存在 body p 建構函式 原型物件 p p 雖然構造物件上沒有sing方法,但是原型物件上有,因為 proto 的存在...