问题可能是由 Firefox 的 console.log 解释输入对象的方式引起的。不知何故,它被评估为一个数组而不是一个简单的对象。 Chrome 做得对。如果您深入了解 Javascript 中如何管理数组,您会发现以下内容:
数组不能使用字符串作为元素索引(如在关联数组中),但必须使用整数。使用方括号表示法(或点表示法)通过非整数设置或访问不会从数组列表本身设置或检索元素,但会设置或访问与该数组的对象属性集合关联的变量。数组的对象属性和数组元素列表是分开的,数组的遍历和变异操作不能应用于这些命名属性。 src
对此更好的理解是修改 Array 的 length 属性。尤其是当您使用[] 构造了数组时。要将元素添加到数组中,我们必须使用.push(...)。此函数使用length 属性(检查15.4.4.7 Array.prototype.push)。所以简而言之(互动示例在底部)
const arr = []; // length = 0
arr.push('1stEl', '2ndEl', '3thEl'); // length = 3
// this isn't allowed, but you can do this
arr[7] = '7thEl'; // length = 8
您会看到长度现在是 8 而不是 4。索引3..6 是保留的,但未定义。下面是控制台输出。
[
"1stEl",
"2ndEl",
"3thEl",
undefined,
undefined,
undefined,
undefined,
"7thEl"
]
如果你再次使用.push 方法,它会将新元素放在'7thEl' 元素之后(以此类推,索引8)。
要检查此对象使用的键,我们可以在数组上使用Object.keys()。你会得到
[
"0",
"1",
"2",
"7"
]
您会看到数值被用作键。就像你的对象,这是
{
6: false,
10: true
}
在这个对象上使用Object.keys 会得到["6", "10"]。它具有与上述类似的输出。因此,来自 firefox 的 console.log 将您的对象解释为数组,从而将其显示为数组。为了正确显示数组,它从键0 开始(逻辑上看,还需要检查源代码)并在键array.length - 1 结束。但是索引0,1..5 和7..9 没有“定义”。因此它导致了这个输出
Object [ <6 empty slots>, false, <3 empty slots>, 1 more… ]
我不确定是否必须将此定义为 Firefox 控制台 API 的错误或故障...或者控制台输入(在初始化变量时)错误地读取了对象。
--- 实例--
const a = new Array(3);
console.log('using "new Array(...)" reserves memory space: ' + a.length);
console.log('---');
// using brackets
const b = [];
console.log('but what with [] ? At initial, we have ' + b.length);
b.push('1stEl', '2ndEl', '3thEl');
console.log('After push(\'1stEl\', \'2ndEl\', \'3thEl\'), we have ' + b.length);
// add to random index
b[7] = '7thEl';
console.log('After b[7] = \'7thEl\', we have ' + b.length);
console.log('displaying gives ', b);
console.log('using Object.keys: ', Object.keys(b));
// adding again
b.push('newEl');
console.log('After b.push(\'newEl\'), we have ' + b.length);
// object
const obj = {
6: false,
10: true
};
console.log('obj defined as {6: false, 10: true }');
console.log('using Object.keys: ', Object.keys(obj));
console.log('obj: ', obj);