Javascript 数组看起来是空的但有一个值

Javascript Array looks like its empty but has a value

我是javascript的新手,开始学习对象和数组我只想知道为什么我的数组看起来是空的,但是当你点击它时它有值?请参阅下面的代码,我正在使用 nedbFramework7.

var DeviceArray = new Array();

db.find({}, function (err, docs) {

     docs.forEach(function(element) {

        $$("#listDevice").append('<li><a href="single/'+element._id+'">'+element.device+'</a></li>');

        DeviceArray.push(element);  

     });

});

现在将 DeviceArray 放入对象中。

    user: [{
        firstName: 'Jhon',
        lastName: 'Doe',
      }],


      products: [
        {
          id: '1',
          title: 'Apple iPhone 8'
        },
        {
          id: '2',
          title: 'Apple iPhone 8 Plus'
        },
        {
          id: '3',
          title: 'Apple iPhone X'

        },
      ],

      devices: DeviceArray

然后当我尝试检查这个出现的对象时。

设备看起来是空的,但当您单击它时会出现。

我认为这没问题,但是当我尝试迭代设备阵列时它 returns 什么都没有,所以我的问题是如何更正此问题?我已经检查了 docs 输出,见下图,任何建议都很好。

我已经在 jsfiddle 中重新创建了您的场景。

https://jsfiddle.net/1j4gu2f1/

有两个控制台,带和不带 setTimeout,它们在折叠状态下会给出不同的表示,但在展开状态下会给出相同的结果。

我认为代码是不言自明的。

var devices = [];

setTimeout(function(){ //data loaded after 1000 ms
 devices.push({"name":"hello"});
 devices.push({"name":"world"})
},1000);

console.log(devices); // will show empty devices

setTimeout(function(){
    console.log(devices); // will show devices array
},1000)