ECMAScript5下Array的方法
声明:ECMAScript不会兼容IE8及以下版本IE浏览器。
一、迭代方法
注:这些迭代方法不会影响数组的值。
每个方法都有两个参数:
array.方法(执行函数体,当前作用域(比如this,这个可以省略,用处不大));
而该执行函数体也有三个参数,分别是 函数体(数组项,该项index,该项所在的数组);
5个方法如下:
every:对每个数组中的item都执行该方法,综合执行结果返回一个布尔值,类似于且的关系,成员执行结果全为true,则为true
some:原理和every相同,但是类似于或的关系。
map:对数组中的每一项调用执行函数体,返回该函数执行后的数组。
filter:对数组中每一项调用函数体,返回该函数执行后的布尔值为true的项所组成的数组。
forEach:对数组中的每一项执行函数体,无返回值。
下面来看看执行的结果:
var arr = ["sp", "2", "3"]; arr.forEach(function aaa(c) {
return parseInt(c);
});//无任何返回值,弹出undefined。 arr.every(function aaa(c) {
return parseInt(c);
});//返回false。 arr.every(function aaa(c) {
return parseInt(c);
});//返回true。 arr.map(function aaa(c) {
return parseInt(c);
});//返回[NaN,2,3]。 arr.filter(function aaa(c) {
return parseInt(c);
});//返回[2,3]。 alert(arr);//[sp,2,3]
原理已经讲述完毕,下面我们来看看一些题目是否让你混乱
1.["1", "2", "3"].map(parseInt)输出什么?
答案是:[1,NaN,NaN]
解析:因为迭代所需要的函数体必须三个参数:item,itemIndex,array;但是parseInt函数只有两个参数val和radix。迭代是怎么原理?如果函数体形参没定义index就自动按次序迭代,有index就按item的index进行运算,现在调用parseInt,依次parseInt(1,0) ,parseInt(2,1),parseInt(3,2). 而parseInt的radix的有效值只有0,2,8,10,16,但是对字符串3不是二进制字符串,所以输出NaN。
2.var ary = [0,1,2];
ary[4] = 10;
ary.filter(function(x) { return x === undefined;}); 输出什么?
答案是:[]
解析:如果为数组ary第5个位置赋值10,数组ary会变成ary[0,1,2,,10],此时执行filter的函数体,根据filter的特性,对于返回值为false的计算项不会显示,而对于没有存储任何东西的数组下标,filter会跳过不执行,所以输出不会是[undefined],而是[]。
3.var ary = Array(3);
ary[0]=2 ;
ary.map(function(elem) { return '1'; });
答案是:['1',,]
解析:还是和上题一个原理。数组ary后面两个下标的值为空,但是map不会将这些空值跳过,可是这些空值不能用来参与运算,所以只能返回空。
二、缩小方法
缩小方法分别是 reduce和reduceRight,这两个方法有两个参数,分别是函数体和缩小基础值,函数体又有四个参数 前一个值,当前值,值的index,数组。reduce和reduceRight本质没什么区别,只是一个向前一个向后而已。
数组.redcuce(函数体,缩小基础值(可选));看具体事例:
var arr = [1, 2, 3,4,5];
arr.reduce(function (v1, v2) {
return v1 + v2;
});//输出 15 也就是 1+2+3+4+5
当添加基础值参数时:
var arr = [1, 2, 3,4,5];
arr.reduce(function (v1, v2) {
return v1 + v2;
},2);//输出 17 也就是 先得出2 后 再加上 1+2+3+4+5
讲完原理依旧是题目:
1.[ [3,2,1].reduce(Math.pow), [].reduce(Math.pow)]输出什么?
答案是:报错
解析:reduce无法对空值进行操作,它不像map或filter那样迁就或过滤空值,而是根本不支持空值操作,所以报错。但是如果我们为reduce设置第二个参数呢?[].reduce(Math.pow,2)会输出什么呢?答案是2,而且不会报错!因为reduce此时已经有了初始返回值2,reduce函数体的操作无关紧要。
ECMAScript5下Array的方法的更多相关文章
- js中Array对象方法详解
操作方法:concat() slice() splice() concat()方法可以基于当前数组中的所有项创建一个新数组.具体来说,这个方法会创建当前数组一个副本,将接收到参数添加到副本的末尾,最后 ...
- JavaScript 数组-Array的方法总结
JavaScript中的Array类型是经常用到的,Array类型也提供了很多方法能实现我们需求,下面我们来总结一下 一.创建Array的方法 1.使用Array构造函数 var colors=new ...
- JavaScript Array数组方法详解
Array类型是ECMAScript中最常用的引用类型.ECMAScript中的数据与其它大多数语言中的数组有着相当大的区别.虽然ECMAScript中的数据与其它语言中的数组一样都是数据的有序列表, ...
- 【转】javascript Object使用Array的方法
原文: http://www.cnblogs.com/idche/archive/2012/03/17/2403894.html Array.prototype.push push向数组尾部添加一项并 ...
- 兼容低版本JS的Array.map方法
前几天去别的公司面试遇到个这样的问题,兼容IE7下的Array.map方法,一脸蒙蔽.后面回来查了下资料发现.Array.map方法是ECMA-262 标准中新添加的方法,在低版本的JS中是木有的. ...
- es6 Array数组方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- Javascript数组Array的方法总结!
1.join() 将数组的元素组成一个字符串,以分隔符连接,如果省略则默认逗号为分隔符,该方法只接收一个参数:分隔符.此方法不会改变原数组. let arr = [1,2,3,4] let arr1 ...
- VBScript - 动态 Array 实现方法大全!
记录一些方法,关于 VBScript 中,动态 Array 的实现 ,也适用于 VBA, 很久以前,写 VBA 的时候,就觉得使用 Array 很不方便,因为大小固定, 当时想的是,要是 Array ...
- JavaScript -Array.form方法
Array.from方法可以把一个类数组或者课遍历对象转换为一个正真的数组 语法 Array.from(arrayLike[, mapFn[, thisArg]]) 参数 arrayLike 想要转换 ...
随机推荐
- java基本概念
什么是环境变量? 环境变量通常是指在操作系统当中,用来指定操作系统运行时需要的一些参数.通常为一系列的键值对. path环境变量的作用 path环境变量是操作系统外部命令搜索路径 什么是外部命令搜索路 ...
- 创建表 添加主键 添加列常用SQL语句
--删除主键 alter table 表名 drop constraint 主键名--添加主键alter table 表名 add constraint 主键名 primary key(字段名1,字段 ...
- PBOC规范(2.0->3.0)对照表
1 数据方面 TAG PBOC2.0 ...
- .NET开源工作流RoadFlow-流程设计-流程步骤设置-基本设置
流程属性设置完成后点击确定之后,即可进行流程步骤设置了. 点击工具栏上的步骤按钮,即可添加一个新步骤. 在新步骤图形上双击即可弹出该步骤相应属性设置框. 步骤ID:系统自动为该步骤生成的唯一ID. 步 ...
- SQLserver使用映射表进行数据相关操作
基本需求: 老数据有老数据的顺序编码规则,新数据有新数据的顺序编码规则,但是老数据的编码还是要更新相应的东西,新数据也得实时更新,在新数据中已经用新编码规则对老数据对进行编码,在上报表中既要新增新数据 ...
- ToolBar存档
上图是将本阶段要完成的结果画面做了标示,结合下面的描述希望大家能明白. colorPrimaryDark(状态栏底色):在风格 (styles) 或是主题 (themes) 里进行设定. App ba ...
- 初探oracle删除重复记录,只保留rowid最小的记录
如题,初探oracle删除重复记录,只保留rowid最小的记录(rowid可以反映数据插入到数据库中的顺序) 一.删除重复记录可以使用多种方法,如下只是介绍了两种方法(exist和in两种). 1.首 ...
- 你必须懂的 T4 模板:深入浅出
示例代码:示例代码__你必须懂的T4模板:浅入深出.rar (一)什么是T4模板? T4,即4个T开头的英文字母组合:Text Template Transformation Toolkit. T4文 ...
- 关于VS2010“ADO.NET Entity Data Model模板丢失或者添加失败问题
我最近在安装vs2010后,添加ADO.NET Entity 实体时发现,我的新建项里面并没有这个实体模型,后来我就在博问里面发表了问题,请求大家帮忙解决,悲剧的是少有人回应啊,呵呵,不过我还是在网上 ...
- ggplot2 学习笔记 (持续更新.....)
1. 目前有四种主题 theme_gray(), theme_bw() , theme_minimal(),theme_classic() 2. X轴设置刻度 scale_x_continuous(l ...