ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

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

2021-08-04 14:29:37  阅读:191  来源: 互联网

标签:__ arr console log 区别 js length 数组 4294967295


以现代浏览器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

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有