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

資訊專欄INFORMATION COLUMN

ES5的原型鏈和ES6的類實(shí)現(xiàn)詳解

Warren / 1565人閱讀

摘要：類才支持實(shí)例屬性代碼解讀上面暫時(shí)只是概念性的寫法，事實(shí)上，的類只是一個(gè)原型鏈的語法糖而已，主要是從寫法上更接近于面相對(duì)象的類而已，另外一個(gè)作用就是區(qū)分的構(gòu)造函數(shù)和函數(shù)之間的區(qū)分。

ES5的原型鏈和ES6的類實(shí)現(xiàn)詳解

JavaScript最初設(shè)計(jì)時(shí)受到了面相對(duì)象編程的影響，從而引入了new關(guān)鍵字，來實(shí)例化對(duì)象。而在ES5中new后面跟著的是構(gòu)造函數(shù)（也是函數(shù)），而到了ES6則改成了clas了，而一開始new創(chuàng)建對(duì)象都是獨(dú)立的對(duì)象，并不能像java那樣擁有繼承的概念，去共享變量和方法，為了解決這個(gè)問題，JavaScript就又給構(gòu)造函數(shù)設(shè)計(jì)了一個(gè)prototype屬性，這樣所有私有的方法和變量就放到構(gòu)造函數(shù)里面定義，而所有的公共的變量和方法就放到prototype對(duì)象里面，這樣當(dāng)構(gòu)造函數(shù)創(chuàng)建一個(gè)實(shí)例化的對(duì)象的時(shí)候，就即擁有自己的私有變量和方法，也有公有的變量和方法了，實(shí)例化出來的對(duì)象的私有方法和變量修改都不會(huì)互相有影響，只有在修改公有的變量和方法的時(shí)候是對(duì)所有實(shí)例生效的。

ES5原型鏈

Example

function Person(name){
    this.name = name;
}
(function ($Person){
    $Person.prototype = {
        welcome: "hello",
        introduce: function(){
            return this.welcome + ",I am " + this.name;
        }
    }
})(Person)

var person1 = new Person("arvin");
var person2 = new Person("peter");
console.log(person1.introduce());   // hello,I am arvin
console.log(person2.introduce());   // hello,I am peter

person1.__proto__.welcome = "hi";
console.log(person1.introduce());   // hi,I am arvin
console.log(person2.introduce());   // hi,I am peter

代碼解讀：以上是本人推薦在使用ES5時(shí)，寫原型鏈的方法，目的是為了代碼簡潔，方便復(fù)用，僅供參考。代碼中在原型鏈上定義了一個(gè)welcome公共變量，這里要注意的是如果有同樣名稱的私有變量welcome時(shí)，原型方法introduce里面的this.welcome會(huì)首先查找私有變量welcome并使用，這個(gè)其實(shí)就和面相對(duì)象的覆寫類似了。另外可以看出，ES5的構(gòu)造函數(shù)（一般首字母大寫以區(qū)分普通函數(shù)）在new的時(shí)候確實(shí)是創(chuàng)建了不同的區(qū)塊來存放其私有變量name的值的，而對(duì)于原型鏈的變量welcome和方法introduce也確實(shí)是各個(gè)Person實(shí)例共用了同一塊內(nèi)存區(qū)域的，只要其中一個(gè)修改了原型鏈上的變量其他所有的對(duì)象實(shí)例再調(diào)用的時(shí)候從公共內(nèi)存取出來的也就是被修改過只有的值了，這里要注意的是，構(gòu)造函數(shù)new出來的實(shí)例對(duì)象，創(chuàng)建出來的指向原型鏈prototype的是其__proto__屬性，也就是說person1.__proto__ === Person.prototype === person2.__proto__，這也從實(shí)際上證明了原型鏈對(duì)象在內(nèi)存中只存了一份，是共用的。

ES6類

Example

class Person {
    constructor(name) {
        this.name = name;
    }
    welcome = "hello";  // S7才支持實(shí)例屬性
    introduce(){
        return this.welcome + ",I am " + this.name;
    }
}

var person1 = new Person("arvin");
var person2 = new Person("peter");
console.log(person1.introduce());   // hello,I am arvin
console.log(person2.introduce());   // hello,I am peter

person1.__proto__.welcome = "hi";
console.log(person1.introduce());   // hi,I am arvin
console.log(person2.introduce());   // hi,I am peter

