JavaScript 无法从函数的数组参数中获取值

JavaScript can't get value off function's array parameter

本文关键字：参数 获取 数组 函数 JavaScript      更新时间：2023-09-26

我正在尝试根据高度对列中的一些图像进行排序，我有以下代码。问题是，即使imgHeights.length工作正常，imgHeights[i]（在redrawThumbs函数中）也不会返回值。我做错了什么？谢谢=）

function redrawThumbs(imgHeights){
  // some irrelevant code here
  // initialise an array that will hold all the column's heights
  var colHeights = new Array(cols);
  for(a=0; a <= colHeights.length - 1; ++a){
    colHeights[a] = 0;
  }
  // take each image's height and add it to the shortest column
  for(i=0; i <= imgHeights.length - 1; ++i){
    var shortestCol = 0;
    for(c=0; c <= colHeights.length - 2; ++c){
      if(colHeights[c+1] < colHeights[c]){
        shortestCol = colHeights[c+1];
      }
    }
    alert("imgHeights[" + i + "] " + imgHeights[i]);
    colHeights[shortestCol] += imgHeights[i];
  }
}
// make an array of image heights
var imgHeights = new Array(totalThumbs);    
for(i=1; i <= totalThumbs; ++i){
  var img = new Image();
  img.onload = function(){
  imgHeights[i-1] = this.height;
}
img.src = i + ".jpg";
// call function that orders the images
redrawThumbs(imgHeights);
其中一个

问题是i变量是通过引用而不是按值捕获的，因此，对于img.onload的所有回调，都获得了相同的 i 值。请考虑将onload分配更改为，

var loadedCount = 0;
img.onload = (function (i) { 
    return function () { 
        imgHeights[i - 1] = this.height;
        if (++loadedCount == totalThumbs) allLoaded();
    };
})(i);
function allLoaded() {
    // called after all the images have been loaded.
}

这会在自动执行函数执行时捕获 i 值的副本，并在加载所有图像后调用allLoaded()。

相关文章：