ES6 class类的使用介绍

我们在ES5中经常使用方法或者对象去模拟类的使用，虽然可以实现功能，但是代码并不优雅，ES6为我们提供了类的使用。需要注意的是我们在写类的时候和ES5中的对象和构造函数要区分开来，不要学混了。

类的声明

先声明一个最简单的coder类，类里只有一个name方法，方法中打印出传递的参数。

class Coder{
    name(val){
        console.log(val);
    }
}
let angle = new Coder;
angle.name('天使');

类的多方法声明

class Coder{
    name(val){
        console.log(val);
        return val;
    }
    skill(val){
        console.log(this.name('天使')+':'+'Skill
        +val');
    }
}
let angle = new Coder;
angle.name('宝宝');
angle.skill('beautiful');

这里需要注意的是两个方法中间不要写逗号了，还有这里的* this 指类本身*，还有要注意return 的用法。

类的传参

在类的参数传递中我们用constructor( )进行传参。传递参数后可以直接使用this.xxx进行调用。

class Coder(
    name(val){
        console.log(val);
        return val;
    }
    skill(val){
        console.log(this.name('天使')+':'+'Skill
        +val');
    }

    constructor(a,b){
        this.a = a;
        this.b = b;
    }
    add(){
        return this.a+this.b;
    }
)
let angle = new Coder(1,2);
console.log(angle.add());

我们用constructor来约定了传递参数，然后用作了一个add方法，把参数相加。这和以前我们的传递方法有些不一样，所以需要小伙伴们多注意下。

class 的继承

类的一大特点就是继承。在这里我们简单的看看继承的用法。

class Coder{
    name(val){
        console.log(val);
    }
}

class htmler extend Coder{
}
let angle = new hemler;
angle.name('天使');

声明一个htmler的新类并继承Coder类，htmler新类里边为空，这时候我们实例化新类，并调用里边的name方法。结果也是可以调用到的。