为什么Javascript在浏览器控制台中显示(66)[空×65,{…}]?

时间:2019-01-18 06:59:45

标签: javascript

一些常见的问题是,即使内部有内容,为什么Array看起来还是零。我的问题现在有点怪异。为什么会看到

client = AgoraRTC.createClient({mode, codec});
client.on('stream-subscribed'

在chrome控制台中,即使数组内部至少包含1个数组值?

2 个答案:

答案 0 :(得分:2)

这就是当您拥有稀疏数组时看到的内容-定义了一些指标,但是有些指标低于定义的指标未定义(或曾经分配给它们) ,例如:

const arr = [];
arr[65] = 'foo';
console.log(arr);

(在浏览器控制台中查看这两个代码片段的结果,该代码片段控制台将不可见)

请注意,这与在前65个索引中具有文字undefined值不同,后者将显示为undefined而不是empty

const arr = new Array(65).fill(undefined);
arr[65] = 'foo';
console.log(arr);

但是,稀疏数组几乎从来都不是一个好主意-如果您看到了这一点,则表明您可能应该修复代码以避免稀疏数组。考虑另一种结构,也许是带有数字键的对象:

const obj = {
  '65': 'foo'
};

程序员将期望数组是元素的有序集合-集合在有序集合的顶部根本没有任何值(不仅是undefined,而且没有任何值)意味着什么值)?只是没有多大意义-尽管可能,但这种构造并不是数组的目的。

正如Kaiido所述,不会使用forEach之类的数组方法遍历空元素:

const arr = [];
arr[65] = 'foo';
arr.forEach((item, i) => {
  console.log(item, i);
});

这有点道理,但是它仍然不直观(您是否可以在不亲自尝试代码或不查看规范的情况下确定这一点?)。人们通常会期望forEach回调的第一次迭代的索引为0。

答案 1 :(得分:1)

只有65个空元素,可以像这样创建数组:

const arr = Array(65);
arr.push(1);
console.log(arr)

或在新数组中的某个索引上设置新元素;

const arr = [];
arr[65] = 1;