浅谈ECMAScript 中的Array类型

Array 类型是除了 Object 类型之外又是一个特别经常用的一个类型了,当然数组在其他的语言中都是不可缺少的属性,我们都知道不管 js 还是其他类的语言的数组都是数据的有序列表,但是在 javaScript 中的数组是有一定的区别的,具体的区别就是: js 中的数组保存的数据可以是任何类型的数据,比如,我可以在第一个位置来保存数字,第二个位置保存字符串,第三和第四保存一个对象都完全OK,同时我还可以非常方便的操作数组的大小,添加新数据长度也会自动增长,动态调整什么的都是没有任何问题滴!而 c 或者其他的语言的数组和 js 的数组一对比就完全看出区别了,至于什么是数组,怎么创建、怎么用的等等基础用法这个就不用说了俺也默认你都知道的!

正文

我们日常对数据的各种操作都离不开数组,可以说数组的使用之多,接口返回的数据等等大都是使用到了数组

一、检测数组

对于数组我们已经知道了什么是数组了,那么检测数组又是怎么检测的呢?

其实检测数组的两个方法:

01、 instanceof

let arr = [] console.log( arr instanceof Array)//true

instanceof 的判断其实就是判断俩个操作数的构造函数的prototype属性,在一个全局执行环境下 instanceof 这个当然可以判断数组的类型,那假如一个网页同时有俩个框架下的情况下呢,我从一个框架传一个数组到另一个框架中,而我从一个框架传入的数组和这个框架中的数组却是存在不一样的构造函数,使用 instanceof 判断是否为数组的时候就会出现问题,那又该怎么办呢?

浅谈ECMAScript 中的Array类型

02、 Array.isArray

可以说 Array.isArray() 方法就是为了针对这个问题而新增的,这个方法不管你从哪里来到哪里去,只要判断你是不是一个 Array 类型,看粟子:

let arr = []; console.log(Array.isArray(arr))//true

二、数组方法

当数组存有了我们需要的数据,然后就是对数据进行各种各样的操作,而数组为我们提供了以下的方法(常用)

01、Array.prototype.join()

join() 方法将数组(类数组对象)的所以元素都连接成一个字符串然后返回这个字符串,一个元素的情况下直接返回

粟子:

let arr = ['apple','tomatoes','banana'] console.log(arr.join())//apple,tomatoes,banana console.log(arr.join('.'))//apple.tomatoes.banana console.log(arr.join('-'))//apple-tomatoes-banana let arr1 = ['apple'] console.log(arr1.join('+'))//apple

从例子可以看出,当什么都不添加的情况下的时候直接返回所有元素的字符串,添加分割符的情况时候就为元素直接添加一个新添加的字符,当数组只有一个元素的时候,无论添加什么都是直接返回该元素。

02、Array.prototype.push()

push() 方法用于将一个或者多个元素添加到数组的末端,返回数组的新的长度

又一个粟子:

let arr = ['apple','tomatoes','banana'] console.log(arr.push('orange'))//4 console.log(arr.push('pear','peach'))//6 console.log(arr);//[ 'apple', 'tomatoes', 'banana', 'orange', 'pear', 'peach' ]

03、Array.prototype.pop()

pop() 方法将数组的最后一个元素进行删除,然后会返回删除的改元素。该方法会改变数组的长度,空数组的情况下会返回 undefined

对方表示不想说话并扔了一个粟子:

let arr = [ 'apple', 'tomatoes', 'banana', 'orange', 'pear' ] console.log(arr.pop())//pear console.log(arr.pop())//orange console.log(arr)//[ 'apple', 'tomatoes', 'banana' ]

04、Array.prototype.concat()

concat 方法是合并两个或者多个数组,然后返回一个合并的新数组,但是并不改变原来的数组

接到新的粟子:

let arr = [ 'apple', 'tomatoes' ] let arr1 = ['banana', 'orange', 'pear'] console.log(arr.concat(arr1));//[ 'apple', 'tomatoes', 'banana', 'orange', 'pear' ] console.log(arr.concat(2,arr1));//[ 'apple', 'tomatoes', 2, 'banana', 'orange', 'pear' ] console.log(arr);//[ 'apple', 'tomatoes' ](原数组)

05、Array.prototype.sort()

sort 方法对数组进行排序,返回排序的数组

一个简单的粟子:

let array = [1,3,2,4,5,7,6,8] console.log(array.sort())//[ 1, 2, 3, 4, 5, 6, 7, 8 ]

拓展的粟子:

let array = [ { id: 5, name: "jk" }, { id: 2, name: "jc" }, { id: 3, name: "jg" }, { id: 4, name: "jp" }, { id: 1, name: "jq" }, { id: 6, name: "jr" } ] console.log(array.sort( (a, b) => a.id - b.id)) //[ { id: 1, name: 'jq' },{ id: 2, name: 'jc' },{ id: 3, name: 'jg' },{ id: 4, name: 'jp' },{ id: 5, name: 'jk' },{ id: 6, name: 'jr' } ]

结果不出意外也是正序排序,降序反过来就ok了

06、Array.prototype.slice()

slice() 方法从数组中返回选中的元素,对原数组进行浅拷贝

第一个参数为从0开始

第二个参数为从0开始

粟子:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/2424ee2eaa6be8be9096215e79abcae1.html