什么是 es5 中的 ES6 方法（类）的等价物？

Question

How would we polyfill es6 class methods into ES5?

I am reading a book and it says the following:

class Ninja {
    constructor(name) {
        this.name = name;
    }

    swingSword() {
        return true;
    }
}

is the same as

function Ninja(name) {
    this.name = name;
} 

Ninja.prototype.swingSword = function() {
    return true;
};

I am just asking why are we adding the swingSword on the prototype and not inside the constructor function?

Because the function should be on the object and not on the prototype chain.

Am i right or wrong?

Answer 1

It should be on the prototype, methods are not per-instance data. Can't think of any language that implements it that way, the whole idea of classes is to have a whole class of objects that have the same set of methods.

If it was put it inside the constructor function, it would be a unique function per instance made with the constructor. eg, 1000 objects == 1000 functions, per "method".

Answer 2

Adding the function to just the object would only work for a Ninja . To create a class that extends Ninja , for example Kunoichi , you would normally copy the Ninja prototype. Unfortunately, because swingSword is not in the prototype, your Kunoichi cannot swing swords.

You must add the function in prototype to allow the class to be extended.

Answer 3

If we add a method to the prototype, only one instance of that method exists in memory, and it's shared between all objects created from the constructor.

If we add the swingSword method directly to the Ninja constructor function, then every object would have its own copy of that method, taking up more memory.

Answer 4

---

var $class = function ($superclass, config) {
    // All classes have a superclass with the root 
    // of this $class hierarchy being Object.
    var self = function (config) {
        // Object.assign or $.extend or ...
        config && Object.assign(this, config);
    };
    self.prototype = new $superclass(config);
    return self;
};

var A = $class(Object, {
    sayWhat: "Hello, I'm an A",
    say: function () {
        console.log(this.sayWhat);
    }
});

var B = $class(A, {
    sayWhat: "Hello, I'm a B"
});

var C = $class(B, {
    say: function () {
        console.log("C SAYS: " + this.sayWhat);
    },
    superSay: function () {
        // how to call a superclass method
        B.prototype.say.call(this);
    }
});

var a = new A();
a.say();  // Hello, I'm an A

var b = new B();
b.say();  // Hello, I'm a B

var c = new C();
c.say();  // C SAYS: Hello, I'm a B

// create a "one-off" object
var d = new C({
    sayWhat: "I'm special!",
    say: function () {
        console.log("hey!");
    }
});
d.say();  // hey!
d.superSay();  // I'm special!
C.prototype.say.call(d);  // C SAYS: I'm special!

---