在es5中主要是通過構(gòu)造函數(shù)方式和原型方式來定義一個類攒盈，在es6中我們可以通過class來定義類最住，今天整理一下它們的區(qū)別箫津。
關(guān)于es5中定義類的方式，可以看這一篇Js的‘類’拨拓，我們這里主要聊es5類和es6中class類的區(qū)別。
一氓栈、class類必須new調(diào)用渣磷，不能直接執(zhí)行。
image
class類執(zhí)行的話會報錯授瘦，而es5中的類和普通函數(shù)并沒有本質(zhì)區(qū)別醋界，執(zhí)行肯定是ok的竟宋。
二、class類不存在變量提升
image
image
圖2報錯形纺，說明class方式?jīng)]有把類的定義提升到頂部丘侠。
三、class類無法遍歷它實例原型鏈上的屬性和方法
function Foo (color) {
this.color = color
}
Foo.prototype.like = function () {
console.log(`like${this.color}`)
}
let foo = new Foo()
for (let key in foo) {
// 原型上的like也被打印出來了
console.log(key) // color逐样、like
}
class Foo {
constructor (color) {
this.color = color
}
like () {
console.log(`like${this.color}`)
}
}
let foo = new Foo('red')
for (let key in foo) {
// 只打印一個color,沒有打印原型鏈上的like
console.log(key) // color
}
四蜗字、new.target屬性
es6為new命令引入了一個new.target屬性，它會返回new命令作用于的那個構(gòu)造函數(shù)脂新。如果不是通過new調(diào)用或Reflect.construct()調(diào)用的挪捕，new.target會返回undefined
function Person(name) {
if (new.target === Person) {
this.name = name;
} else {
throw new Error('必須使用 new 命令生成實例');
}
}
let obj = {}
Person.call(obj, 'red') // 此時使用非new的調(diào)用方式就會報錯
五、class類有static靜態(tài)方法
static靜態(tài)方法只能通過類調(diào)用争便，不會出現(xiàn)在實例上级零；另外如果靜態(tài)方法包含 this 關(guān)鍵字，這個 this 指的是類滞乙，而不是實例奏纪。static聲明的靜態(tài)屬性和方法都可以被子類繼承。
class Foo {
static bar() {
this.baz(); // 此處的this指向類
}
static baz() {
console.log('hello'); // 不會出現(xiàn)在實例中
}
baz() {
console.log('world');
}
}
Foo.bar() // hello
