通过循环定义javascript原型函数

Defining javascript prototype functions through a loop

本文关键字:原型 函数 javascript 定义 循环      更新时间:2023-09-26

我尝试从数组中定义原型函数。就像下面的例子:我的黑兔子应该说‘toto’,但它没有说出来!为什么?

function Rabbit ( type ) {
    this.type = type ;
}
var funcs = ["says", "doesnt_say"];
for(var i=0;i<funcs.length;i++)
{
    var f = funcs[i];
    Rabbit.prototype[f] = function ( line ) {
        alert(" The " + this.type + " rabbit " 
              + f + "  '" + line + " '") ;
    };
}
var blackRabbit = new Rabbit ("black") ;
blackRabbit.says("toto");

可见于http://jsfiddle.net/xou11bgu/

问题是变量"f"是由您创建的所有函数共享的,并且它最终将具有最后一个函数名的值。

可以使用函数来构造以下函数:

Rabbit.prototype[f] = function(f) {
    return function ( line ) {
        alert(" The " + this.type + " rabbit " 
              + f + "  '" + line + " '") ;
    };
}(f);

这是一个非常常见的JavaScript绊脚石的实例;在Stackoverflow上还有很多很多类似的问题,但是很难找到,因为除非你知道问题是什么,否则很难知道你在寻找什么。

您在方法中使用变量f,但是该变量由所有方法共享,并且将包含最后一个方法的名称。

你可以使用一个函数来创建一个作用域,每个方法将获得自己的变量f:

for(var i=0;i<funcs.length;i++) {
  (function(f){
    Rabbit.prototype[f] = function ( line ) {
      alert("The " + this.type + " rabbit " + f + " '" + line + "'") ;
    };
  })(funcs[i]);
}

演示:http://jsfiddle.net/xou11bgu/4/