ES5中关于数组的一些方法(检测数组、遍历数组等)

一. 检测数组

1. 对于一个网页, 或者只有一个全局作用域来说, 使用instanceof操作符就可以检测是否为数组了:

1. if(value instanceof Array){
2.     return true;
3. }

instanceof操作符的问题在于, 它假定只有一个全局执行环境. 如果网页中包含多个框架, 那么实际上就存在两个以上不同的全局执行环境, 那么使用instanceof操作符可能就无法得到理想的结果.

2. Array.isArray()

为了解决这个问题, ECMAScript5新增了Array.isArray()方法, 这个方法的目的是最终确定某个值是否为数组, 而不管它是在哪个全局执行环境中创建的, 用法:

1. if(Array.isArray(value)){
2.     return true;
3. }

支持这个方法的浏览器有IE9、Firefix 4+、Safari 5+、Opera 10.5+和Chrome, 对于IE8以下的浏览器可能还需要做兼容处理.

3. Object.prototype.toString.call()

大家知道, 在任何值上面调用Object原生的toString()方法, 都会返回一个[Object NativeConstructorName]格式的字符串, 每个类在内部都有一个[[Class]]属性, 这个属性中就制定了上述字符串中的构造函数名, 而且这个Object的toString()方法不能检测非原生构造函数的构造函数名. 因此, 开发人员定义的任何构造函数都将返回[object Object]. 因此可以用这个特性以下面的方式来检测一个东西是否为数组:

1. function isArray(value){
2.     return Object.prototype.toString.call(value) == "[object Array]";
3. }

由于原生数组的构造函数名与全局作用域无关, 因此使用toString()就能保证返回一致的值.个人认为这个方法是最好的用于检测数组的方法

二. 对数组模拟栈方法和队列方法

栈和队列都是JAVA中的概念, 栈是一种后进先出的数据结构, 也就是最新添加的项最早被移除, 而栈中项的插入和移除都只能发生在一个位置--栈的顶部, 而JavaScript让数组实现栈方法的两个分别是push()和pop(), push()是用于将传到参数的项添加到数组的末尾, 并返回修改后数组的长度, 而pop()方法则从数组末尾移除最后一项, 减少length值, 并且返回移除的项. 举例:

而队列方法则是一种先进先出的数据结构, 队列在列表的末尾添加项, 从队列的前端(最前面)移除项. 所以想要让数组模拟队列操作, 可以使用shift()和push()方法. shift()是移除数组的第一个项并返回该项, 举例:

最后补充一个unshift方法, 和shift相反, 它是往数组的顶部添加一个元素

unshift方法返回的值是执行插入操作之后新数组的长度length, 并且执行该方法后会将blue插入到数组的最前面, 因此数组现在的内容是blue, red, green, yellow

三. 操作方法

1. concat

concat方法可以基于当前数组的所有项创建一个新数组. 具体来书o,这个方法会先创建当前数组的一个副本, 然后将接收到的参数添加到这个数组的末尾, 最后返回新构建的数组.

concat是将当前数组复制了一份, 因此后续操作不影响原数组

2.slice

该方法能够基于当前数组中的一项或多个项创建一个新数组. slice方法可以接受1个或者2个参数, 即要返回项的起始位置和结束位置. 在只有一个参数的情况下, slice方法返回从该参数指定位置开始到当前数组末尾的所有项. 如果有两个参数, 该方法返回起始和结束位置之间的项--但不包括结束位置的项. 注意, slice方法不会影响原始数组. 请看下面例子:

3. splice方法

删除: 可以删除任意数量的向, 只要指定2个参数:要删除的第一项的位置和要删除的项数

插入: 可以向指定位置插入任意数量的项, 只需要提供3个参数: 起始位置, 0(要删除的项数), 和要插入的项. 如果要插入多个项, 可以传入第4, 第5甚至任意多个项

替换: 可以向指定位置插入任意数量的项, 同时删除任意数量的项, 只需要指定3个参数: 起始位置, 要删除的项数以及要插入的任意数量的项. 下面的代码展示了上述3种使用splice方法的方式:

四. 数组的迭代方法

数组有5个迭代方法: every, filter, forEach, map, some

其中every和some都是用于查询数组中的想是否满足某个条件. 而every是要所有项都满足条件才返回true, some是只要有一个项满足条件就返回true, 举例:

也就是说这两个方法返回的都是布尔值true或者false

而filter()函数则是将原数组中满足条件的项抽取出来组成一个新的数组, 所以说这个方法返回的是一个数组, 举例:

map()函数是用于对数组中的每一项运行传入函数, 得到的结果再组成一个数组返回. 举例:

最后一个forEach, 他只是对数组中的每一项运行传入的函数, 没有返回值, 所以本质上与使用for循环迭代数组是一样的, 举例:

支持这些迭代方法的浏览器有: IE9+、Firefox2+、Safari 3+、Opera 9.5+和Chrome, 就是IE8及以下还是无法支持的

五. 颠倒数组顺序

数组还有一个方法是reverse, 这个方法的作用是将某个数组中元素的顺序完全颠倒过来, 比如一个数组是1, 2, 3, 4, 5,调用reverse方法后就变成了5,4,3,2,1, 所以reverse方法很多时候也被用来将一个字符串内容倒叙形成新的字符串

reverse方法兼容所有的浏览器

六. 归并方法

ECMAScript 5新增了2个归并数组的方法:reduce()he reduceRight().两个方法都会迭代数组的所有项, 然后构建一个最后返回的值. 其中, reduce()从数组的第一项开始, 逐个遍历到最后. 而reduceRight()则从数组的最后一项开始, 向前遍历到第一项

reduce接收2个参数, 第一个是执行操作的函数, 第二个是作为操作的初始值. 其中第一个参数中的函数又接收4个参数, 分别是前一项, 当前项, 项的索引和数组对象. 这个函数返回的任何值都会作为第一个参数自动传递给下一项.

支持reduce和reduceRight函数的浏览器有IE9+、Firefox 3+、Safari 4+、Opera 10.5和Chrome