有人能告诉我如何用循环替换下面的javascript代码吗?

时间:2014-07-01 19:13:16

标签: javascript function loops variables binding

dataBase[0].valueline = d3.svg.line()
.x(function(d) { return x(d["Date"]); })
.y(function(d) { return y(d[dataBase[0].columnline]); });

dataBase[1].valueline = d3.svg.line()
.x(function(d) { return x(d["Date"]); })
.y(function(d) { return y(d[dataBase[1].columnline]); });

dataBase[2].valueline = d3.svg.line()
.x(function(d) { return x(d["Date"]); })
.y(function(d) { return y(d[dataBase[2].columnline]); });

dataBase[3].valueline = d3.svg.line()
.x(function(d) { return x(d["Date"]); })
.y(function(d) { return y(d[dataBase[3].columnline]); });

dataBase[4].valueline = d3.svg.line()
.x(function(d) { return x(d["Date"]); })
.y(function(d) { return y(d[dataBase[4].columnline]); });

dataBase[5].valueline = d3.svg.line()
.x(function(d) { return x(d["Date"]); })
.y(function(d) { return y(d[dataBase[5].columnline]); });

dataBase[6].valueline = d3.svg.line()
.x(function(d) { return x(d["Date"]); })
.y(function(d) { return y(d[dataBase[6].columnline]); });

dataBase[7].valueline = d3.svg.line()
.x(function(d) { return x(d["Date"]); })
.y(function(d) { return y(d[dataBase[7].columnline]); });

我试过这句话:

for (var i = 0; i < dataBase.length; i++) {

dataBase[i].valueline = d3.svg.line()
    .x(function(d) { return x(d["Date"]); })
    .y(function(d) { return y(d[dataBase[i].columnline]); });

}

但这不起作用,因为我在

function(d) { 
  return y(d[dataBase[i].columnline]); 
} 

与循环中的i不同。我也尝试过stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example

中的绑定技术
function createfunc(count) {
    return function(d) {
        return y(d[dataBase[count].columnline]);
    };
}
for (var i = 0; i < dataBase.length; i++) {

dataBase[i].valueline = d3.svg.line()
    .x(function(d) { return x(d["Date"]); })
    .y(createfunc(i));
}

但这也导致了错误。有人能告诉我如何将八行代码转换成循环吗?

1 个答案:

答案 0 :(得分:0)

作为上述评论者,这几乎肯定是一个范围问题,但如果没有看到周围的代码,很难确切地说出什么样的范围问题。如果您在JavaScript中遇到范围问题,一个通常好的想法是尽可能多地包装在独立函数中,因为它们各自都有自己的范围,并且可以在某种程度上充当闭包。也许尝试类似的事情:

function xFunc(d) {
    return function (d) { return x(d["Date"]) };
}

function yFunc(d, i) {
    return function (d) { return y(d[dataBase[i].columnline]) };
}

for (var i = 0; i < dataBase.length; i++) {

    dataBase[i].valueline = d3.svg.line()
        .x(xFunc(d))
        .y(yFunc(d, i));

}

我不知道这是否真的有效,即使它确实存在,也许是构建该闭包的更好方法。如果您不熟悉立即调用的函数表达式,请查看this post,并考虑找到一种方法将它们用于您的代码。它们非常适合防止JavaScript中的范围问题。

相关问题