js 数组和对象的关系以及区别

以现代浏览器chrome运行一下代码

var arr=[]; //定义了一个空数组
console.log(typeof(arr)) //输出object
console.log(arr.length) //输出0
var obj={}; //定义一个空对象

以上arr数组在console里展开可以得到以下内容

length: 0 //唯一可以读写的,表示的是刚才定义的空数组内的length对象
[[Prototype]]: Array(0)  //以下是Array原型内的对象
	at: ƒ at()
	concat: ƒ concat()
	constructor: ƒ Array()
	copyWithin: ƒ copyWithin()
	entries: ƒ entries()
	every: ƒ every()
	fill: ƒ fill()
	filter: ƒ filter()
	find: ƒ find()
	findIndex: ƒ findIndex()
	flat: ƒ flat()
	flatMap: ƒ flatMap()
	forEach: ƒ forEach()
	includes: ƒ includes()
	indexOf: ƒ indexOf()
	join: ƒ join()
	keys: ƒ keys()
	lastIndexOf: ƒ lastIndexOf()
	length: 0
	map: ƒ map()
	pop: ƒ pop()
	push: ƒ push()
	reduce: ƒ reduce()
	reduceRight: ƒ reduceRight()
	reverse: ƒ reverse()
	shift: ƒ shift()
	slice: ƒ slice()
	some: ƒ some()
	sort: ƒ sort()
	splice: ƒ splice()
	toLocaleString: ƒ toLocaleString()
	toString: ƒ toString()
	unshift: ƒ unshift()
	values: ƒ values()
	Symbol(Symbol.iterator): ƒ values()
	Symbol(Symbol.unscopables): {copyWithin: true, entries: true, fill: true, find: true, findIndex: true, …}
	[[Prototype]]: Object
		constructor: ƒ Object()
		hasOwnProperty: ƒ hasOwnProperty()
		isPrototypeOf: ƒ isPrototypeOf()
		propertyIsEnumerable: ƒ propertyIsEnumerable()
		toLocaleString: ƒ toLocaleString()
		toString: ƒ toString()
		valueOf: ƒ valueOf()
		__defineGetter__: ƒ __defineGetter__()
		__defineSetter__: ƒ __defineSetter__()
		__lookupGetter__: ƒ __lookupGetter__()
		__lookupSetter__: ƒ __lookupSetter__()
		get __proto__: ƒ __proto__()
		set __proto__: ƒ __proto__()
​

只有length属性是可写的,其他的属性都在Array的原型中,而Array的原型就是object对象原型
也就是说,数组arr也是对象,当然也可以使用object[key]=value的方式赋值

//接上述代码
arr["a"]=1;
console.log(arr) //会输出[a:1]
console.log(arr.length) //输出0

arr的length属性除了通过代码arr.length=10来直接改变外,还可以通过arr[最大数字下标]改变arr.length

arr[10]=1;
arr[3]=3;
console.log(arr.length) //11,下标从0开始
arr["11"]=1
console.log(arr.length) //12,下标从0开始,字符会尝试变成数字下标,从而改变length属性
arr['aaa']=1
console.log(arr) //数组作为对象添加了一个key

arr的length属性有范围,最小0,最大是 2的32次方-1=4294967295,也就是uint32
也就是说,通过arr[下标]的方式改变length,下标最大只能是2的32次方-2=4294967294

arr=[]; //恢复
arr[4294967294]=1;
console.log(arr.length) //4294967295
arr[4294967295]=1; //这种方式不会报错,因为使用了object的增加属性的方法,增加的是一个key是4294967295值为1的属性
console.log(arr.length) //4294967295
console.log(arr) 
/*
4294967294: 1 //这个是arr作为数组的下标为4294967294的值1
4294967295: 1 //这个是arr作为对象的属性4294967295的值1
length: 4294967295 //length还是4294967295 
*/
arr.push(1) //报错,length违法,这是数组的方法,和arr[4294967295]=1;不同,这会新增一个数组元素导致length不合法报错

总结一下
数组是特殊的对象,继承了对象原型的所有方法,但是多了作为数组原型的方法例如push,pop,shift(不通浏览器可能不完全一致)
2的32次方-1这个值很重要,在js中的正整数范围就是0到2的32次方-1,包括了对象属性的数量上限,因为对象也有length属性上限也是2的32次方-1

标签：__,arr,console,log,区别,js,length,数组,4294967295
来源： https://blog.csdn.net/JokerSoulClub/article/details/119382201