最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

淺談JS的原型和繼承

 更新時間:2019年05月08日 09:26:35   作者:cywdm5  
這篇文章主要介紹了JS原型和繼承,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

參考文獻(xiàn)

JavaScript原型與繼承的秘密

__proto__

除null和undefined,JS中的所有數(shù)據(jù)類型都有這個屬性; 它表示當(dāng)我們訪問一個對象的某個屬性時,如果該對象自身不存在該屬性, 就從它的__proto__屬性上繼續(xù)查找,以此類推,直到找到,若找到最后還是沒有找到,則結(jié)果為undefined

我們把一個對象的__proto__屬性所指向的對象叫該對象的原型;我們可以修改一個對象的原型來讓這個對象擁有某種屬性或某個方法

// 修改一個Number類型的值的原型
const num = 1;
num.__proto__.name = "My name is 1";
console.log(num.name); // My name is 1
 
// 修改一個對象的原型
const obj = {};
obj.__proto__.name = "dreamapple";
console.log(obj.name); // dreamapple

需注意的是,__proto__屬性雖多數(shù)瀏覽器支持,但其實它僅在ECMAScript 2015規(guī)范中才被準(zhǔn)確定義, 目的是為了給這個傳統(tǒng)的功能定制一個標(biāo)準(zhǔn),以確保瀏覽器間的兼容性。通過使用__proto__屬性來修改一個對象的原型非常慢且影響性能。 所以,若想獲取一個對象的原型,推薦用Object.getPrototypeOf 或Reflect.getPrototypeOf,設(shè)置一個對象的原型推薦用Object.setPrototypeOf或Reflect.setPrototypeOf

prototype

首先要記住的是,該屬性一般只存在于函數(shù)對象上; 只要是能作為構(gòu)造器的函數(shù),都包含這個屬性。即只要這個函數(shù)能通過new生成一個新對象, 那么這個函數(shù)肯定具有prototype屬性。因為我們自定義的函數(shù)都可通過new生成一個對象,所以我們自定義的函數(shù)都有prototype 這個屬性

// 函數(shù)字面量
console.log((function(){}).prototype); // {constructor: ƒ}
 
// Date構(gòu)造器
console.log(Date.prototype); // {constructor: ƒ, toString: ƒ, toDateString: ƒ, toTimeString: ƒ, toISOString: ƒ, …}
 
// Math.abs 不是構(gòu)造器,不能通過new操作符生成一個新的對象,所以不含有prototype屬性
console.log(Math.abs.prototype); // undefined

prototype屬性有什么作用呢?作用就是:函數(shù)通過new生成的一個對象, 這個對象的原型(__proto__)指向該函數(shù)的prototype屬性:

// 其中F表示一個自定義的函數(shù)或者是含有prototype屬性的內(nèi)置函數(shù)
new F().__proto__ === F.prototype // true
 
// 通過函數(shù)字面量定義的函數(shù)的__proto__屬性都指向Function.prototype
(function(){}).__proto__ === Function.prototype // true
 
// 通過對象字面量定義的對象的__proto__屬性都是指向Object.prototype
({}).__proto__ === Object.prototype // true
 
// Object函數(shù)的原型的__proto__屬性指向null
Object.prototype.__proto__ === null // true
 
// 因為Function本身也是一個函數(shù),所以Function函數(shù)的__proto__屬性指向它自身的prototype
Function.__proto__ === Function.prototype // true
 
// 因為Function的prototype是一個對象,所以Function.prototype的__proto__屬性指向Object.prototype
Function.prototype.__proto__ === Object.prototype // true

constructor

constructor表示一個對象的構(gòu)造函數(shù),除null和undefined,JS中的所有數(shù)據(jù)類型都有這個屬性; 我們可通過下面的代碼來驗證一下:

null.constructor // Uncaught TypeError: Cannot read property 'constructor' of null ...
undefined.constructor // Uncaught TypeError: Cannot read property 'constructor' of undefined ...
 
(true).constructor // ƒ Boolean() { [native code] }
(1).constructor // ƒ Number() { [native code] }
"hello".constructor // ƒ String() { [native code] }

一個對象的constructor屬性確切地說并不是存在這個對象上面的; 而是存在這個對象的原型上(如果是多級繼承需手動修改原型的constructor屬性),我們可用下面的代碼來解釋一下:

const F = function() {};
// 當(dāng)我們定義一個函數(shù)的時候,這個函數(shù)的prototype屬性上面的constructor屬性指向自己本身
F.prototype.constructor === F; // true

對JS的原始類型(string, number, boolean, null, undefined, symbol (new in ECMAScript 2015)),它們的constructor屬性是只讀的,不可修改:

(1).constructor = "something";
console.log((1).constructor); // 輸出 ƒ Number() { [native code] }

如果真想改這些原始類型的constructor屬性,也不是不可以:

Number.prototype.constructor = "number constructor";
(1).constructor = 1;
console.log((1).constructor); // 輸出 number constructor

當(dāng)然上面的方式不推薦

以上所述是小編給大家介紹的JS原型和繼承詳解整合,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!

相關(guān)文章

最新評論

山阴县| 永福县| 张家港市| 盐城市| 延川县| 桑日县| 洛宁县| 五峰| 密山市| 阿拉善左旗| 陈巴尔虎旗| 常山县| 西畴县| 肥城市| 铅山县| 吉木萨尔县| 阜平县| 黄龙县| SHOW| 兴业县| 洞头县| 昭觉县| 丹阳市| 泰来县| 松滋市| 鲜城| 岱山县| 介休市| 新晃| 丹巴县| 文昌市| 铜山县| 广德县| 探索| 秀山| 出国| 策勒县| 阳泉市| 铜梁县| 博爱县| 昭平县|