Question

我们如何将es6类方法填充到ES5中？

我正在读一本书并说出以下内容：

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

    swingSword() {
        return true;
    }
}

与

相同

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

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

我只是想问为什么我们在原型上添加swingSword而不是在构造函数中添加？

因为函数应该在对象上，而不是在原型链上。

我是对还是错？

Answer 1

它应该在原型上，方法不是每个实例的数据。不能想到任何以这种方式实现它的语言，类的整个想法是拥有一组具有相同方法集的对象。

如果将它放在构造函数中，它将是构造函数的每个实例的唯一函数。例如，1000个对象== 1000个函数，每个＆＃34;方法＆＃34;。

Answer 2

仅将函数添加到对象只适用于Ninja。要创建扩展Ninja的类，例如Kunoichi，通常会复制Ninja原型。不幸的是，由于swingSword不在原型中，因此Kunoichi无法摆动剑。

您必须在原型中添加该函数以允许扩展该类。

Answer 3

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!

什么相当于es5中的ES6方法（类）？

3 个答案: