ES6中的class類詳解

2021-10-01 23:45:47 字數 1514 閱讀 3629

目錄

一、class簡介

二、靜態方法和靜態屬性

2.1 靜態方法

2.2 靜態屬性

三、class繼承extends

四、class的取值函式getter和存值函式setter

五、super關鍵字

六、注意事項:

傳統的js只有物件的概念,沒有class類的概念,因為js是基於原型的物件導向語言,原型物件特點就是將屬性全部共享給新物件。

es6引入了class類這個概念,通過class關鍵字可以定義類,這就是更符合我們平時所理解的物件導向的語言。

class person

todosome()

}export default person;

靜態方法和靜態屬性,是使用static關鍵字的屬性和方法

static classmethod()
let p = new point();

p.classmethod(); // 報錯

static prop = 1 ;  // 靜態屬性
import classtest from "./classtest";  //先引入父類

class man extends classtest

}export default man;

getter、setter就是給class的屬性讀值、傳值用的。

取值函式getter和存值函式setter可自定義賦值和取值行為,當乙個屬性只有getter沒有setter的時候,這個屬性就是唯讀屬性,不能賦值,第一次初始化也不行。

如果變數定義為私有的(定義在類的花括號外面),就可以只使用getter不使用setter。

let data=[1,2,3,4];  //放在類外面,屬於私有變數,可以只讀取

class person

get x()

set x(x)

get data()

todosome()

static dayin()

}export default person;

如何使用:

var test= new this.$myutils.classtest('haha','18');

test.x="haha3"; //改變了例項化時候的x的值

test.todosome(); //輸出:haha3的年齡是18歲。這裡就已經不是例項化時候的haha了

console.log(test.data); //結果:列印[1,2,3,4]

1、在類中定義方法時候,不可以給方法加上function關鍵字,因為js中建構函式是用function定義的,兩個隔開。

2、所有方法不要用逗號隔開,否則會報錯。

es6中class類的使用

在es5中我們是使用建構函式例項化出來乙個物件,那麼建構函式與普通的函式有什麼區別呢?其實沒有區別,無非就是函式名稱用首字母大寫來加以區分,這個不用對說對es5有了解的朋友都應該知道。但是es5的這種方式給人的感覺還是不夠嚴謹,於是在es6中就換成了class,就是把es5中的function換成了...

ES6中的類 Class 的寫法

1.傳統es5中的class用法 es5的對應寫法 function 定義原型方法 user.prototype.show function 定義靜態方法 user.run function window.user user 1.es6中的class用法 class user 原型方法 show 靜...

ES6中的類(class)和繼承

語法形式 class person showname showage let p1 new person yang 18 console.log p1.showname p1.showage 也可以寫成 const person class class裡面取值函式 getter class裡面設定函...