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

 更新时间:2016年07月21日 09:34:16   投稿:jingxian  
下面小编就为大家带来一篇JavaScript 数组- Array的方法总结(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

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的方法总结(推荐)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • JS比较2个日期间隔的示例代码

    JS比较2个日期间隔的示例代码

    这篇文章主要介绍了JS比较2个日期间隔的方法,需要的朋友可以参考下
    2014-04-04
  • 浅谈bootstrap使用中的一些问题以及解决过程

    浅谈bootstrap使用中的一些问题以及解决过程

    下面小编就为大家带来一篇浅谈bootstrap使用中的一些问题以及解决过程。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-10-10
  • 微信小程序实现文件预览

    微信小程序实现文件预览

    这篇文章主要为大家详细介绍了微信小程序实现文件预览,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-10-10
  • JavaScript实现页面高亮操作提示和蒙板

    JavaScript实现页面高亮操作提示和蒙板

    这篇文章主要介绍了JavaScript实现页面高亮操作提示和蒙板,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-01-01
  • JavaScript图片打印方案实例详解

    JavaScript图片打印方案实例详解

    有时候我们希望文件上传的时候预览图片,下面这篇文章主要给大家介绍了关于JavaScript图片打印方案的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2023-03-03
  • JavaScript实现汉字转换为拼音及缩写的方法示例

    JavaScript实现汉字转换为拼音及缩写的方法示例

    这篇文章主要介绍了JavaScript实现汉字转换为拼音及缩写的方法,结合实例形式分析了javascript数组遍历、转换实现汉字转拼音相关操作技巧,需要的朋友可以参考下
    2019-03-03
  • 如何在javascript 中使用 xmlHttpRequest 发送 POST 请求

    如何在javascript 中使用 xmlHttpRequest 发送 POST

    本文将通过不同的示例解释如何使用JavaScript代码在AJAX编程中发送 XMLHttpRequest post 请求,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
    2023-07-07
  • 微信小程序模拟cookie的实现

    微信小程序模拟cookie的实现

    本篇文章主要介绍了微信小程序模拟 cookie的实现,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-06-06
  • 前台js对象在后台转化java对象的问题探讨

    前台js对象在后台转化java对象的问题探讨

    在开发项目中多次遇到前台js对象在后台转化java对象的问题,下面就为大家介绍下前台js对象转后台java对象,感兴趣的朋友可以了解下
    2013-12-12
  • Javascript事件热键兼容ie|firefox

    Javascript事件热键兼容ie|firefox

    Javascript热键兼容ie,firefox,需要的朋友可以参考下。
    2010-12-12

最新评论