Javascript多维数组访问无法正常工作

时间:2014-04-03 16:06:37

标签: javascript multidimensional-array

我试图让客户端编辑JS源并以这种格式定义多维数组:

imageArray[0][0][0][0] = 'image000.jpg';
imageArray[0][0][0][1] = 'image0001.jpg';
...
imageArray[1][0][0][0] = 'image1000.jpg';
imageArray[1][0][0][1] = 'image1001.jpg';

我制作了一些动态矩阵,因此JS不会因非初始化数组而输出错误,现在客户端可以定义数组。

问题是当我尝试打印一些图像时,对于某些阵列(子阵列)存在问题。

如果您查看此附加文档:https://dl.dropboxusercontent.com/u/58889914/tmp/bt4-forum.html,您会看到它在alert()

中打印出错误的图片

你知道问题是什么吗?

提前多多感谢。

附件内容:

<script type="text/javascript">
/// CONFIG ////
function initArray(maxRows, maxCols)
{
    var imageArray = [];
    for( c= 0; c < maxRows; c++){
        imageArray.push(recurGenCol(1, maxRows, maxCols));
    }
    return imageArray;
}
function recurGenCol(col, maxRows, maxCols)
{
    if(col >= maxCols){
        return "";
    }
    var row_col = [];
    row_col = recurGenCol(col+1, maxRows, maxCols);
    var row_row = [];
    for(k = 0; k < maxRows; k++)
    {
        row_row.push(row_col);
    }
    return row_row;
}
// INIT:
var rows = 10;
var cols = 5;
var imageArray = initArray(rows, cols);

//console.log(imageArray);

// END CONFIG. Start definng array //

//var imageArray = imageArraya;



imageArray[0][0][0][0] = 'image_0_0_0_0.jpg';
imageArray[0][0][0][1] = 'image_0_0_0_1.jpg';
imageArray[0][0][0][2] = 'image_0_0_0_2.jpg';

//console.log( imageArray[0][0][0][1]);


imageArray[0][0][0][3] = 'image_0_0_0_3.jpg';
imageArray[0][0][0][4] = 'image_0_0_0_4.jpg';
imageArray[0][0][1][0] = 'image_0_0_1_0.jpg';
imageArray[0][0][1][1] = 'image_0_0_1_1.jpg';
imageArray[0][0][1][2] = 'image_0_0_1_2.jpg';
imageArray[0][0][1][3] = 'image_0_0_1_3.jpg';
imageArray[0][0][2][0] = 'image_0_0_2_0.jpg';
imageArray[0][0][2][1] = 'image_0_0_2_1.jpg';
imageArray[0][0][2][2] = 'image_0_0_2_2.jpg';
imageArray[0][0][3][3] = 'image_0_0_2_3.jpg';
imageArray[0][0][3][0] = 'image_0_0_3_0.jpg';
imageArray[0][0][3][1] = 'image_0_0_3_1.jpg';
imageArray[0][0][3][2] = 'image_0_0_3_2.jpg';
imageArray[0][0][3][3] = 'image_0_0_3_3.jpg';
imageArray[0][1][0][0] = 'image_0_1_0_0.jpg';
imageArray[0][2][0][0] = 'image_0_2_0_0.jpg';
imageArray[0][3][0][0] = 'image_0_3_0_0.jpg';
imageArray[0][3][0][1] = 'image_0_3_0_1.jpg';
imageArray[0][3][0][2] = 'image_0_3_0_2.jpg';
imageArray[0][3][0][3] = 'image_0_3_0_3.jpg';
imageArray[1][0][0][0] = 'image_1_0_0_0.jpg';
imageArray[1][0][0][1] = 'Image_1_0_0_1.jpg';
imageArray[1][0][0][2] = 'image_1_0_0_2.jpg';
imageArray[2][0][0][0] = 'image_2_0_0_0.jpg';
imageArray[2][0][0][1] = 'image_2_0_0_1.jpg';
imageArray[2][0][0][2] = 'image_2_0_0_2.jpg';
imageArray[2][0][0][3] = 'image_2_0_0_3.jpg';
imageArray[2][1][0][0] = 'image_2_1_0_0.jpg';
imageArray[2][1][0][1] = 'image_2_1_0_1.jpg';

