真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

ES6新特性之類和繼承的示例分析-創(chuàng)新互聯(lián)

這篇文章主要介紹了ES6新特性之類和繼承的示例分析,具有一定借鑒價(jià)值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。

為龍陵等地區(qū)用戶提供了全套網(wǎng)頁(yè)設(shè)計(jì)制作服務(wù),及龍陵網(wǎng)站建設(shè)行業(yè)解決方案。主營(yíng)業(yè)務(wù)為成都網(wǎng)站制作、網(wǎng)站設(shè)計(jì)、龍陵網(wǎng)站設(shè)計(jì),以傳統(tǒng)方式定制建設(shè)網(wǎng)站,并提供域名空間備案等一條龍服務(wù),秉承以專業(yè)、用心的態(tài)度為用戶提供真誠(chéng)的服務(wù)。我們深信只要達(dá)到每一位用戶的要求,就會(huì)得到認(rèn)可,從而選擇與我們長(zhǎng)期合作。這樣,我們也可以走得更遠(yuǎn)!

一、類(Class)

1.基本語(yǔ)法

JavaScript語(yǔ)言的傳統(tǒng)方法是通過(guò)構(gòu)造函數(shù),定義并生成新對(duì)象。下面是一個(gè)例子

function Point(x, y) {
  this.x = x;
  this.y = y;
}
Point.prototype.toString = function () {
  return '(' + this.x + ', ' + this.y + ')';
};
var p = new Point(1, 2);

ES6提供了更接近傳統(tǒng)語(yǔ)言的寫(xiě)法,引入了Class(類)這個(gè)概念,作為對(duì)象的模板。通過(guò)class關(guān)鍵字,可以定義類。基本上,ES6的class可以看作只是一個(gè)語(yǔ)法糖,它的絕大部分功能,ES5都可以做到,新的class寫(xiě)法只是讓對(duì)象原型的寫(xiě)法更加清晰、更像面向?qū)ο缶幊痰恼Z(yǔ)法而已。上面的代碼用ES6的“類”改寫(xiě),就是下面這樣。

//定義類
class Point {
  constructor(x, y) {  //constructor 構(gòu)造方法
    this.x = x;
    this.y = y;
  }
  toString() {
    return '(' + this.x + ', ' + this.y + ')';
  }
}
var p = new Point(1, 2);

構(gòu)造函數(shù)的prototype屬性,在ES6的“類”上面繼續(xù)存在。事實(shí)上,類的所有方法都還是定義在類的prototype屬性上面。

2.constructor方法

constructor方法是類的默認(rèn)方法,通過(guò)new命令生成對(duì)象實(shí)例時(shí),自動(dòng)調(diào)用該方法。一個(gè)類必須有constructor方法,如果沒(méi)有顯式定義,一個(gè)空的constructor方法會(huì)被默認(rèn)添加。

二、繼承(Extends)

Class之間可以通過(guò)extends關(guān)鍵字實(shí)現(xiàn)繼承,這比ES5的通過(guò)修改原型鏈實(shí)現(xiàn)繼承,要清晰和方便很多。

class ColorPoint extends Point {
  constructor(x, y, color) {
    super(x, y); // 調(diào)用父類的constructor(x, y)
    this.color = color;
  }
  toString() {
    return this.color + ' ' + super.toString(); // 調(diào)用父類的toString()
  }
}

上面代碼中,constructor方法和toString方法之中,都出現(xiàn)了super關(guān)鍵字,它在這里表示父類的構(gòu)造函數(shù),用來(lái)新建父類的this對(duì)象。

子類必須在constructor方法中調(diào)用super方法,否則新建實(shí)例時(shí)會(huì)報(bào)錯(cuò)。這是因?yàn)樽宇悰](méi)有自己的this對(duì)象,而是繼承父類的this對(duì)象,然后對(duì)其進(jìn)行加工。如果不調(diào)用super方法,子類就得不到this對(duì)象。

三、原生構(gòu)造函數(shù)繼承