代碼解讀：上面暫時(shí)只是概念性的寫法，事實(shí)上，ES6的類只是一個(gè)ES5原型鏈的語法糖而已，主要是從寫法上更接近于面相對(duì)象的類而已，另外一個(gè)作用就是區(qū)分ES5的構(gòu)造函數(shù)和函數(shù)之間的區(qū)分。

小結(jié)：對(duì)于ES5和ES6的類似面相對(duì)象和非面向?qū)ο蟮脑?，以java為例提出以下幾點(diǎn)個(gè)人見解： 
1、java在繼承（extend）的時(shí)候，子類是會(huì)復(fù)制一遍所有父類的方法和屬性（除已覆寫的除外）到一個(gè)獨(dú)立的內(nèi)存空間中的，即所有子類之間不存在任何的關(guān)系；而這點(diǎn)其實(shí)就和ES5的原型繼承prototype和ES6的extend有很大的不同了。


2、java在new創(chuàng)建一個(gè)實(shí)例的時(shí)候同樣是會(huì)開辟一個(gè)獨(dú)立的屬于該實(shí)例的內(nèi)存空間，同一個(gè)類的實(shí)例之間互不影響；而ES5和ES6的創(chuàng)建實(shí)例的時(shí)候?qū)嵗匀皇呛皖愂谴嬖陉P(guān)聯(lián)的，而且是可以直接影響到類以及其他子類的公共狀態(tài)和方法的。

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

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

相關(guān)文章

  • ES5的原型鏈和ES6的類實(shí)現(xiàn)詳解

    摘要：類才支持實(shí)例屬性代碼解讀上面暫時(shí)只是概念性的寫法，事實(shí)上，的類只是一個(gè)原型鏈的語法糖而已，主要是從寫法上更接近于面相對(duì)象的類而已，另外一個(gè)作用就是區(qū)分的構(gòu)造函數(shù)和函數(shù)之間的區(qū)分。 ES5的原型鏈和ES6的類實(shí)現(xiàn)詳解 JavaScript最初設(shè)計(jì)時(shí)受到了面相對(duì)象編程的影響，從而引入了new關(guān)鍵字，來實(shí)例化對(duì)象。而在ES5中new后面跟著的是構(gòu)造函數(shù)（也是函數(shù)），而到了ES6則改成了cla...

    王偉廷 評(píng)論0 收藏0

  • 詳解javascript的類

    摘要：原文地址詳解的類博主博客地址的個(gè)人博客從當(dāng)初的一個(gè)彈窗語言，一步步發(fā)展成為現(xiàn)在前后端通吃的龐然大物。那么，的類又該怎么定義呢在面向?qū)ο缶幊讨?，類是?duì)象的模板，定義了同一組對(duì)象又稱實(shí)例共有的屬性和方法。這個(gè)等同于的屬性現(xiàn)已棄用。。 前言 生活有度，人生添壽。 原文地址：詳解javascript的類 博主博客地址：Damonare的個(gè)人博客 ??Javascript從當(dāng)初的一個(gè)彈窗語言，一...

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

  • 詳解javascript的類

    摘要：原文地址詳解的類博主博客地址的個(gè)人博客從當(dāng)初的一個(gè)彈窗語言，一步步發(fā)展成為現(xiàn)在前后端通吃的龐然大物。那么，的類又該怎么定義呢在面向?qū)ο缶幊讨?，類是?duì)象的模板，定義了同一組對(duì)象又稱實(shí)例共有的屬性和方法。這個(gè)等同于的屬性現(xiàn)已棄用。。 前言 生活有度，人生添壽。 原文地址：詳解javascript的類 博主博客地址：Damonare的個(gè)人博客 ??Javascript從當(dāng)初的一個(gè)彈窗語言，一...

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

  • 剖析JS的原型鏈和繼承

    摘要：接下來我們來聊一下的原型鏈繼承和類。組合繼承為了復(fù)用方法，我們使用組合繼承的方式，即利用構(gòu)造函數(shù)繼承屬性，利用原型鏈繼承方法，融合它們的優(yōu)點(diǎn)，避免缺陷，成為中最常用的繼承。 JavaScript是一門面向?qū)ο蟮脑O(shè)計(jì)語言，在JS里除了null和undefined，其余一切皆為對(duì)象。其中Array/Function/Date/RegExp是Object對(duì)象的特殊實(shí)例實(shí)現(xiàn)，Boolean/N...

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

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

0條評(píng)論

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