JavaScript 数组- Array的方法总结(推荐)


Posted in Javascript onJuly 21, 2016

JavaScript中的Array类型是经常用到的,Array类型也提供了很多方法能实现我们需求,下面我们来总结一下

一、创建Array的方法

var colors=new Array();

var colors=new Array(3);//创建一个长度为3的数组

var colors=new Array("red","blue")//创建一个数组["red","blue"]

当然,上面的new可以省略不写,如 var colors=Array("red");

2、直接使用数组字面量

var colors=["red","blue","green"];

二、Array的方法1

var colors=["red","blue","green"];

1、获取数组的长度 colors.length;//3

2、访问数组第二项colors[1];//blue

3、更改数据的第二项colors[1]="black";//["red","black","green"]

4、检查是否是一个数组 colors instanceof Array;//true

5、colors.toString();//默认会以逗号隔开输出字符串  red,blue,green

6、colors.join("|");//自定义以“|”隔开输出字符串 red|blue|green

7、colors.push("brown")//往数组的尾部添加一项

8、colors.pop()//往数组的尾部删除一项

9、colors.shift()//删除数组的第一项,并取得该值

10、colors.unshift("k1","k2")//往数组的前面插入这两项;["k1","k2","red","blue","green"];

11、colors.reverse()//翻转数组的顺序

12、colors.sort()或者colors.sort([func]);

13、concat() 返回一个新数组,不影响原数组 colors.concat()或者colors.concat("k1");

14、slice(begin,end)从数组下标begin开始到end复制这个数据,不包括下标end,如果是slice(begin)那么就是从下标begin开始到数组的尾部

15、splice

splice(0,2)//从下标0开始删除数组的两项

splice(2,0,"k1","k2")从下标2开始删除0项,紧接着从这里插入两项

splice(2,1,"k1")//从下标2开始删除一项,紧接着从这里插入一项

16、indexOf("item")//从数组头开始查找某项,找到后返回下标值,找不到返回-1

17、lastIndexOf("item")//从数组尾开始查找某项,找到后返回下标值,找不到返回-1

三、Array方法2:迭代方法(ECMAScript5)

1、every():对数组的每一项运行给定的函数,每一项都返回true,则返回true(不影响原数组)

var numbers=[1,2,3,2,1];
//判断是否每个数字都大于2
var flag=numbers.every(function (item,index,array) {
  return item>2;
});

2、filter():对数组中每一项运行给定的函数,返回该函数为true的项(不影响原数组)

var numbers=[1,2,3,2,1];
//返回大于2的项
var array=numbers.filter(function (item,index,array) {
  return item>2;
});

3、forEach():对数组中的每一项执行给定的函数,不返回值 (不影响原数组)

var numbers=[1,2,3,2,1];
//输出每一项的平方
numbers.forEach(function (item,index,array) {
  console.log(item*2);
});

4、map():对数组的每一项执行给定的函数,返回每次函数调用后结果组成的数组(不影响原数组)

var numbers=[1,2,3,2,1];
//返回每一项的平方
var array=numbers.map(function (item,index,array) {
  return item*item;
});

5、some():对数组的每一项执行给定的函数,如果有一项返回true则,则返回true

var numbers=[1,2,3,2,1];
var flag=numbers.some(function (item,index,array) {
  return item>2
});

三、Array方法3:归并方法(ECMAScript5)

1、reduce()方法从数组的第一行开始,逐个遍历到最后

2、reduceRight()方法从数组的最后一项开始,逐个向前遍历

var numbers=[1,2,3,4,5];
var result=numbers.reduce(function (prev,cur,index,array) {
  //prev:前一个运算的结果,刚开始时候为数字的第一项
  //cur:数组的当前项
  //index:当前数组的下标
  //array:执行这个运算的数组,当前为numbers
  console.log("prev:"+prev);
  console.log("cur:"+cur);
  console.log("index:"+index);
  console.log("array:"+array);
  console.log("=============");
  return prev+cur;
});

