成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

JS創(chuàng)建對(duì)象模式及其對(duì)象原型鏈探究（一）：Object模式

李義 / 867人閱讀

摘要：對(duì)象是由構(gòu)造函數(shù)創(chuàng)建而成的，所以它的指向原型鏈圖對(duì)象的原型鏈圖對(duì)象屬性引用的匿名函數(shù)的原型鏈圖

Object模式 
創(chuàng)建一個(gè)Object實(shí)例，再為其添加屬性和方法。

這是創(chuàng)建自定義對(duì)象最簡(jiǎn)單的方式。

1.創(chuàng)建對(duì)象 
// 創(chuàng)建person對(duì)象
var person = new Object();
person.name = "Mike";
person.age = 20;
person.job = "student";
person.showName = function(){    
    console.log("this.name = " + this.name);
};

person.consThis = function(){
    console.log("this = ");    
    console.log(this);    // this指向person對(duì)象    
    console.log(this === person);
};

person.showName();
person.consThis();

輸出如圖：

2.觀察下person.showName屬性引用的函數(shù) 
// person.showName引用的是一個(gè)匿名函數(shù)，其name屬性為""
console.log("person.showName.name=");
console.log(person.showName.name);
console.log(person.showName.name === "")
console.log("-----分割線-----");

// showName引用的匿名函數(shù)的prototype屬性指向其原型對(duì)象
console.log("person.showName.prototype=");
console.log(person.showName.prototype);
console.log(person.showName.prototype === Function.prototype);        //不是Function構(gòu)造函數(shù)的原型對(duì)象
console.log("-----分割線-----");

//其原型對(duì)象的constructor屬性指向showName引用的匿名函數(shù)
console.log("person.showName.prototype.constructor=");        
console.log(person.showName.prototype.constructor);        
console.log("-----分割線-----");

// 此匿名函數(shù)的原型對(duì)象的__proto__屬性指向Object構(gòu)造函數(shù)的原型對(duì)象
console.log("person.showName.prototype.__proto__=");
console.log(person.showName.prototype.__proto__);
console.log(person.showName.prototype.__proto__ === Object.prototype);
console.log("-----分割線-----");

// showName引用的匿名函數(shù)的__proto__屬性指向Function.prototype
console.log("person.showName.__proto__=");        //showName引用的是一個(gè)匿名函數(shù)，匿名函數(shù)本質(zhì)上是由構(gòu)造函數(shù)Function生成的
console.log(person.showName.__proto__);        //showName引用的是一個(gè)匿名函數(shù)，匿名函數(shù)本質(zhì)上是由構(gòu)造函數(shù)Function生成的
// 驗(yàn)證
console.log(person.showName.__proto__ === Function.prototype);    //true
console.log("-----分割線-----");

showName屬性引用的匿名函數(shù)信息：

輸出如圖：

3.觀察person對(duì)象涉及到的原型鏈

Object構(gòu)造函數(shù)的原型鏈

// prototype屬性指向Object構(gòu)造函數(shù)的原型對(duì)象
console.log("Object.prototype=");
console.log(Object.prototype);
// Object構(gòu)造函數(shù)的原型對(duì)象的constructor屬性指向其本身
console.log("Object.prototype.constructor=");
console.log(Object.prototype.constructor);
console.log("-----分割線-----");

//所有構(gòu)造函數(shù)（內(nèi)置及自定義）的__proto__屬性都指向Function構(gòu)造函數(shù)的原型對(duì)象
// __proto__指向Function構(gòu)造函數(shù)的原型對(duì)象，即Function.prototype
console.log("Object.__proto__=");
console.log(Object.__proto__);    
console.log(Object.__proto__ === Function.prototype);    
console.log("-----分割線-----");

person對(duì)象的原型鏈

// person是對(duì)象，非函數(shù)，所以沒有prototype屬性
console.log("person.prototype=");
console.log(person.prototype);
console.log("-----分割線-----");

// 所有對(duì)象的__proto__都指向其構(gòu)造器的prototype
// person的__proto__屬性指向構(gòu)造函數(shù)的原型對(duì)象，即Object構(gòu)造函數(shù)的原型對(duì)象
console.log("person.__proto__=");
console.log(person.__proto__);
// 驗(yàn)證
console.log(person.__proto__ === Object.prototype)    //true
console.log("-----分割線-----");

構(gòu)造函數(shù)的原型對(duì)象的類型

// Function.prototype的類型為function
console.log("typeof Function.prototype:");
console.log(typeof Function.prototype);    
// 除了Function構(gòu)造函數(shù)的原型對(duì)象為function，其他構(gòu)造函數(shù)的原型對(duì)象類型為object
// Object.prototype的類型為object
console.log("typeof Object.prototype:");
console.log(typeof Object.prototype);
// Array.prototype的類型為object
console.log("typeof Array.prototype:");
console.log(typeof Array.prototype);
console.log("-----分割線-----");

Function構(gòu)造函數(shù)的原型對(duì)象和Object構(gòu)造函數(shù)的原型對(duì)象的關(guān)系

// Function.prototype.__proto指向Objcet.prototype
console.log("Function.prototype.__proto__=");
console.log(Function.prototype.__proto__);
// 驗(yàn)證
console.log(Function.prototype.__proto__ === Object.prototype);    //true
// 這說明所有的構(gòu)造器也都是一個(gè)普通JS對(duì)象，可以給構(gòu)造器添加/刪除屬性等。同時(shí)它也繼承了Object.prototype上的所有方法：toString、valueOf、hasOwnProperty等。
console.log("-----分割線-----");