//imageArray[6][1][0][1] = 'image_2_1_0_1.jpg';
var img =imageArray[0][0][1][0];

//console.log(log);

alert(img);





</script>

2 个答案:

答案 0 :(得分:1)

SOLUTION

这花了我一些时间......但我很享受每一秒!

function initArray(maxRows, maxCols){
  var c = -1, farray = [];
  var recursive = function(array){
    c++;
    for(var r = 0; r < maxRows; r++){ 
      if(c == maxCols) array[r] = '';
      else array[r] = recursive([]);
    }
    c--;
    return array;
  };
  return recursive(farray);
}

答案 1 :(得分:0)

我支持拉斐尔的解决方案。但是我想说明为什么原始代码没有按预期工作。

在许多编程语言中,您可以让内存中的多个位置指向同一位置。通常,这是使用命名变量完成的。所以这是一个简单的例子......

a = b = c = {hello: "there"};
// now a.hello would mean "there",
// so would b.hello and c.hello
c.hello = "bye";
// now, even a.hello would mean "bye";

但它不必像这样完成,数组索引实际上可以以相同的方式运行。

请注意我如何评论您的代码并添加新的控制台日志。你看到的是,在很多情况下,你将同一个对象推到多个地方。当你这样做时,在一个地方改变它的价值会在任何地方改变它,因为它们只是引用同一个东西。

function initArray () {
    // This is the first point any array ever actually exists...
    var funArray = [];
    console.log('Just created the funArray.');
    for (i= 0; i < 10; i++){
        // Does ten pushes to the funArray with whatever
        // recurGenCol returns...
        funArray.push(recurGenCol(1, 10, 5));
        console.log('Just pushed a single multi-level array to the funArray. None of these reference the same object.');
    }
    // Returns the funArray after those ten pushes...
    return funArray;
}
function recurGenCol(col, maxRows, maxCols){
    var i;
    // Here, col starts at 1 on the first iteration,
    // it then reaches 5 on the fifth iteration,
    // passing the if check, and the function returns
    // to initArray() with an empty string.
    console.log('About to check if col ('+col+') is greater than or equal to 5.');
    if (col >= 5){
    console.log('It was true! Returning to '+arguments.callee.caller.name+' with an empty string.');
        return "";
    }
    var row_col = [];
    //console.log('Just created row_col, brand new, from scratch.');
    row_col = recurGenCol(col+1, 10, 5);
    //console.log('Now row_col is equal to the what recurGenCol returns when it is called with ' + (col + 1) + ' as the first argument.');
    var row_row = [];
    for (i = 0; i < 10; i++) {
        // Does ten pushes to row_row with whatever row_col is...
        row_row.push(row_col);
    }
    // Returns back to initArray() with whatever row_row is...
    console.log('Going to return to '+arguments.callee.caller.name+' with row_row.');
    return row_row;
}
// INIT:

var imageArray = initArray();

//console.log(imageArray);

// First level is imageArray,
// Second level is row_row,
// Third level is row_col
imageArray[0][0][0][0] = 'image_0_0_0_0.jpg';
imageArray[0][0][0][1] = 'image_0_0_0_1.jpg';
imageArray[0][0][0][2] = 'image_0_0_0_2.jpg';

//console.log( imageArray[0][0][0][1]);