以上这篇JavaScript 数组- Array的方法总结(推荐)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery插件制作左右按钮与标题文字图片切换效果
Nov 07 Javascript
jquery渐隐渐显的图片幻灯闪烁切换实现方法
Feb 26 Javascript
基于Jquery实现焦点图淡出淡入效果
Nov 30 Javascript
JavaScript判断DIV内容是否为空的方法
Jan 29 Javascript
JavaScript中解决多浏览器兼容性23个问题的快速解决方法
May 19 Javascript
React创建组件的三种方式及其区别
Jan 12 Javascript
JavaScript中in和hasOwnProperty区别详解
Aug 04 Javascript
Express下采用bcryptjs进行密码加密的方法
Feb 07 Javascript
了解ESlint和其相关操作小结
May 21 Javascript
从vue源码解析Vue.set()和this.$set()
Aug 30 Javascript
extjs4图表绘制之折线图实现方法分析
Mar 06 Javascript
vue+element table表格实现动态列筛选的示例代码
Jan 14 Vue.js
完美JQuery图片切换效果的简单实现
Jul 21 #Javascript
jQuery的ajax下载blob文件
Jul 21 #Javascript
picLazyLoad 实现图片延时加载(包含背景图片)
Jul 21 #Javascript
浅谈DOCTYPE对$(window).height()取值的影响
Jul 21 #Javascript
jQuery新窗口打开外链接
Jul 21 #Javascript
JS for循环中i++ 和 ++i的区别介绍
Jul 20 #Javascript
javascript和jQuery实现网页实时聊天的ajax长轮询
Jul 20 #Javascript
You might like
保存到桌面、设为桌面且带图标的PHP代码
2013/11/19 PHP
ThinkPHP自动转义存储富文本编辑器内容导致读取出错的解决方法
2014/08/08 PHP
jQuery判断元素是否是隐藏的代码
2011/04/24 Javascript
基于jquery的无刷新分页技术
2011/06/11 Javascript
Jvascript学习实践案例(开发常用)
2012/06/25 Javascript
jQuery学习笔记之jQuery+CSS3的浏览器兼容性
2015/01/19 Javascript
javascript实现查找数组中最大值方法汇总
2016/02/13 Javascript
JavaScript中的toString()和toLocaleString()方法的区别
2017/02/15 Javascript
使用Bootstrap打造特色进度条效果
2017/05/02 Javascript
Angular2使用Angular-CLI快速搭建工程(二)
2017/05/21 Javascript
解决vue router组件状态刷新消失的问题
2018/08/01 Javascript
Vue循环组件加validate多表单验证的实例
2018/09/18 Javascript
vue实现图片裁剪后上传
2020/12/16 Vue.js
[48:52]DOTA2上海特级锦标赛A组小组赛#2 Secret VS CDEC第一局
2016/02/25 DOTA
Python函数中的函数(闭包)用法实例
2016/03/15 Python
python基础教程之匿名函数lambda
2017/01/17 Python
python 编程之twisted详解及简单实例
2017/01/28 Python
python随机数分布random测试
2018/08/27 Python
pandas重新生成索引的方法
2018/11/06 Python
Python脚本完成post接口测试的实例
2018/12/17 Python
详解Django项目中模板标签及模板的继承与引用(网站中快速布置广告)
2019/03/27 Python
关于不懂Chromedriver如何配置环境变量问题解决方法
2019/06/12 Python
python中delattr删除对象方法的代码分析
2020/12/15 Python
简单总结CSS3中视窗单位Viewport的常见用法
2016/02/04 HTML / CSS
英国领先的NHS批准的在线药店:Pharmacy2U
2017/01/06 全球购物
介绍JAVA 中的Collection FrameWork(及如何写自己的数据结构)
2014/10/31 面试题
电大学习个人自我评价范文
2013/10/04 职场文书
机械制造与自动化应届生求职信
2013/11/16 职场文书
大学运动会入场词
2014/02/22 职场文书
公路绿化方案
2014/05/12 职场文书
高中班级口号
2014/06/09 职场文书
教师师德表现自我评价
2015/03/05 职场文书
企业党员岗位承诺书
2015/04/27 职场文书
《亲亲我的妈妈》观后感(3篇)
2019/09/26 职场文书
Mysql - 常用函数 每天积极向上
2021/04/05 MySQL
Springboot如何同时装配两个相同类型数据库
2021/11/17 Java/Android