js之数组,对象,类数组对象

时间:2021-05-23 16:33:53

许久不写了,实在是不知道写点什么,正好最近有个同事问了个问题,关于数组,对象和类数组的,仔细说起来都是基础,其实都没什么好讲的,不过看到还是有很多朋友有些迷糊,这里就简单对于定义以及一下相同点,不同点简单的说明一下!当然,这里我们只讨论数据结构的异同,并不讨论他们之间所拥有的方法等不同!

数组定义:简而言之就是一组有序的数据集合,其索引为从0开始且自然增长的整数,其元素值可以是任何js数据!并且包含一个名为length的属性,该属性表示数组元素的个数!

看着上面的定义,我们很容易就能大概知道数组是什么样的东西,下面我们来看个简单的例子:

var array = [1,2,3];
console.log(array[0])//1
​console.log(array[1])//2
​console.log(array[2])//3
​console.log(array['length'])//3

  


从上面的例子我们可以看到,在声明数组时,我们只是显式的声明了数组元素的值,并没有显式的给这些值定义索引和length属性,但是在数组定义好后我们发现就可以直接使用数组的索引值来操作数组的元素了,从这不难看出,数组元素的索引和length属性是在数组定义时根据数组元素语言自动就帮你定义好了!而且很容易就能看出来,索引值是从0开始并且自然递增的!

对象定义:js中对象类型为一组无序的由键->值组成的数据集合,其元素的键名和值都可以自定义!

我们来看一个例子:

var object = {'a': 1, 'b': 2}
console.log(object['a'])//1
console.log(object['b'])//2
console.log(object['length'])//undefined

  

从上面的例子简单来看,对象自身所拥有的(不包括继承来的)任何属性都是有用户自定义的!

数组与对象:

从上面的定义和例子上来看,不知道大家有没有发现,数组和对象在某些地方或时候其实是很相像的!

我们先看看他们相同的部分,首先我们可以把数组的索引值看成的元素的键名,元素看成是值,那么数组是不是也变成了键->值构成的了!

我们在来看看他们不一样的地方,数组的所以值始终的从0开始递增的数字,对象的属性值可以是任何自定义的字符串,并且数组包含一个length属性,而对象自身所拥有的(不包括继承来的)任何属性都是有用户自定义的!也就是说我们,我们可以给显式的给对象定义length属性!

var arr = [1,2,3];
var obj = {0: 1, 1: 2, 2: 3, length: 3};
console.log(arr[0], obj[0])//1, 1
console.log(arr['length'], obj['length'])//1, 1

  


通过对比,我们发现完全可以使用对象来模拟数组,只要我们定义的对象的每个元素的键名都使用数字并且让其保持递增,且动态的定义一个length属性来表示元素个数,那么从效果上来说,基本就个数组相同了!这就是我们要说的:

类数组对象:只包含使用从零开始,且自然递增的整数做键名,并且定义了length表示元素个数的对象,我们就认为他是类数组对象!

类数组对象不仅是效果上跟数组相似,并且在某些操作上也相同:

//定义数组和类数组对象
var arr = [1,2,3];
var obj = {0: 1, 1: 2, 2: 3, length: 3};
//元素读写操作
console.log(arr[0], obj[0])//1, 1
console.log(arr['length'], obj['length'])//1, 1
arr[0] = 9;
obj[0] = 9; //遍历
for(var i = 0, len = arr.length; i < len; i++) {
arr[i]....
}
for(var i = 0, len = obj.length; i < len; i++) {
obj[i]....
}

  


我们看到,不仅在读写等操作上类数组对象和数组相似,并且在遍历元素上都可以使用for循环进行遍历!

 
通过上面我们对于定义的介绍,以及简单的对比,我们不难看出,其实我们可以从数据结构上把js的数组归为对象,因为我们可以使用对象来模拟数组,当然这里仅仅说的是数据结构上,其实他们本身所继承来的方法和一些属性是不同的!在平常的理解中大家可以把数组看成是特殊的对象,以方便理解!