javascript - js 操作前打印数组 显示的是操作后的内容

问题描述

问 题

js里，对数组进行循环添加，每次都打印一次数组，发现打印出来的内容一直是最终结果的数组内容，就是循环结束后的数组。
代码如下
for(var k=0;k<deplist.length;k++){

            depArr.push({
                    dep:deplist[k],
                    wait:waits[k],
                    queue:queue[k]
                });
            console.log(depArr);
            
        }；

我后面还有数组排序操作，发现也是这样的。 大概查了下，好像是控制台打印读取内存的问题。
有哪位大神具体解释一下，要不然每次调试数组就很麻烦了

解决方案

var deplist = [1, 2, 3, 4, 5];
var waits = [11, 22, 33, 44, 55];
var queue = [111, 222, 333, 444, 555];
var depArr = [];
for(let k = 0, len = deplist.length; k < len; k++){
  depArr.push({
    dep: deplist[k],
    wait: waits[k],
    queue: queue[k]
  });
  console.log(depArr);
}

先代码展示你所说的问题，打印的第一个数据，原本只有1个object，点开后却有5个object，如图

你可以加个debugger看看原因

var deplist = [1, 2, 3, 4, 5];
var waits = [11, 22, 33, 44, 55];
var queue = [111, 222, 333, 444, 555];
var depArr = [];
for(let k = 0, len = deplist.length; k < len; k++){
  depArr.push({
    dep: deplist[k],
    wait: waits[k],
    queue: queue[k]
  });
  console.log(depArr);
  debugger; // 加这行你看看
}

步骤：

1. 运行代码，控制台结果，点开json
   
2. 下一步，点开json结果
   
3. 连续走两步，然后再点开json的结果
   

可以看出，打印一个数据，点开一个，里面是只有一个object的，但是如果你多调试几步之后才去点开第一个的话，展示的是最后一个的结果值，所以，应该可以猜测，打印时没有读取内存的数据，点开json查看内容时才去读内存里的数据，又因为每个打印的depArr都指向定义时的depArr，而此时depArr是最后那个值，所以看到的就是最后的值了。
你要看数据的话可以在打印的过程中重新指向另一个引用，这样就不会出现你说的问题了，例如：

var deplist = [1, 2, 3, 4, 5];
var waits = [11, 22, 33, 44, 55];
var queue = [111, 222, 333, 444, 555];
var depArr = [];
for(let k = 0, len = deplist.length; k < len; k++){
  depArr.push({
    dep: deplist[k],
    wait: waits[k],
    queue: queue[k]
  });
  let arr = [].concat(depArr);  
  console.log(arr);  // 打印的是新定义的arr，而这个arr的值是当前depArr，而不是最终的
}

你还可以打印成字符串看结果

console.log(JSON.stringify(depArr)); 

这时，每次读取的都是当前的。

这篇关于javascript - js 操作前打印数组 显示的是操作后的内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！