javascript深入淺出 原型 原型鏈

2021-09-11 14:47:06 字數 2629 閱讀 4519

原型

原型是js中實現繼承的過程中產生的乙個概念

繼承:指在乙個物件的基礎上建立新物件的過程,原型指在這過程中作為基礎的物件。

建立物件

var o  = 

}var p = object.create(o);

p.a=1;

p.b=2;

console.log(p.f());//3

複製**

通過object.create()方法我們傳入了o物件,作為p物件的原型來建立p物件,然後p物件中就產生了乙個叫_proto_的指標,這指標指向o物件。通過這個指標p物件就可以訪問到o物件的f方法。

prototype物件

function dog(name)

var doga = new dog('小三');

console.log(doga);//dog

複製**

使用new物件會生成乙個dog物件的例項

缺點:無法共享屬性和方法

比如:

function dog(name)

var doga = new dog('小三');

var dogb = new dog('小四');

doga.species = '貓科';

console.log(doga);//dog

console.log(dogb);//dog

複製**

我們改變了dogaspecies,不會影響dogb中的species.

每乙個例項物件,都有自己的屬性和方法的副本。這不僅無法做到資料共享,也是極大的資源浪費。

prototype屬性

這個屬性包含乙個物件,所有例項物件需要共享的屬性和方法,都放在這個物件裡面;哪些不需要共享的屬性和方法, 就放在建構函式裡面。

例項一旦建立,將自動引入prototype物件的屬性和方法,也就是說,例項物件的屬性和方法,分為兩種,一種是本地的,另一種是引用的。

function dog(name)

dog.prototype = ;

var doga = new dog('小三');

var dogb = new dog('小四');

console.log(doga.species);//犬科

console.log(dogb.species);//犬科

複製**

現在,species屬性是放在prototype物件中,是兩個例項物件共享的。只要修改了prototype,就會同時影響到兩個例項物件。

dog.prototype.species = '貓科';       

console.log(doga.species);//貓科

console.log(dogb.species);//貓科

複製**

原型鏈

講原型乙個不可避免的概念就是原型鏈,原型鏈是通過前面兩種建立原型object.create()dog.prototype的方式生成的乙個_prtoto_指標來實現的。

function

foo()

var obj = new foo();

obj.x = 1;

obj.y = 2;

console.log(obj);//foo

console.log(obj.z);//3

複製**

物件obj上是沒有z的,但是他的原型鏈上有z,所以查詢的時候如果物件本身不存在的話就會沿著原型鏈往上查詢

obj.z=5;

console.log(obj.z);//5

console.log(foo.prototype.z);//3

複製**

如果物件上有的話則不會向原型鏈上查詢,而且並不會改變原型鏈上的值

總結一下原型鏈作用:物件屬性的訪問修改和刪除。

訪問。優先在物件本身查詢,沒有則順著原型鏈向上查詢

修改。只能修改跟刪除自身屬性,不會影響到原型鏈上的其他物件。

總結

由於所有的例項物件共享同乙個 prototype 物件,那麼從外界看起來,prototype 物件就好像是例項物件的原型,而例項物件則好像」繼承」了 prototype 物件一樣。

深入淺出Javascript 型別

js有6種原型資料型別 null,undefined,boolean,number,string,symbol var as null undefined console.log as nullnull.asd uncaught typeerror cannot read property asd ...

深入淺出Javascript 嚴格模式

在js檔案或是函式的頂部 前無語句,可有注釋 新增 use strict 即可啟用嚴格模式。全域性開啟嚴格模式 use strict 函式內部開啟嚴格模式 function asd for i 0 i 5 i 新手常犯錯誤 use strict 給不可寫屬性賦值 var obj1 object.de...

慕課網深入淺出javascript

請在index.html檔案中,編寫arrayssimilar函式,實現判斷傳入的兩個陣列是否相似。具體需求 1.陣列中的成員型別相同,順序可以不同。例如 1,true 與 false,2 是相似的。2.陣列的長度一致。3.型別的判斷範圍,需要區分 string,boolean,number,und...