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 相关文章推荐
IE图片缓存document.execCommand("BackgroundImageCache",false,true)
Mar 01 Javascript
jquery显示和隐藏div特效实例
Feb 27 Javascript
javascript 密码框防止用户粘贴和复制的实现代码
Feb 17 Javascript
详细分析JavaScript变量类型
Jul 08 Javascript
AngularJs Dependency Injection(DI,依赖注入)
Sep 02 Javascript
Html中 IFrame的用法及注意点
Dec 22 Javascript
基于JavaScript实现带缩略图的轮播效果
Jan 12 Javascript
js实现鼠标左右移动,图片也跟着移动效果
Jan 25 Javascript
微信小程序实现的贪吃蛇游戏【附源码下载】
Jan 03 Javascript
jQuery实现的简单歌词滚动功能示例
Jan 07 jQuery
jQuery实现文本显示一段时间后隐藏的方法分析
Jun 20 jQuery
elementui的el-popover修改样式不生效的解决
Jun 30 Javascript
完美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日期时间运算汇总
2015/11/04 PHP
PHP7基于curl实现的上传图片功能
2018/05/11 PHP
PHP基于PDO扩展操作mysql数据库示例
2018/12/24 PHP
JavaScript TO HTML 转换
2006/06/26 Javascript
设置下载不需要倒计时cookie(倒计时代码)
2008/11/19 Javascript
真正的JQuery.ajax传递中文参数的解决方法
2011/05/28 Javascript
引用 js在IE与FF之间的区别详细解析
2013/11/20 Javascript
js调用后台、后台调用前台等方法总结
2014/04/17 Javascript
JS基于面向对象实现的放烟花效果
2015/05/07 Javascript
探讨JavaScript中的Rest参数和参数默认值
2015/07/29 Javascript
Angular 常用指令实例总结整理
2016/12/13 Javascript
使用jquery datatable和bootsrap创建表格实例代码
2017/03/17 Javascript
webpack进阶——缓存与独立打包的用法
2017/08/02 Javascript
对Angular中单向数据流的深入理解
2018/03/31 Javascript
在element-ui的select下拉框加上滚动加载
2019/04/18 Javascript
解决vue-router 二级导航默认选中某一选项的问题
2019/11/01 Javascript
javaScript 实现重复输出给定的字符串的常用方法小结
2020/02/20 Javascript
vuex中store存储store.commit和store.dispatch的用法
2020/07/24 Javascript
Python数据分析之双色球统计单个红和蓝球哪个比例高的方法
2018/02/03 Python
Python之修改图片像素值的方法
2019/07/03 Python
Python制作数据预测集成工具(值得收藏)
2020/08/21 Python
如何使用Python自动生成报表并以邮件发送
2020/10/15 Python
利用html5的websocket实现websocket聊天室
2013/12/12 HTML / CSS
详解android与HTML混合开发总结
2018/06/06 HTML / CSS
我的求职计划书
2014/01/10 职场文书
教学大赛获奖感言
2014/01/15 职场文书
面试后感谢信
2014/02/01 职场文书
群众路线批评与自我批评
2014/02/06 职场文书
导购员的岗位职责
2014/02/08 职场文书
2014年会策划方案
2014/05/11 职场文书
购房委托书范本
2014/09/18 职场文书
财政局个人总结
2015/03/04 职场文书
值班管理制度范本
2015/08/06 职场文书
2016年公司“3.12”植树节活动总结
2016/03/16 职场文书
靠谱准确的求职信
2019/04/02 职场文书
全新239军机修复记
2022/04/05 无线电