一步，一步前进の一步
ES6深入浅出之Classes。翻译的同时乱加个人见解，强烈引荐浏览原作者的文章，一针见血。es6-classes-in-depth
类语法实质
JS 是基于原型的言语，那末ES6里的classes是什么东西？classes 是原型继续的语法糖——主假如用来诱惑不太明白 JS 原型链语法的其他言语运用者。ES6有很多新的特征实质上就是语法糖，classes也不破例。我会向你证实 classes 是语法糖，由于classes 的语法很轻易运用 ES5的语法完成出来，classes 并非JS 语法的一个革新，它存在的目标仅仅是使原型继续变得简朴。
ES5和 ES6的类完成对照
那末，我假定你已很好的明白了原型继续的道理,毕竟你已在浏览ES6这么高等的东西了。下面代码定义车的类，可被实例化,加油,挪动。
function Car () {
this.fuel = 0;
this.distance = 0;
}
Car.prototype.move = function () {
if (this.fuel < 1) {
throw new RangeError('Fuel tank is depleted')
}
this.fuel--
this.distance += 2
}
Car.prototype.addFuel = function () {
if (this.fuel >= 60) {
throw new RangeError('Fuel tank is full')
}
this.fuel++
}运用下面的代码使车跑起来吧：
var car = new Car()
car.addFuel()
car.move()
car.move()
// <- RangeError: 'Fuel tank is depleted'上面的代码都是 ES5，那末 ES6该怎样完成呢？类声明的誊写和对象的写法非常相似，花括号前面只多了 class Name,类要领我们将采纳要领名简写的情势。contrustor 是组织函数，可在内里初始化我们想初始化的东西。
class Car {
constructor () {
this.fuel = 0
this.distance = 0
}
move () {
if (this.fuel < 1) {
throw new RangeError('Fuel tank is depleted')
}
this.fuel--
this.distance += 2
}
addFuel () {
if (this.fuel >= 60) {
throw new RangeError('Fuel tank is full')
}
this.fuel++
}
}须要强调的是：类和对象声明写起来是很像，然则在类中属性及要领间是不允许运用逗号分开的，分号却是没问题。
类静态要领
大多数情况下，类是有静态要领的。追念一下我们一样平常运用最多的数组，罕见的实例要领有.filter、 .reduce、 .map,类要领有Array.isArray。ES5中增加类要领非常轻易(类要领和静态要领是同一个东西)：
// es5
function Car () {
this.topSpeed = Math.random()
}
Car.isFaster = function (left, right) {
return left.topSpeed > right.topSpeed
}在 ES6的 class 语法中，我们能够运用static关键字润饰要领，进而取得静态要领。
class Car {
constructor () {
this.topSpeed = Math.random()
}
static isFaster (left, right) {
return left.topSpeed > right.topSpeed
}
}那末既然说classes是语法糖，那我们一样能够运用以下体式格局完成静态要领：
class Car {
constructor () {
this.topSpeed = Math.random()
}
}
Car.isFaster = (left, right) => {
return left.topSpeed > right.topSpeed;
}现在 ES6还不支撑运用 static 来润饰属性，若想取得类的静态属性，该怎样完成？请参考上面代码，给出答案，能够在批评区做答?
供应另一种思绪运用 get、set完成静态属性，try it.
类继续
classes不仅使类声明变得简朴，它让继续变得越发可读，轻易。ES6中的 extends支撑从基类衍生出更具个性化的子类。尽人皆知，特斯拉较其他汽车比较省油,特斯拉是啥。那末，我们基于上面的 Car来完成Tesla类。下面的代码的意义是 Tesla 类继续 Car,并复写 Car 爸爸的 move 要领进而行驶更远的间隔。
class Tesla extends Car {
move () {
super.move()
this.distance += 4
}
}
var car = new Tesla()
car.addFuel()
car.move()
console.log(car.distance)关于继续，有一点须要特别注意，当子类想要完成特有的组织函数 constructor 时，首行必需运用 super(…)挪用父类的组织函数，先取得父类的this作为本身的 this。此处的理论有一点点深，有时机再讲。
class Car {
constructor (speed) {
this.speed = speed
}
}
class Tesla extends Car {
constructor (speed) {
// 不挪用 super 的话，会报错
super(speed * 2)
// 做其他初始化事情 。。。
}
}知识点总结
- classes 只是语法糖，使类声明和继续誊写变的轻易
- 子类 constructor 要么有，要么首行挪用super
- 静态要领
static润饰 - 子类会掩盖父类的同名要领，然则能够运用 super.xxxx 要领挪用父类要领。
一步本人作了个决议，把Nicolás Bevacqua es6-in-depth都给翻译了，假如侵权了我就马上删除🤞。不知道该怎样疾速提高个人妙技，人还懒。望人人监视，列位先辈给指条提高明路也能够。
🌚 前端进修QQ群: 538631558 🌚
【开辟环境引荐】
Cloud Studio 是基于浏览器的集成式开辟环境，支撑绝大部分编程言语，包含 HTML5、PHP、Python、Java、Ruby、C/C++、.NET 小顺序等等，无需下载安装顺序，一键切换开辟环境。 Cloud Studio供应了完全的 Linux 环境，而且支撑自定义域名指向，动态盘算资本调解，能够完成种种运用的开辟编译与布置。
