Class 是 es6 的語(yǔ)法糖红氯,es5 也能通過(guò)其他方式實(shí)現(xiàn)
基礎(chǔ)
let ss = "sayHi"
class Fn {
construct(x) {
this.x = x
}
toString() {
}
[ss]() {
}
}
Obeject.keys(Fn.prototype)
Obeject.getOwnPropertyNames(Fn.prototype)
typeof Fn // function
Fn == Fn.prototype.construct // true
- Class 內(nèi)部的方法不使用
function
- 方法之間不使用
;
发魄,否則莹捡,會(huì)報(bào)錯(cuò) - 方法名可以使用變量
- 寫(xiě)在
class
內(nèi)部的方法纲刀,不可枚舉雅潭,因此罐盔,使用Object.keys
無(wú)法獲取 - 類的數(shù)據(jù)類型是
Function
, 類本身就指向構(gòu)造函數(shù) - 類中的方法但绕,其實(shí)相當(dāng)于寫(xiě)在原型上
- 這種形式,不存在變量提升
construct
- 必須使用
new
- 默認(rèn)返回
this
實(shí)例對(duì)象惶看,可以自定義返回對(duì)象return Object.create(null)
類的實(shí)例對(duì)象
- 使用
new
- 只有直接將屬性定義在
this
, 那么這個(gè)屬性才屬于實(shí)例對(duì)象 - 所有類實(shí)例共享一個(gè)原型對(duì)象
- 獲取圓形對(duì)象的方法
- 類
Fn.prototype
- 實(shí)例對(duì)象
fn.__proto__
(會(huì)依賴環(huán)境) - 實(shí)例對(duì)象
Object.getPrototypeOf(fn)
// 實(shí)例對(duì)象屬性
var fn = new Fn(1)
fn.hasOwnproperty('x') // true
// 實(shí)例對(duì)象原型
var ff = new Fn(2)
fn.__proto__ = ff.__proto__ // true
小小知識(shí)點(diǎn)
Object.getPrototypeOf(obj)
- 當(dāng)參數(shù)是字符串時(shí)壁熄,在
es6
中不會(huì)報(bào)錯(cuò)帚豪,回返回String.protptype
Class 表達(dá)式
const MyClass = class Me {
sayHello() {
console.log('Hello')
}
}
MyClass.sayHello()
MyClass.name // MyClass
-
Me
只能在類的內(nèi)部使用 - 使用函數(shù)表達(dá)式可以構(gòu)建直接使用的類
- 類有
name
屬性
私有方法
有時(shí),需要類有自己的私有方法草丧,外部無(wú)法通過(guò)對(duì)象使用狸臣。有以下的解決方法
- 普通方法
_say
,下滑線昌执。這只是規(guī)范約定烛亦,外部依舊可以獲取fn._say
- 內(nèi)部訪問(wèn)全局方法
- 使用 Symbol 值的唯一性
let foo = Symbol('foo')
class Fn {
say() {
// 只能內(nèi)部使用
this[foo]('1')
}
// 私有方法
[foo](param) {}
}
私有屬性
提案,
#
表示私有屬性和私有方法
this指向
將對(duì)象中的方法解構(gòu)出來(lái)懂拾,容易出錯(cuò)煤禽。
- 在
constructor
中手動(dòng)將this
綁定到方法上 - 使用箭頭函數(shù)
- 使用proxy
回憶
- 箭頭函數(shù)this引用外層this,并且不會(huì)改變
- proxy基本語(yǔ)法
var pp = new Proxy(target,handler)
Class 的取值函數(shù)和存值函數(shù)
屬性上可以設(shè)置
class Fn {
get prop() {
}
set prop(val) {
}
}
var descriptor = Object.getOwnPropertyDescriptor(Fn.prototype,"prop")
"get" in descriptor // true
- 取值函數(shù)和存值函數(shù)設(shè)置在屬性的
Descriptor
對(duì)象上
Class 的 Generator方法
- class中的方法前岖赋,添加一個(gè)
*
就是generator方法
Class 的靜態(tài)方法和靜態(tài)屬性
靜態(tài)方法
- 語(yǔ)法檬果,方法名前添加一個(gè)
static
就是靜態(tài)方法 - 靜態(tài)方法不能被實(shí)例繼承
- 靜態(tài)方法可以被子類繼承
- 靜態(tài)方法中
this
指向的是當(dāng)前類
靜態(tài)屬性
- 只能通過(guò)
Fn.prop
的方式添加靜態(tài)屬性
new.target 屬性
該屬性一般是在構(gòu)造函數(shù)中使用
- 有兩個(gè)功能
- 使得當(dāng)前類必須使用new
- 定義只能繼承不能直接使用的類(有點(diǎn)像接口)
- 子類繼承父類,創(chuàng)建子類實(shí)例時(shí)唐断,
new target
指向子類 - 類不使用
new
选脊,那么new.target
為undefined
class Parent {
constructor(name) {
if (new.target == Parent) {
this.name = name;
}else {
throw New Error('必須使用new生成實(shí)例')
}
}
}