脚本宝典收集整理的这篇文章主要介绍了ES6学习笔记之Classes，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

本文同步自我得博客：http://www.joeray61.com

简介

ES6的Classes是在原型链继承的基础上，由语言本身提供的语法糖，并非是一种全新的继承模式。这使得Javascript有一种更加简洁清晰的方式来实现类的创建和继承。

语法

话不多说，直接上代码。

定义Class

class PErson {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
}
@H_360_40@
继承Class

      

      
      
      
      
class Student extends Person {
    constructor(name, age, grade) {
        super(name, age);
        this.grade = grade;
    }
}

原型链方法

      

      
      
      
      
class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    
    speak() {
        console.LOG('something...');
    }
}

speak就是原型链方法，不需要再繁琐地使用prototype来定义，直接定义在class内部即可。
静态方法

      

      
      
      
      
class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    
    static getclassname() {
        return 'Person';
    }
}
console.log(Person.getClassName());    // Person

静态方法直接用类名来调用就可以了，熟悉面向对象编程的同学应该都不陌生。
Species
某些情况下，类里面有一个方法返回的是类的实例，但是你可能希望返回父类的示例，这时候可以使用species pattern来达到目的。
举个栗子，你实现了一个类叫做MyArray，继承自Array，如果你不使用species pattern，那么调用map方法将会返回MyArray的实例，如果使用了species pattern则能够返回Array的实例。

      

      
      ITle="" data-original-title="复制">
      
      
class MyArray extends Array {
    static get [Symbol.species]() {
        return Array;
    }
}

VAR a = new MyArray(1,2,3);
var mapped = a.map(x => x * x);

console.log(mapped instanceof MyArray); // false
console.log(mapped instanceof Array);   // true

Mixin
mixin是类的模板。在ecmascript中，一个类不能继承多个类。这样有些需求就不是很方便。为了解决这个问题，可以使用Mixin。

      

      
      ub {
    bar() {}
};

var Baz = Sub => class extends Sub {
    baz() {}
};

class Person {
    speak() {}
}

class Student extends Bar(Baz(Person)) {}
" title="" data-original-title="复制">
      
      
var Bar = Sub => class extends Sub {
    bar() {}
};

var Baz = Sub => class extends Sub {
    baz() {}
};

class Person {
    speak() {}
}

class Student extends Bar(Baz(Person)) {}

这样，Student就可以继承Bar、Baz和Person3个基类了。
特点
提升
以前使用function来定义类的时候，我们可以在定以前先使用new，由于JS语言的变量提升特性，这样写不会有任何问题，示例如下：

      

      
      
      
      
var joe = new Person('joe', 23);
function Person(name, age) {
    this.name = name;
    this.age = age;
}

如果使用class来定义类，则必须在定义后才能使用new来进行对象的实例化，如果先new则会报错

      

      
      
      
      
var joe = new Person('joe', 23);    // ReferenceError
class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
}

严格模式（strict mode）
类声明和类表达式都是在严格模式下执行的。
类表达式
跟function一样，class也可以使用表达式来定义。类表达式可以命名也可以匿名。当类表达式有命名时，该命名仅作为类内部使用。

      

      
      
      
      
var Person = class Man {
    getName() {
        return Man.name;
    }
};
var p = new Person();
console.log(p.getName());    // Man
console.log(Man);    // ReferenceError: Man is not defined

参考资料

Classes
http://exploringjs.com/es6/ch_classes.html
脚本宝典总结
       
以上是脚本宝典为你收集整理的ES6学习笔记之Classes全部内容，希望文章能够帮你解决ES6学习笔记之Classes所遇到的问题。
		
如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。
		
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。