本文共 2638 字，大约阅读时间需要 8 分钟。

基本写法

es6 只是一个语法糖，底层还是原型链。例如：

// 构造函数写法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);

// es6 类的写法class Point {     constructor(x, y) {       this.x = x;    this.y = y;  }  toString() {       return '(' + this.x + ', ' + this.y + ')';  }}var p = new Point(1, 2);

这两种写法是等效的

一些说明

// 类的所有方法都定义在类的prototype属性上面，比如：Point.prototype = {     constructor() {   },  toString() {   }};

// 在类的实例上面调用方法，其实就是调用原型上的方法class B {   }let b = new B();b.constructor === B.prototype.constructor // true

constructor 方法

类的默认方法，通过new命令生成对象实例时，自动调用该方法。如果没有显式的定义则会自动添加

取值函数（getter）和存值函数（setter）

与 ES5 一样，在“类”的内部可以使用get和set关键字，对某个属性设置存值函数和取值函数，拦截该属性的存取行为。

class MyClass {     constructor() {       // ...  }  get prop() {       return 'getter';  }  set prop(value) {       console.log('setter: '+value);  }}let inst = new MyClass();inst.prop = 123;// setter: 123inst.prop// 'getter'

类的属性名，可以采用表达式

let methodName = 'getArea';class Square {     constructor(length) {       // ...  }  [methodName]() {       // ...  }}

Class 表达式

const MyClass = class Me {     getClassName() {       return Me.name;  }};let inst = new MyClass();inst.getClassName() // Me

如果在函数内部没用到则可以简写

const MyClass = class {     getClassName() {       return 1;  }};let inst = new MyClass();inst.getClassName() // 1

采用 Class 表达式，可以写出立即执行的 Class。

let person = new class {     constructor(name) {       this.name = name;  }  sayName() {       console.log(this.name);  }}('张三');person.sayName(); // "张三"

static关键字

表示该方法不会被实例继承，而是直接通过类来调用，这就称为“静态方法”。

class Foo {     static classMethod() {       return 'hello';  }}Foo.classMethod() // 'hello'var foo = new Foo();foo.classMethod()// TypeError: foo.classMethod is not a function

实例属性的新写法

实例属性既可以写在 constructor 里，也可以直接写在顶层

class IncreasingCounter {     constructor() {       this._count = 0;  }}class IncreasingCounter {     _count = 0;}

静态属性static

静态属性指的是 Class 本身的属性，即Class.propName，而不是定义在实例对象（this）上的属性。

class MyClass {     static myStaticProp = 42;  constructor() {       console.log(MyClass.myStaticProp); // 42  }}

私有方法和私有属性

之前解决方案：
1、命名用下划线_

class Widget {     // 公有方法  foo (baz) {       this._bar(baz);  }  // 私有方法  _bar(baz) {       return this.snaf = baz;  }  // ...}

2、提案中

class IncreasingCounter {     // 私有属性  #count = 0;  get value() {       console.log('Getting the current value!');    return this.#count;  }  // 私有方法  #increment() {       this.#count++;  }}

注：typescript 对 class 有一些优化，我们在 typescript 中可以使用 private

之所以要引入一个新的前缀#表示私有属性，而没有采用private关键字，是因为 JavaScript 是一门动态语言，没有类型声明，使用独立的符号似乎是唯一的比较方便可靠的方法，能够准确地区分一种属性是否为私有属性。