本文小編為大家詳細介紹“class類是不是es6語法”，內(nèi)容詳細，步驟清晰，細節(jié)處理妥當，希望這篇“class類是不是es6語法”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學習新知識吧。
創(chuàng)新互聯(lián)是一家集成都做網(wǎng)站、網(wǎng)站設計、網(wǎng)站頁面設計、網(wǎng)站優(yōu)化SEO優(yōu)化為一體的專業(yè)網(wǎng)絡公司，已為成都等多地近百家企業(yè)提供網(wǎng)站建設服務。追求良好的瀏覽體驗,以探求精品塑造與理念升華,設計最適合用戶的網(wǎng)站頁面。 合作只是第一步，服務才是根本,我們始終堅持講誠信，負責任的原則，為您進行細心、貼心、認真的服務,與眾多客戶在蓬勃發(fā)展的市場環(huán)境中,互促共生。
class類是es6語法，是es6新增的一種特性。ES6中，引入了class關(guān)鍵字用于快速地定義“類”，但是類的本質(zhì)是function；它可以看作一個語法糖，讓對象原型的寫法更加清晰、更像面向?qū)ο缶幊痰恼Z法。用class定義類的方法“class Person{//類聲明}”或“const Person=class{//類表達式}”。
class類是es6語法，是es6新增的一種特性。
ES6中，引入了class關(guān)鍵字用于快速地定義“類”。
在JS中，“類”的本質(zhì)是function，可以將其看做一個語法糖，讓對象原型的寫法更簡潔清晰，更像面向?qū)ο缶幊痰恼Z法。
我們會發(fā)現(xiàn)，按照前面的構(gòu)造函數(shù)形式創(chuàng)建 類，不僅僅和編寫普通的函數(shù)過于相似，而且代碼并不容易理解。
在ES6（ECMAScript2015）新的標準中使用了class關(guān)鍵字來直接定義類；但是類本質(zhì)上依然是前面所講的構(gòu)造函數(shù)、原型鏈的語法糖而已；所以學好了前面的構(gòu)造函數(shù)、原型鏈更有利于我們理解類的概念和繼承關(guān)系；
那么，如何使用class來定義一個類呢？–可以使用兩種方式來聲明類：類聲明和類表達式；
class Person{
//類聲明
}
const Person=class{
//類表達式
}
我們來研究一下類的一些特性：你會發(fā)現(xiàn)它和我們的構(gòu)造函數(shù)的特性其實是一致的；
console.log(Person.prototype)
console.log(Person.prototype.__proto__)//Object null
console.log(Person.prototype.constructor)//Person
console.log(typeof Person) // function
var p = new Person()
console.log(p.__proto__ === Person.prototype) // true
如果我們希望在創(chuàng)建對象的時候給類傳遞一些參數(shù)，這個時候應該如何做呢？
每個類都可以有一個自己的構(gòu)造函數(shù)（方法），這個方法的名稱是固定的constructor；
當我們通過new操作符，操作一個類的時候會調(diào)用這個類的構(gòu)造函數(shù)constructor；
每個類只能有一個構(gòu)造函數(shù)，如果包含多個構(gòu)造函數(shù)，那么會拋出異常；
當我們通過new關(guān)鍵字操作類的時候，會調(diào)用這個constructor函數(shù)，并且執(zhí)行如下操作：
1.在內(nèi)存中創(chuàng)建一個新的對象（空對象）；
2.這個對象內(nèi)部的[[prototype]]屬性會被賦值為該類的prototype屬性；
3.構(gòu)造函數(shù)內(nèi)部的this，會指向創(chuàng)建出來的新對象；
4.執(zhí)行構(gòu)造函數(shù)的內(nèi)部代碼（函數(shù)體代碼）；
5.如果構(gòu)造函數(shù)沒有返回非空對象，則返回創(chuàng)建出來的新對象；
在上面我們定義的屬性都是直接放到了this上，也就意味著它是放到了創(chuàng)建出來的新對象中：
在前面我們說過對于實例的方法，我們是希望放到原型上的，這樣可以被多個實例來共享；
這個時候我們可以直接在類中定義；
class Person {
constructor(name, age) {
this.name = name
this.age = age
this._address = "廣州市"
}
// 普通的實例方法
// 創(chuàng)建出來的對象進行訪問
// var p = new Person()
// p.eating()
eating() {
console.log(this.name + " eating~")
}
running() {
console.log(this.name + " running~")
}
}
我們之前講對象的屬性描述符時有講過對象可以添加setter和getter函數(shù)的，那么類也是可以的：
class Person {
constructor(name, age) {
this.name = name
this.age = age
this._address = "廣州市"
}
// 類的訪問器方法
get address() {
console.log("攔截訪問操作")
return this._address
}
set address(newAddress) {
console.log("攔截設置操作")
this._address = newAddress
}
}
靜態(tài)方法通常用于定義直接使用類來執(zhí)行的方法，不需要有類的實例，使用static關(guān)鍵字來定義：
class Person {
constructor(name, age) {
this.name = name
this.age = age
this._address = "廣州市"
}
// 類的靜態(tài)方法(類方法)
// Person.createPerson()
static randomPerson() {
var nameIndex = Math.floor(Math.random() * names.length)
var name = names[nameIndex]
var age = Math.floor(Math.random() * 100)
return new Person(name, age)
}
}
前面我們花了很大的篇幅討論了在ES5中實現(xiàn)繼承的方案，雖然最終實現(xiàn)了相對滿意的繼承機制，但是過程卻依然是非常繁瑣的。在ES6中新增了使用extends關(guān)鍵字，可以方便的幫助我們實現(xiàn)繼承：
class Person{
}
class Student extends Person{
}
我們會發(fā)現(xiàn)在上面的代碼中我使用了一個super關(guān)鍵字，這個super關(guān)鍵字有不同的使用方式：注意：在子（派生）類的構(gòu)造函數(shù)中使用this或者返回默認對象之前，必須先通過super調(diào)用父類的構(gòu)造函數(shù)！
super的使用位置有三個：子類的構(gòu)造函數(shù)、實例方法、靜態(tài)方法；
我們也可以讓我們的類繼承自內(nèi)置類，比如Array：
class HYArray extends Array {
firstItem() {
return this[0]
}
lastItem() {
return this[this.length-1]
}
}
var arr = new HYArray(1, 2, 3)
console.log(arr.firstItem())
console.log(arr.lastItem())
JavaScript的類只支持單繼承：也就是只能有一個父類。那么在開發(fā)中我們我們需要在一個類中添加更多相似的功能時，應該如何來做呢？這個時候我們可以使用混入（mixin）；
面向?qū)ο蟮娜筇匦裕悍庋b、繼承、多態(tài)。
前面兩個我們都已經(jīng)詳細解析過了，接下來我們討論一下JavaScript的多態(tài)。JavaScript有多態(tài)嗎？
維基百科對多態(tài)的定義：多態(tài)（英語：polymorphism）指為不同數(shù)據(jù)類型的實體提供統(tǒng)一的接口，或使用一
個單一的符號來表示多個不同的類型。
非常的抽象，個人的總結(jié)：不同的數(shù)據(jù)類型進行同一個操作，表現(xiàn)出不同的行為，就是多態(tài)的體現(xiàn)。
那么從上面的定義來看，JavaScript是一定存在多態(tài)的。
// 多態(tài): 當對不同的數(shù)據(jù)類型執(zhí)行同一個操作時, 如果表現(xiàn)出來的行為(形態(tài))不一樣, 那么就是多態(tài)的體現(xiàn).
function calcArea(foo) {
console.log(foo.getArea())
}
var obj1 = {
name: "why",
getArea: function() {
return 1000
}
}
class Person {
getArea() {
return 100
}
}
var p = new Person()
calcArea(obj1)
calcArea(p)
// 也是多態(tài)的體現(xiàn)
function sum(m, n) {
return m + n
}
sum(20, 30)
sum("abc", "cba")// 傳統(tǒng)的面向?qū)ο蠖鄳B(tài)是有三個前提:
// 1> 必須有繼承(是多態(tài)的前提)
// 2> 必須有重寫(子類重寫父類的方法)
// 3> 必須有父類引用指向子類對象
// Shape形狀
class Shape {
getArea() {}
}
class Rectangle extends Shape {
getArea() {
return 100
}
}
class Circle extends Shape {
getArea() {
return 200
}
}
var r = new Rectangle()
var c = new Circle()
// 多態(tài): 當對不同的數(shù)據(jù)類型執(zhí)行同一個操作時, 如果表現(xiàn)出來的行為(形態(tài))不一樣, 那么就是多態(tài)的體現(xiàn).
function calcArea(shape: Shape) {
console.log(shape.getArea())
}
calcArea(r)
calcArea(c)
export {}
讀到這里，這篇“class類是不是es6語法”文章已經(jīng)介紹完畢，想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領會，如果想了解更多相關(guān)內(nèi)容的文章，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
重慶分公司
重慶分公司
