JS 繼承的介紹與實現

js 是一種物件導向的弱型別的解釋性的語言

弱型別宣告變數的時候不需要註明資料型別

int a =
1;   
float//（強型別） 
var a=
1.2;

解釋性解釋一句執行一句編譯性一次性全部翻譯完然後再執行

物件導向封裝繼承多型（js語言沒有多型）

封裝將乙個功能都放在乙個物件裡面只需要向外界暴露乙個介面需要使用的時候直接調介面就可以了並不需要管底層是怎麼實現的

push //向陣列的最後新增乙個元素
var arr=[12
,23];
arr.
push(15
);

繼承：是指js物件之間的繼承如果我們想讓乙個物件擁有另乙個物件的屬性或者方法那麼就可以讓這個物件繼承另乙個物件

1.實現建構函式來實現繼承

實現方式：使用call等方法是乙個物件的this指向另乙個物件從而讓其擁有這個物件的屬性和方法

缺點：無法繼承父類原型上面的方法對於子類不需要的方法每次建立都會擁有浪費記憶體空間

有很多建構函式的情況下，如果需要給所有的建構函式新增屬性，那麼就需要分別去加就不便於維護

function
perent
(name,age)}	
perent.prototype.
test
=function()
perent.prototype.type=
"人類"
;var p1=
newperent
("父親",36
);// function child(name,age,gender)
// var c1=new child("孩子",12);
function
child
(name,age)
var c2=
newchild
("amy",12
);console.
log(c2)
;  //報錯
c2.work()
//執行了函式體

就是說只是把父親建構函式裡面的屬性和方法繼承了但是父類原型裡面的方法繼承不了

建立的child物件並不需要work方法但每次建立都會有浪費空間

2.原型拷貝繼承(混入式繼承)

實現方式：使用for-in遍歷父類原型裡面的所有屬性依次加入子類的原型中

缺點：原型中子類不需要的方法或者屬性也繼承過來了占用記憶體空間

function
perent
(name,age)}  
perent.prototype.
test
=function()
perent.prototype.type=
"人類"
;function
child
(name,age)
//原型物件拷貝
for(
var key in perent.prototype)
var c1=
newchild
("張三",12
);c1.
test()
;  console.
log(c1.type)
;

3.原型鏈繼承

實現方法：利用原型鏈來實現繼承父類的乙個例項化物件作為子類的原型

缺點：子類例項和父類例項的原型物件上有成員的共享問題

function
perent
(name,age)}		
perent.prototype.
test
=function()
perent.prototype.type=
"人類"
;function
child
(name,age)
child.prototype=
newperent()
;		console.
log(child.prototype.constructor)
;//重新替換原型之後 建構函式並不指向原建構函式 所以要將建構函式指向原函式
child.prototype.constructor=child;

child.prototype=
newperent()
;var c1=
newchild
("張三",12
);console.
log(c1.type)
;		c1.
test()
;

為什麼不直接使用child.prototype=perent？

把父類的建構函式直接替換掉子類的原型會導致父類建構函式的私有屬性發生變化

甚至有些成員父類建構函式並不需要

child.prototype=perent;
child.prototype.
study
=function()
console.
dir(perent)
;		perent.
study()
;

4.組合繼承（原型鏈和call繼承組合）

function
father()
}		father.prototype=
}function
son(age)
}//繼承父類原型中的成員
son.prototype=
newfather()
;		son.prototype.constructor=son;
son.prototype.
sleep
=function()
var s1=
newson(12
);//這個是父類建構函式裡面的方法
s1.run();
//是父類原型裡面的方法
s1.eat();
console.
log(s1.type)
;//自己建構函式裡面的方法
s1.study()
;//自己的原型裡面的方法
s1.sleep()
;

js 繼承介紹

js中繼承的方式並不是明確的，這裡介紹常用的幾種一物件冒充建構函式繫結 function monkey function magicmonkey 二原型鏈原理使用prototype屬性，prototype物件是個模版，要例項化的物件都以這個模版為基礎，總而言之，prototype物件的任...

js繼承的實現

1 繼承第一種方式物件冒充 function parent username function child username,password var parent new parent zhangsan var child new child lisi 123456 parent.hello c...

js繼承的實現

js繼承有5種實現方式 1 繼承第一種方式物件冒充 function parent username function child username,password var parent new parent zhangsan var child new child lisi 123456 pa...

JS 繼承的介紹與實現

js 繼承介紹

js繼承的實現

js繼承的實現

相關推薦