以松散模式将ES6编译为ES5构造函数

Question

In the Exploring ES6 book, I was reading about how constructors are compiled to ES5 in loose mode. One example is this:

class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
    toString() {
        return `(${this.x}, ${this.y})`;
    }
}

Is compiled into this:

"use strict";

function _classCallCheck(instance, Constructor) {
  if(!(instance instanceof Constructor)) {
    throw new TypeError("Cannot call a class as a function");
  }
}

var Point = (function () {
    function Point(x, y) {
        _classCallCheck(this, Point);

        this.x = x;
        this.y = y;
    }

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

    return Point;
})();

I don't understand this line:

_classCallCheck(this, Point);

So what does Point actually mean here? Does it refer to the function Point ? In which case, of course this is an instance of Point because it also refers to function Point , so _classCallCheck will always return true .

Answer 1

So what does Point actually mean here? Does it refer to the function Point?

Yes

---

What _classCallCheck is doing is checking to see if a new instance of the class Point was created. It prevents someone from doing the following:

var test = Point(); // THROWS ERROR

In the previous snippet example, _classCallCheck(this, Point) , this will be whatever the outer scope of this code is (probably window).

---

It forces you to instantiate a new instance:

var test = new Point(); // VALID

Answer 2

So what does Point actually mean here?

It is the Point function, which is stored in var Point .

In which case, of course this is an instance of Pointbecause it also refers to function Point, so _classCallCheck will always return true.

Not so. It's easy to call Point in such a way that this is not an instance of Point . ES6 classes, by their nature, prevent calling class names in this way, but ES5 does not, so the _classCallCheck is there to ensure ES6 behavior is preserved. Observe:

 "use strict"; function _classCallCheck(instance, Constructor) { if(!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } var Point = (function () { function Point(x, y) { _classCallCheck(this, Point); this.x = x; this.y = y; } Point.prototype.toString = function toString() { // (A) return "(" + this.x + ", " + this.y + ")"; }; return Point; })(); // Invalid call prevented by _classCallCheck Point(1, 2);