// Object.prototype.__proto指向null
console.log("Object.prototype.__proto__=");
console.log(Object.prototype.__proto__);
// 原型鏈到頂了，為null。
原型分析

所有構(gòu)造器/函數(shù)的_ proto _都指向Function.prototype

所有對(duì)象的_ proto _都指向其構(gòu)造器的prototype

除了Function構(gòu)造函數(shù)的原型對(duì)象為function，其他構(gòu)造函數(shù)的原型對(duì)象類型為object

所有的構(gòu)造器也都是一個(gè)普通JS對(duì)象，可以給構(gòu)造器添加/刪除屬性等。同時(shí)它也繼承了Object.prototype上的所有方法：toString、valueOf、hasOwnProperty等。

person對(duì)象是由Object構(gòu)造函數(shù)創(chuàng)建而成的，所以它的_ proto _指向Object.prototype

原型鏈圖

person對(duì)象的原型鏈圖：

person對(duì)象showName屬性引用的匿名函數(shù)的原型鏈圖：

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/78964.html

相關(guān)文章

  • JS創(chuàng)建對(duì)象模式及其對(duì)象原型鏈探究（二）：工廠模式

    摘要：工廠模式用函數(shù)來封裝，以特定接口創(chuàng)建對(duì)象的細(xì)節(jié)。缺點(diǎn)不能知道對(duì)象識(shí)別的問題對(duì)象的類型不知道。復(fù)雜的工廠模式定義是將其成員對(duì)象的實(shí)列化推遲到子類中，子類可以重寫父類接口方法以便創(chuàng)建的時(shí)候指定自己的對(duì)象類型。 工廠模式 用函數(shù)來封裝，以特定接口創(chuàng)建對(duì)象的細(xì)節(jié)。 1.創(chuàng)建對(duì)象 function createPerson(name, age, job){ var o = new Obj...

    smartlion 評(píng)論0 收藏0

  • JS創(chuàng)建對(duì)象模式及其對(duì)象原型鏈探究（五）：組合使用構(gòu)造函數(shù)模式和原型模式

    摘要：組合使用構(gòu)造函數(shù)模式和原型模式構(gòu)造函數(shù)模式用于定義實(shí)例屬性，原型模式用于定義方法和共享的屬性。創(chuàng)建對(duì)象組合使用構(gòu)造函數(shù)模式和原型模式指向構(gòu)造函數(shù)，這里要將其恢復(fù)為指向構(gòu)造函數(shù)。另外，這種混合模式，還支持向構(gòu)造函數(shù)傳遞參數(shù)。 組合使用構(gòu)造函數(shù)模式和原型模式 構(gòu)造函數(shù)模式用于定義實(shí)例屬性，原型模式用于定義方法和共享的屬性。 創(chuàng)建自定義類型的最常見方式，就是組合使用構(gòu)造函數(shù)模式和原型模式。 ...

    Shimmer 評(píng)論0 收藏0

  • JS創(chuàng)建對(duì)象模式及其對(duì)象原型鏈探究（四）：原型模式

    摘要：原型模式定義構(gòu)造函數(shù)，在構(gòu)造函數(shù)的原型對(duì)象中定義對(duì)象的屬性和方法，并通過構(gòu)造函數(shù)創(chuàng)建對(duì)象。，屬性存在于實(shí)例對(duì)象中，屬性不存在于實(shí)例對(duì)象中分割線操作符會(huì)在通過對(duì)象能夠訪問給定屬性時(shí)返回，無論該屬性是存在于實(shí)例中還是原型中。 原型模式 定義構(gòu)造函數(shù)，在構(gòu)造函數(shù)的原型對(duì)象中定義對(duì)象的屬性和方法，并通過構(gòu)造函數(shù)創(chuàng)建對(duì)象。 1.創(chuàng)建對(duì)象 function Person(){}; Person....

    ruicbAndroid 評(píng)論0 收藏0

  • JS創(chuàng)建對(duì)象模式及其對(duì)象原型鏈探究（三）：構(gòu)造函數(shù)模式

    摘要：創(chuàng)建對(duì)象與工廠模式的區(qū)別沒有顯示地創(chuàng)建對(duì)象直接將方法和屬性付給了對(duì)象沒有語句構(gòu)造函數(shù)應(yīng)該始終以一個(gè)大寫字母開頭。創(chuàng)建構(gòu)造函數(shù)的實(shí)例，必須使用操作符。 構(gòu)造函數(shù)模式 ECMAScript中的構(gòu)造函數(shù)可用來創(chuàng)建特定類型的對(duì)象，像Object和Array這樣的原生構(gòu)造函數(shù)。也可以創(chuàng)建自定義的構(gòu)造函數(shù)，從而定義自定義對(duì)象類型的屬性和方法。 1.創(chuàng)建對(duì)象 function Person(name...

    Martin91 評(píng)論0 收藏0

  • js知識(shí)梳理4.繼承的模式探究

    摘要：而且在超類型的原型中定義的方法，對(duì)子類型而言也是不可見的，結(jié)果所有類型都只能使用構(gòu)造函數(shù)模式。在主要考慮對(duì)象而不是自定義類型和構(gòu)造函數(shù)的情況下，這個(gè)模式也不錯(cuò)。 寫在前面 注：這個(gè)系列是本人對(duì)js知識(shí)的一些梳理，其中不少內(nèi)容來自書籍:Javascript高級(jí)程序設(shè)計(jì)第三版和JavaScript權(quán)威指南第六版，感謝它們的作者和譯者。有發(fā)現(xiàn)什么問題的，歡迎留言指出。 1.原型鏈 將原型鏈作...

    wenshi11019 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<