学习笔记：ES6 class

Class基本语法

JavaScript语言的传统方法是通过构造函数，定义并生成新对象。

//定义一个构造函数
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);

 

新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。

上面的代码用ES6的“类”改写，如下：

// 定义类
class Point {
    constructor(x, y) { //构造方法，this代表实例对象
        this.x = x;
        this.y = y;
    }
    //类的方法（将被实例继承）
    toString() {
        return '(' + this.x + ', ' + this.y + ')'
    }
}

//生成一个新对象
var p = new Point(1, 2)

以上对类的方法的定义，都是在prototype属性上面。

等同于以下方式：

Point.prototype = {
    toString () {}
}

 

 

constructor方法

constructor方法是类的默认方法，通过new命令生成对象实例时，自动调用方法。一个类必须有constructor方法，如果没有显式定义，一个空的constructor方法会被默认添加

constructor方法默认返回实例对象（即this），完全可以指定返回另外一个对象。

class Foo {
    constructor () {
        return Object.create(null); //修改返回值
    }
}

new Foo() instanceof Foo
// false

 

类的构造函数，不适用new调用会报错。

 

如何生成类的实例对象？

var point = new Point(2, 3);

 

Class表达式

// Class表达式
const MyClass = class Me { // Me只在Class内部代码可用，指代当前类，可省略。
    getClassName () {
        return Me.name;
    }
}

 

私有方法

略

 

this的指向

类的方法内部如果含有this，它默认指向类的实例。

 

Class的继承

Class之间可以通过extends关键字来实现继承。

class ColorPoint extends Point {}

 

super关键字表示父类的构造函数，用来新建父类的this对象

ES6的继承机制是先创造父类的实例对象this(所以必须先调用super方法)，然后再用子类的构造函数修改this

constructor(...args) {
    super(...args);
}

 

太长了，后面都省略...

 

参考文章：http://jsrun.net/tutorial/SZKKp