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 相关文章推荐
javaScript arguments 对象使用介绍
Oct 18 Javascript
JavaScript搜索字符串并将搜索结果返回到字符串的方法
Apr 06 Javascript
jQuery实现页面顶部显示的进度条效果完整实例
Dec 09 Javascript
基于Bootstrap实现tab标签切换效果
Apr 15 Javascript
基于VUE选择上传图片并页面显示(图片可删除)
May 25 Javascript
关于vue中watch检测到不到对象属性的变化的解决方法
Feb 08 Javascript
vue点击input弹出带搜索键盘并监听该元素的方法
Aug 25 Javascript
JS判断两个数组或对象是否相同的方法示例
Feb 28 Javascript
详解React项目中碰到的IE问题
Mar 14 Javascript
如何通过setTimeout理解JS运行机制详解
Mar 23 Javascript
TensorFlow.js 微信小程序插件开始支持模型缓存的方法
Feb 21 Javascript
JavaScript 中的执行上下文和执行栈实例讲解
Feb 25 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生成静态文件的多种方法分享
2012/07/17 PHP
解析PHP实现下载文件的两种方法
2013/07/05 PHP
PHP生成sitemap.xml地图函数
2013/11/13 PHP
PHP实现清除wordpress里恶意代码
2015/10/21 PHP
php读取qqwry.dat ip地址定位文件的类实例代码
2016/11/15 PHP
理解JavaScript中的事件
2006/09/23 Javascript
基于jquery实现的可以编辑选择的下拉框的代码
2010/11/19 Javascript
myeclipse安装jQuery插件的方法
2011/03/29 Javascript
JavaScript改变HTML元素的样式改变CSS及元素属性
2013/11/12 Javascript
showModalDialog在谷歌浏览器下会返回Null的解决方法
2013/11/27 Javascript
jQuery 选择器详解
2015/01/19 Javascript
如何利用AngularJS打造一款简单Web应用
2015/12/05 Javascript
jQuery使用经验小技巧(推荐)
2016/05/31 Javascript
jquery日历插件e-calendar升级版
2016/11/10 Javascript
Angular-Touch库用法示例
2016/12/22 Javascript
bootstrap daterangepicker汉化以及扩展功能
2017/06/15 Javascript
深入理解Vue transition源码分析
2017/07/30 Javascript
js+springMVC 提交数组数据到后台的实例
2019/09/21 Javascript
JS实现旋转木马轮播图
2020/01/01 Javascript
Python实现建立SSH连接的方法
2015/06/03 Python
Python实现打印螺旋矩阵功能的方法
2017/11/21 Python
django数据库migrate失败的解决方法解析
2018/02/08 Python
Python 输入一个数字判断成绩分数等级的方法
2018/11/15 Python
Python 微信爬虫完整实例【单线程与多线程】
2019/07/06 Python
Python递归求出列表(包括列表中的子列表)的最大值实例
2020/02/27 Python
Python生成六万个随机,唯一的8位数字和数字组成的随机字符串实例
2020/03/03 Python
Python操作MongoDb数据库流程详解
2020/03/05 Python
Pycharm激活码激活两种快速方式(附最新激活码和插件)
2020/03/12 Python
德国机场停车位比较和预订网站:Ich-parke-billiger
2018/01/08 全球购物
公务员总结性个人自我评价
2013/12/05 职场文书
2014年部门工作总结
2014/11/12 职场文书
2014年禁毒工作总结
2014/11/24 职场文书
2014年妇产科工作总结
2014/12/08 职场文书
消费者理赔投诉书
2015/07/02 职场文书
如果用一句诗总结你的上半年,你会用哪句呢?
2019/07/16 职场文书
html+css实现文字折叠特效实例
2021/06/02 HTML / CSS