Javascript 类和变量引用

Question

我正在尝试解决这个令人困惑的 Javascript OOP 问题。

所以我有以下类(class):

var ClassA = function() {
    this.initialize();
}

ClassA.prototype = {

    methods : ['alpha','beta','gama'],

    initialize : function() {
        for ( var i in this.methods ) {
            this[this.methods[i]] = function() {
                console.log(this.methods[i]);
            }
        }
    }
}

var a = new ClassA();

当我调用每个方法时，我希望打印它的名称，对吗？但这是我得到的:

a.alpha(); // returns gama ?!?
a.beta();  // returns gama ?!?
a.gama();  // returns gama

但是当我的课看起来像这样时:

var ClassB = function() {
    this.initialize();
}

ClassB.prototype = {

    methods : ['alpha', 'beta', 'gama'],

    initialize: function() {
        for ( var i in this.methods ) {
            this.addMethod(this.methods[i]);
        }
    },

    addMethod: function(method) {
        this[method] = function() {
            console.log(method);
        }
    }

}

var b = new ClassB();

b.alpha(); // returns alpha
b.beta();  // returns beta
b.gama();  // returns gama

为什么会这样？

Answer 1

for ( var i in this.methods ) {
      this[this.methods[i]] = function() {
          console.log(this.methods[i]);
       }
}

你的问题就在这里。当这个循环结束时，i 是最后一个元素。每个函数使用相同的i，所以它们都是最后一个元素。

当您使用 addMethod 时，您正在关闭以“捕获”正确的值。

编辑:当您调用 addMethod 时，您正在“复制”该值，而不是使用 i 值，该值随每次循环迭代而变化。