ES6 Learning - Class

基本语法

概述

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// ES5
function Point(x,y){
this.x = x;
this.y = y;
}

Point.prototype.toString = function () {
return '(' + this.x + ', ' + this.y + ')';
}

// ES6
class Point {
constructor(x, y) {
this.x = x;
this.y = y;
}

toString() {
return '(' + this.x + ', ' + this.y + ')';
}
}

注意,不用加function关键字,并且方法之间不需要加分号。

类的数据类型就是函数,类本身就指向构造函数。

1
2
typeof Point // "function"
Point === Point.prototype.constructor // true

类的实例上调用方法,其实就是调用原型上的方法。

1
2
var point = new Point();
point.constructor = Point.prototype.constructor; // true

类的内部定义的所有方法,都是不可枚举的。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
class Point {
constructor(x, y) {
// ...
}

toString() {
// ...
}
}

Object.keys(Point.prototype)
// []
Object.getOwnPropertyNames(Point.prototype)
// ["constructor","toString"]

constructor方法

通过new命令生成对象实例时,自动调用该方法。默认返回实例对象(this),但也可以指定返回其他对象。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
class FooTestString {
constructor() {
return 'Test String';
}
}

var fooTestString = new FooTestString();
fooTestString instanceof FooTestString; // true

class FooTestNewString {
constructor() {
return new String('Test String');
}
}

var fooTestNewString = new FooTestNewString();
fooTestNewString instanceof FooTestNewString; // false
fooTestNewString instanceof String; // true