js物件導向的繼承

2021-10-23 12:04:28 字數 3291 閱讀 4489

乙個型別的物件能夠訪問另外乙個型別的屬性和方法

繼承是類和類之間的關係

1.建構函式的繼承

function

person

(name, age)

}function

male

(name, age)

*///person(name, age);

//直接呼叫person,是讓person裡的**在male裡執行了一下,

//但是並沒有給male例項新增對應屬性和方法,原因是this指向不對

//改變this指向

person.

call

(this

, name, age)

;//利用call方法改變this指向

this

.***y =

"male";/*

}var male = new male("john", 20);

console.log(male);

2.原型繼承

function

person()

person.prototype.name =

"john"

; person.prototype.age =20;

person.prototype.

sayhello

=function()

function

male()

/* male.prototype = person.prototype; //male原型物件就具有了person原型物件的屬性和方法

//但是父類原型和子類原型是同乙個,子類的修改會影響到父類

male.prototype.***y = "male"; */

male.prototype =

newperson()

;//這一步實現了male對person的繼承 成為原型繼承

male.prototype.***y =

"male"

;var male =

newmale()

;/*male這個例項裡面有沒有__proto__

male.__proto__== male.prototype

male.prototype.__proto__ == person.prototype

//這時就形成了原型鏈

*/male.

sayhello()

;//male訪問sayhello,訪問順序:例項屬性->male.prototype->person.prototype->……->object.prototype->undefined

console.

log(male.***y)

;var person =

newperson()

; console.

log(person.***y)

;<

/script>

3.組合繼承

function

person

(name, age)

person.prototype.

sayhello

=function()

function

male

(name, age)

= new person();

//將perosn原型物件上的方法給到male的原型物件

for(

let i in person.prototype)

male.prototype.***y =

"male"

;var male =

newmale

("john",20

);male.

sayhello()

;var person =

newperson()

; console.

log(person.***y)

;<

/script>

4.寄生式組合繼承

function

person

(name, age)

person.prototype.

sayhello

=function()

function

male

(name, age)

/*

var obj1 = ;

var obj2 = object.create(obj1);

console.log(obj2); //obj2.__proto__ == obj1 */

male.prototype = object.

create

(person.prototype)

;//利用object.create

male.prototype.constructor = male;

//constructor 建構函式

.__proto__ == person.prototype

var male =

newmale

("john",20

);male.

sayhello()

;//通過例項找建構函式

console.

log(male.__proto__.constructor)

;//子類繼承父類關聯起來的封裝函式

function

inherit

(sup, sub)

<

/script>

5.es6繼承 extends 關鍵字

class

person

sayhello()

static

foo()}

// person.foo();

class

male

extends

person

sayhi()

static

bar()}

var male =

newmale

("john",20

);male.

sayhello()

; male.

sayhi()

; male.

bar();

<

/script>

JS物件導向 繼承

參考博文 一 物件導向的繼承 1 解析 在原有物件的基礎上,略作修改,得到乙個新的物件,並且不影響原有物件的功能 2 如何新增繼承 拷貝繼承 屬性 call 方法 for in 繼承 子類不影響父類,子類可以繼承父類的一些功能 復用 屬性的繼承 呼叫父類的構造1函式 call 方法的繼承 for i...

js 物件導向 繼承

繼承 將方法的定義放在建構函式中,每建立乙個新物件,都會重複建立該方法一模一樣的副本,浪費記憶體。解決 如果多個子物件都要使用乙個相同的方法時,應該把這個方法放在一種原型物件中,建構函式中不再包含方法定義。原型物件 乙個型別中,專門為所有子物件集中儲存共有方法的物件。同一型別下多個子物件需要用乙個共...

JS 物件導向 繼承

實現繼承是 ecmascript 唯一支援的繼承方式,而這主要是通過原型鏈實現的建構函式 原型和例項的關係 每個建構函式都有乙個原型物件,原型有乙個屬性 constructor 指回建構函式,而例項有乙個內部指標 prototype 指向原型。建構函式 function father console...