class类的简单理解
其实，es6的class类可以看做一个语法糖，他的绝大部分功能都能用es5做到，新的class写法只是让对象原型的写法更加清晰，更像面向对象编程的语法而已。
function Point(x, y){
this.x = x;
this.y = y
}
Point.prototype.toString = function(){
return this.x + this.y;
}
var p = new Point(1, 2);
console.log(p.toString()) //3
- 上面的es5构造函数用class改写就是下面这样
// 定义类的方法时，前面不需要加function保留字，方法之间也不要加逗号，加了会报错
class Point {
// constructor是一个构造函数用来接收参数。如果没有参数的话，可以不写，但是浏览器会默认加上
constructor(x, y){
this.x = x;
this.y = y;
}
toString(){
return this.x + this.y;
}
}
var p = new Point(1, 2)
console.log(p.toString()) //3
1. 类的继承
- 通过super关键字进行
class Child extends Point{
constructor(name){
// 可以继承并修改父类的实例属性 且一定要放在this之前，传参就会修改父类的属性
super()
this.name = name
}
}
2. 类的静态方法
- 通过static关键字定义 且只能在类上使用（不能在实例上使用）
class Point{
constructor(name){
// 可以继承并修改父类的实例属性 且一定要放在this之前
super()
this.name = name
}
// 静态方法
static tell(){
console.log(this.name)
}
}
3. 类的静态属性
- 静态属性跟定义静态方法不一样，没有关键字，但是也只能在类上使用
class Point(){
}
Point.type = 'class'
4. 类的getter和setter
- getter和setter其实是一个很难理解的概念，可以理解为就是对象中的get和set
class Point{
constructor(name){
this.name = name
}
// 这是一个属性 不是一个方法(不要理解错了)
get getName(){
return this.name
}
// 如果两个名字一样 调用的时候会自己判断用哪个属性
set getName(val){
this.name = val
}
}
let instance = new Point('桃子')
// 触发getter
console.log(instance.name)
// 触发setter
console.log(instance.name = '阿狸')
参考阮一峰大神的《ES6标准入门》，部分文字已做引用处理。