原生構(gòu)造函數(shù)是指語(yǔ)言內(nèi)置的構(gòu)造函數(shù),通常用來(lái)生成數(shù)據(jù)結(jié)構(gòu)。ECMAScript的原生構(gòu)造函數(shù)大致有下面這些。以前,這些原生構(gòu)造函數(shù)是無(wú)法繼承的。

Boolean()
Number()
String()
Array()
Date()
Function()
RegExp()
Error()
Object()

ES6允許繼承原生構(gòu)造函數(shù)定義子類,因?yàn)镋S6是先新建父類的實(shí)例對(duì)象this,然后再用子類的構(gòu)造函數(shù)修飾this,使得父類的所有行為都可以繼承。下面是一個(gè)繼承Array的例子。

class MyArray extends Array {
  constructor(...args) {
    super(...args);
  }
}
var arr = new MyArray();
arr[0] = 12;
arr.length // 1
arr.length = 0;
arr[0] // undefined

上面代碼定義了一個(gè)MyArray類,繼承了Array構(gòu)造函數(shù),因此就可以從MyArray生成數(shù)組的實(shí)例。這意味著,ES6可以自定義原生數(shù)據(jù)結(jié)構(gòu)(比如Array、String等)的子類,這是ES5無(wú)法做到的。

四、Class的Generator方法

如果某個(gè)方法之前加上星號(hào)(*),就表示該方法是一個(gè)Generator函數(shù)。

class Foo {
  constructor(...args) {
    this.args = args;
  }
  * [Symbol.iterator]() {
    for (let arg of this.args) {
      yield arg;
    }
  }
}
for (let x of new Foo('hello', 'world')) {
  console.log(x);
}
// hello
// world

上面代碼中,F(xiàn)oo類的Symbol.iterator方法前有一個(gè)星號(hào),表示該方法是一個(gè)Generator函數(shù)。Symbol.iterator方法返回一個(gè)Foo類的默認(rèn)遍歷器,for...of循環(huán)會(huì)自動(dòng)調(diào)用這個(gè)遍歷器。

五、Class的靜態(tài)方法

類相當(dāng)于實(shí)例的原型,所有在類中定義的方法,都會(huì)被實(shí)例繼承。如果在一個(gè)方法前,加上static關(guān)鍵字,就表示該方法不會(huì)被實(shí)例繼承,而是直接通過(guò)類來(lái)調(diào)用,這就稱為“靜態(tài)方法”。

class Foo {
  static classMethod() {
    return 'hello';
  }
}
Foo.classMethod() // 'hello'
var foo = new Foo();
foo.classMethod()
// TypeError: foo.classMethod is not a function

上面代碼中,F(xiàn)oo類的classMethod方法前有static關(guān)鍵字,表明該方法是一個(gè)靜態(tài)方法,可以直接在Foo類上調(diào)用(Foo.classMethod()),而不是在Foo類的實(shí)例上調(diào)用。如果在實(shí)例上調(diào)用靜態(tài)方法,會(huì)拋出一個(gè)錯(cuò)誤,表示不存在該方法。

父類的靜態(tài)方法,可以被子類繼承。

class Foo {
  static classMethod() {
    return 'hello';
  }
}
class Bar extends Foo {
}
Bar.classMethod(); // 'hello'

上面代碼中,父類Foo有一個(gè)靜態(tài)方法,子類Bar可以調(diào)用這個(gè)方法。

感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“ES6新特性之類和繼承的示例分析”這篇文章對(duì)大家有幫助,同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)建站,關(guān)注創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司行業(yè)資訊頻道,更多相關(guān)知識(shí)等著你來(lái)學(xué)習(xí)!

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)建站www.cdcxhl.com,海內(nèi)外云服務(wù)器15元起步,三天無(wú)理由+7*72小時(shí)售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì),專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。


新聞名稱:ES6新特性之類和繼承的示例分析-創(chuàng)新互聯(lián)
當(dāng)前路徑:http://weahome.cn/article/pgocd.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部