imageArray[0][0][0][3] = 'image_0_0_0_3.jpg';
imageArray[0][0][0][4] = 'image_0_0_0_4.jpg';
imageArray[0][0][1][0] = 'image_0_0_1_0.jpg';
var img = imageArray[0][0][1][0];
// We expect this to log 'image_0_0_1_0.jpg'
// and it does so
console.log("first: " + img);
imageArray[0][0][1][1] = 'image_0_0_1_1.jpg';
imageArray[0][0][1][2] = 'image_0_0_1_2.jpg';
imageArray[0][0][1][3] = 'image_0_0_1_3.jpg';
imageArray[0][0][2][0] = 'image_0_0_2_0.jpg';
imageArray[0][0][2][1] = 'image_0_0_2_1.jpg';
imageArray[0][0][2][2] = 'image_0_0_2_2.jpg';
imageArray[0][0][3][3] = 'image_0_0_2_3.jpg';
imageArray[0][0][3][0] = 'image_0_0_3_0.jpg';
imageArray[0][0][3][1] = 'image_0_0_3_1.jpg';
imageArray[0][0][3][2] = 'image_0_0_3_2.jpg';
imageArray[0][0][3][3] = 'image_0_0_3_3.jpg';
imageArray[0][1][0][0] = 'image_0_1_0_0.jpg';
imageArray[0][2][0][0] = 'image_0_2_0_0.jpg';
imageArray[0][3][0][0] = 'image_0_3_0_0.jpg';
imageArray[0][3][0][1] = 'image_0_3_0_1.jpg';
imageArray[0][3][0][2] = 'image_0_3_0_2.jpg';
imageArray[0][3][0][3] = 'image_0_3_0_3.jpg';
imageArray[1][0][0][0] = 'image_1_0_0_0.jpg';
imageArray[1][0][0][1] = 'Image_1_0_0_1.jpg';
imageArray[1][0][0][2] = 'image_1_0_0_2.jpg';
imageArray[2][0][0][0] = 'image_2_0_0_0.jpg';
imageArray[2][0][0][1] = 'image_2_0_0_1.jpg';
imageArray[2][0][0][2] = 'image_2_0_0_2.jpg';
imageArray[2][0][0][3] = 'image_2_0_0_3.jpg';
imageArray[2][1][0][0] = 'image_2_1_0_0.jpg';
imageArray[2][1][0][1] = 'image_2_1_0_1.jpg';

//imageArray[6][1][0][1] = 'image_2_1_0_1.jpg';
img = imageArray[0][0][1][0];
// We expect this to log 'mage_0_0_1_0.jpg' but it DOESN'T!!!.
console.log("second: " + img);


// Rules that are true:
// - At 1st level, no items are the same object
// - At 2nd and 3rd level, all items within each parent array are the same object
// - At the last level, same-index values are the same object, except if the first level array is different

console.log('Is imageArray[0][0][0][1] the same object as imageArray[0][0][0][2]?');
console.log(imageArray[0][0][0][1] === imageArray[0][0][0][2]);

console.log('Is imageArray[0][0][0][1] the same object as imageArray[0][0][1][1]?');
console.log(imageArray[0][0][0][1] === imageArray[0][0][1][1]);

console.log('Is imageArray[0][0][0][1] the same object as imageArray[0][0][1][2]?');
console.log(imageArray[0][0][0][1] === imageArray[0][0][1][2]);

console.log('Is imageArray[0][0][0][2] the same object as imageArray[0][0][1][2]?');
console.log(imageArray[0][0][0][2] === imageArray[0][0][1][2]);

console.log('Is imageArray[0][0][0][1] the same object as imageArray[0][1][0][1]?');
console.log(imageArray[0][0][0][1] === imageArray[0][1][0][1]);

console.log('Is imageArray[0][0][0][1] the same object as imageArray[1][0][0][1]?');
console.log(imageArray[0][0][0][1] === imageArray[1][0][0][1]);

console.log('Is imageArray[0][0][1] the same object as imageArray[0][0][2]?');
console.log(imageArray[0][0][1] === imageArray[0][0][2]);

console.log('Is imageArray[0][1] the same object as imageArray[0][2]?');
console.log(imageArray[0][1] === imageArray[0][2]);