物件導向 prototype 原型鏈 繼承

2021-10-13 13:33:54 字數 3941 閱讀 1793

物件導向(oop,即 object oriented),是相對於面向過程來講的,簡單說就是把資料和方法組合封裝起來成為乙個整體,提高軟體的重用性、靈活性和擴充套件性。

物件導向特點:

當建立的物件較多時,會有可共用的屬性,此時就可用prototype。

比如我們用array來建立乙個例項時,不用我們定義,它本身就具有pop、push、join等方法,且這些方法存在於建構函式的_proto_中。這樣我們就可以理解為前輩將可能使用到的方法都寫到函式的proto中,當我們建立例項,想要去使用某一方法時,其實就是使用了共有屬性。例: (此處的let a = 是 let a = new array() 的簡寫)

// 共有屬性

students.prototype.campus =

"雲深不知處"

students.prototype.

say=

function()

,是$的學生,學號是$`

);}let ww =

newstudents

("魏無羨"

,1213

) ww.

say(

)let ll =

newstudents

("藍忘機"

,1314

) ll.

say(

)//我的名字是魏無羨,是雲深不知處的學生,學號是1213

//我的名字是藍忘機,是雲深不知處的學生,學號是1314

如上面那個**,函式students的prototype指向了乙個物件,這個物件就是在呼叫建構函式時建立的例項的原型,也就是ww和ll的原型。

;// 10 , 其優先訪問私有屬性

console.

log(ss.__proto__)

;//

console.

log(fn.prototype)

;//

console.

log(ss.__proto__ === fn.prototype)

;// true

console.

log(fn.prototype)

;// 列印如下,可以看出所有原型鏈的頂端都是object

注意:預設建構函式的首字母大寫

function

person

(name, age)

person.prototype.

say=

function()

// 子可繼承父的東西,父不能使用子的東西,且子可新增

function

students

(name, age, id)

let aa =

newperson

("ajs",15

) console.

log(aa.name)

;// ajs

console.

log(aa.age)

;// 15

console.

log(aa.id)

;// undefined

aa.say(

)// ajs:15

let ss =

newstudents

("魏無羨",18

,"0012"

) console.

log(ss.name)

;// 魏無羨

console.

log(ss.age)

;// 18

console.

log(ss.id)

;// 0012

// 原型的繼承。還可用方法

二、三 students.prototype = person.prototype

ss.say(

)// 魏無羨:18

// 原型的繼承

// 方法一:兩方為引用關係,一方改變,另一方也會變。students新增屬性時會改變原型person

students.prototype = person.prototype

// 方法二: 建立例項的方法,也為引用關係,但當students改變時,原型person不會改變。且students下的屬性有引數,但其prototype中的屬性無引數

students.prototype =

newperson()

// 方法三:

functionfn(

) fn.prototype = person.prototype

students.prototype =

newfn()

// 此時students的原型為fn(),

//修復 每個函式預設 person.prototype.constructor = person

students.prototype.constructor = students

// 原型的新增

students.prototype.campus =

"內容"

class

person

// 公有屬性,只能用函式形式

say()}

// 繼承

class

students

extends

person

campus()

}let ww =

newstudents

("魏無羨",18

,"0012"

) console.

log(ww.name)

;// 魏無羨

console.

log(ww.age)

;// 18

console.

log(ww.id)

;// 0012

ww.say(

)// 魏無羨:18

console.

log(ww.

campus()

);// 雲深

let ll =

newperson

("藍忘機",20

,"1314"

) console.

log(ll.name)

;// 藍忘機

console.

log(ll.age)

;// 20

console.

log(ll.id)

;// 1314

ll.say(

)// 藍忘機:20

// console.log(ll.campus()); // 報錯

物件導向原型prototype

function tab name,age tab.prototype.init function var tab new tab haha 18 console.log tab.init console.log tab.content 每次新建乙個例項都會在記憶體中建立content 有點低效,解...

prototype原型物件

js中物件可以直接使用 js中的例項是函式 構造器 或類的例項 es6 1.js的prototype屬性 prototype是函式的屬性,不過基本只在函式作為建構函式時才有意義。原型物件能過函式直接訪問,不能通過物件例項去訪問。原型 prototype 物件的所有屬性和方法,都能被例項物件共享。原型...

理解js的 prototype原型物件

在我看過的關於原型的文章中,這篇是說的最好的!各位盡情享用 我們建立的每個函式都有乙個prototype 原型 屬性,這個屬性是乙個指標,指向乙個物件,而這個物件的用途是包含可以由特定型別的所有例項共享的屬性和方法。如果按照字面意思來理解,那麼prototype就是通過呼叫建構函式而建立的那個物件例...