将数组作为参数传递给 SetTimeout 回调
我已经尝试了两天将数组传递到 setTimeout 回调中。
我在网上搜索过,我读过大约 10 个不同的 StackOverflow 问题及其所有答案。我肯定错过了什么,因为在尝试了所有这些不同的方法后,它仍然不起作用。这是我现在的情况:
function testing(pixels){
return function(){
for(i=0; i<pixels.length;i++){
a = pixels[i][0];
b = pixels[i][1];
c = pixels[i][2];
d = pixels[i][3];
box = pixels[i][5];
done = pixels[i][6];
color_to_draw = done ? box.color:active_color;
ctx.fillRect(a,b,c,d);
ctx2.clearRect(box.x-1,box.y-1,box.w,box.h);
draw_colored_box(box.x, box.y, box.w, box.h, color_to_draw, box.alpha, true, ctx2);
}
};
}
function ias(pixel_batch){
var color_to_draw;
ctx.fillStyle = "#000000";
var a, b, c, d, e, box, done, i;
setTimeout(testing(pixel_batch),pixel_batch[0][4]);
}
我已经从所有不同的解决方案中得出我的方法 应该 有效。我显然做错了什么,因为它不起作用。
问题是,在函数
ias()
中,
pixel_batch.length
等于 3,或者无论将多少项放入该数组,即使在函数
testing()
中,
pixels.length
也是正确的值,但在函数内部,由 testing 返回的 pixels.length` 等于 0...
最初,这是我尝试过的:
function ias(pixel_batch){
var color_to_draw;
ctx.fillStyle = "#000000";
var a, b, c, d, e, box, done, i;
setTimeout((function(pixels){
console.log(pixels.length);
return function(){
for(i=0; i<pixels.length;i++){
a = pixels[i][0];
b = pixels[i][1];
c = pixels[i][2];
d = pixels[i][3];
box = pixels[i][5];
done = pixels[i][6];
color_to_draw = done ? box.color:active_color;
ctx.fillRect(a,b,c,d);
ctx2.clearRect(box.x-1,box.y-1,box.w,box.h);
draw_colored_box(box.x, box.y, box.w, box.h, color_to_draw, box.alpha, true, ctx2);
}
};
})(pixel_batch),pixel_batch[0][4]);
}
我认为它不需要通过外部定义的函数来完成,但此时我已经开始尝试任何事情/一切。
如何将 pixel_batch(传递给
ias()
的参数)放入 setTimeout 的回调中?
[编辑/更新]
以下是实际调用的代码
ias()
:
function redraw_boxes(){
//This loop simply draws the active boxes again, on top of the previous set.
//At this point in time there is no need to clear the canvas at all.
var i; var i2; var box;
var temp_pixelation_array = pixelation_array.slice(0);
var x_mod; var y_mod;
var random_array_key;
var max_runs;
var the_pixel_batch = [];
var num_pixels_per_batch = 3;
var speed_to_pixelate = 3;
var done;
var temptimer=0;
var timers = [];
for(i=0;i<newly_acquired_boxes.length;i++){
temptimer=0;
temp_pixelation_array = pixelation_array.slice(0);
max_runs = temp_pixelation_array.length;
box = boxes[newly_acquired_boxes[i].column][newly_acquired_boxes[i].row];
for(i2 = 0; i2<max_runs;i2++){
random_array_key = ~~((Math.random()*temp_pixelation_array.length));
x_mod = temp_pixelation_array[random_array_key][0];
y_mod = temp_pixelation_array[random_array_key][1];
temp_pixelation_array.splice(random_array_key,1);
done = i2<max_runs-1 ? true:true ;
the_pixel_batch.push([box.x+x_mod, box.y+y_mod, particle_size, particle_size,temptimer,box,done]);
if(the_pixel_batch.length>= num_pixels_per_batch){
ias(the_pixel_batch);
the_pixel_batch.length = 0;
temptimer += num_pixels_per_batch*speed_to_pixelate;
}
}
}
newly_acquired_boxes.length=0;
}
[2 编辑/更新 2]
我希望我能接受你们所有的答案,因为从技术上讲你们都是对的。这是我的错,因为我一开始没有给你们正确的信息。我给所有人投了赞成票,因为你们都应该得到答案,只是你们无法用提供的信息给我答案。
您的问题就在这里:
ias(the_pixel_batch);
the_pixel_batch.length = 0;
您在
setTimeout
运行之前清除了数组。
您应该这样做:
pixel_batch.length = 0;
...在
setTimeout
回调中。
function ias(pixel_batch) {
ctx.fillStyle = "#000000";
setTimeout(function () {
var color_to_draw, a, b, c, d, e, box, done, i;
for (i = 0; i < pixels.length; i++) {
a = pixels[i][0];
b = pixels[i][1];
c = pixels[i][2];
d = pixels[i][3];
box = pixels[i][5];
done = pixels[i][6];
color_to_draw = done ? box.color : active_color;
ctx.fillRect(a, b, c, d);
ctx2.clearRect(box.x - 1, box.y - 1, box.w, box.h);
draw_colored_box(box.x, box.y, box.w, box.h, color_to_draw, box.alpha, true, ctx2);
}
pixel_batch.length = 0; // <<--- RIGHT HERE
}, pixel_batch[0][4]);
}
这里有一篇很好的文章解释了如何做到这一点: https://gullan.org.uk/passing-parameters-function-settimeout
这是结论:
setTimeout(function(){myFunction(parameter)}, myTimeout);
扩展 David 的回答:我认为您可能想要的是这样的:
function draw () {
for(i=0; i<pixels.length;i++){
a = pixels[i][0];
b = pixels[i][1];
c = pixels[i][2];
d = pixels[i][3];
box = pixels[i][5];
done = pixels[i][6];
color_to_draw = done ? box.color:active_color;
ctx.fillRect(a,b,c,d);
ctx2.clearRect(box.x-1,box.y-1,box.w,box.h);
draw_colored_box(box.x, box.y, box.w, box.h, color_to_draw, box.alpha, true, ctx2);
}
}
function ias(pixel_batch){
var color_to_draw;
ctx.fillStyle = "#000000";
var a, b, c, d, e, box, done, i;
setTimeout(function () {draw(pixel_batch)},pixel_batch[0][4]);
}
不需要返回函数的函数,您只需使用闭包直接调用该函数即可。