likes
comments
collection
share

class X {} 的 ES5 解释

作者站长头像
站长
· 阅读数 16

class X {} 是 ES6 引入的一个新语法，可以看做是构造函数的语法糖。

那是如何实现的呢？

将代码 转译成 ES5 后，得：

function _classCallCheck(instance, Constructor) {
    if (!(instance instanceof Constructor)) {
        throw new TypeError("Cannot call a class as a function");
    }
}
var X = function X() {
    "use strict";
    _classCallCheck(this, X);
};

我们来分析其实现。

  • 首先，class 中的代码都是在严格模式下（"use strict"）执行的；
  • 其次，class X {} 只允许以 new X() 方式使用，不允许以普通函数调用方式使用
    • 是否通过 new 方式使用，是在函数体中通过 this instanceof X 来判断的，编译器将其封装成了 _classCallCheck() 函数
    • 检查没通过的情况下，会抛出 TypeError。

所以，class X {} 可以看做是构造函数的语法糖。与构造函数不同的是：

  1. class 代码是在严格模式下执行的；
  2. class 限制只能以 new 方式调用，否则报错。