javascript函数数组中的参数答案

【问题标题】：javascript functions arguments in an arrayjavascript函数数组中的参数
【发布时间】：2011-07-10 14:46:29
【问题描述】：

我想做的是这个

    $.each($(".canvas"), function(n) {
        var canvas = $(this)[0].getContext("2d");     
        canvas.drawImage(options[n]);
    });

其中 options 是一个参数数组，但不知道应该如何格式化该数组以使其工作

显然不是

['img, 0,  0, 70, 17, 21, 16, 70, 17', 'img, 0,  0, 80, 12, 21, 16, 70, 17']

这个也没有

[''+img+', 0,  0, 70, 17, 21, 16, 70, 17', ''+img+', 0,  0, 80, 12, 21, 16, 70, 17']

也不是这个

{0: [img, 0,  0, 70, 17, 21, 16, 70, 17]}

这也行不通

var options = [[img, 0,  0, 70, 17, 21, 16, 70, 17],
               [img, 0, 16, 70, 17, 21, 16, 70, 17],
               [img, 0, 32, 70, 17, 21, 16, 70, 17],
               [img, 0, 48, 70, 17, 21, 16, 70, 17]];

img.onload = function() {
    $.each($(".canvas"), function(n) {
        var canvas = $(this)[0].getContext("2d");     
        canvas.drawImage(options[n].join(', '));
    });
};

错误总是 Uncaught TypeError: Type error 或 Uncaught TypeError: Illegal invocation

【问题讨论】：

drawImage 接受多个参数，而不仅仅是一个字符串。 foo(a, b) 与 foo('a, b') 不同。只是因为字符串中有逗号并不能使其成为参数列表。

标签： javascript arrays function object

【解决方案1】：

使用Function.apply。

canvas.drawImage.apply(canvas, options[n]);

options[n] 看起来像

[img, 0, 0, 70, 17, 21, 16, 70, 17]

完整示例：

var options = [[img, 0,  0, 70, 17, 21, 16, 70, 17],
               [img, 0, 16, 70, 17, 21, 16, 70, 17],
               [img, 0, 32, 70, 17, 21, 16, 70, 17],
               [img, 0, 48, 70, 17, 21, 16, 70, 17]];

$(img).load(function()
{
    $(".canvas").each(function(n)
    {
        var canvas = this.getContext('2d');     
        canvas.drawImage.apply(canvas, options[n]);
    });
});

演示：http://jsfiddle.net/mattball/5EQbC/

【讨论】：

options 必须有正确的结构。 img 必须是一个 DOM 元素 afaik。
@foxx：你必须使用canvas.drawImage.apply(canvas, options[n]);（传递canvas作为第一个参数）。
可爱，之前确实尝试过 apply()，但是用这个而不是画布，愚蠢的我，谢谢