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 相关文章推荐
JS网络游戏-(模拟城市webgame)提供的一些例子下载
Oct 14 Javascript
javascript cookie操作类的实现代码小结附使用方法
Jun 02 Javascript
动态标签 悬停效果 延迟加载示例代码
Nov 21 Javascript
jQuery中not()方法用法实例
Jan 06 Javascript
javascript实现全角与半角字符的转换
Jan 07 Javascript
JS建造者模式基本用法实例分析
Jun 30 Javascript
JS简单限制textarea内输入字符数量的方法
Oct 14 Javascript
遍历js中对象的属性和值的实例
Nov 21 Javascript
详解vue中computed 和 watch的异同
Jun 30 Javascript
详解如何用VUE写一个多用模态框组件模版
Sep 27 Javascript
浅谈vue项目打包优化策略
Sep 29 Javascript
javascript中的相等操作符(==与===区别)
Dec 21 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
星际争霸兵种名称对照表
2020/03/04 星际争霸
phpStudy配置多站点多域名和多端口的方法
2017/09/01 PHP
PHP使用PDO 连接与连接管理操作实例分析
2020/04/21 PHP
JS判断数组中是否有重复值得三种实用方法
2013/08/16 Javascript
jquery下div 的resize事件示例代码
2014/03/09 Javascript
jQuery如何取id有.的值一般的方法是取不到的
2014/04/18 Javascript
js实现图片无缝滚动特效
2020/03/19 Javascript
jquery Ajax 全局调用封装实例详解
2017/01/16 Javascript
最通俗易懂的javascript变量提升详解
2017/08/05 Javascript
在iframe中使bootstrap的模态框在父页面弹出问题
2017/08/07 Javascript
Vue+Flask实现简单的登录验证跳转的示例代码
2018/01/13 Javascript
使用vue的transition完成滑动过渡的示例代码
2018/06/25 Javascript
JavaScript遍历查找数组中最大值与最小值的方法示例
2019/05/24 Javascript
在layui中使用form表单监听ajax异步验证注册的实例
2019/09/03 Javascript
vue+element-ui表格封装tag标签使用插槽
2020/06/18 Javascript
[40:10]2015国际邀请赛全明星表演赛
2015/08/07 DOTA
网站渗透常用Python小脚本查询同ip网站
2017/05/08 Python
Flask实现跨域请求的处理方法
2018/09/27 Python
ubuntu 18.04搭建python环境(pycharm+anaconda)
2019/06/14 Python
在linux下实现 python 监控usb设备信号
2019/07/03 Python
python3实现高效的端口扫描
2019/08/31 Python
英国奢侈品牌时尚购物平台:Farfetch(支持中文)
2020/02/18 全球购物
自1926年以来就为冰岛保持温暖:66°North
2020/11/27 全球购物
PHP如何防止SQL注入
2014/05/03 面试题
PPP协议组成及简述协议协商的基本过程
2015/05/28 面试题
单位领导证婚词
2014/01/14 职场文书
聚美优品陈欧广告词
2014/03/14 职场文书
婚前协议书范本
2014/04/15 职场文书
倡议书范文
2014/04/16 职场文书
文秘应届生求职信
2014/07/05 职场文书
如何写早恋检讨书
2014/09/10 职场文书
医院领导班子查摆问题对照检查材料思想汇报
2014/10/08 职场文书
2015年幼儿教师个人工作总结
2015/05/20 职场文书
运动会100米加油稿
2015/07/21 职场文书
解析Java异步之call future
2021/06/14 Java/Android
Python实现日志实时监测的示例详解
2022/04/06 Python