前言 

  学学忘忘  闲来做个笔记 整理下数组常用方法。

 Array 数组常用方法

   创建数组的基本方式有两种

      1.第一种是使用Array构造函数,  var arr = new Array();

        使用构造函数方式的话 var arr = new Array(20),则表示创建了一个lenght值为20的数组,也可以直接传入值 var arr   = Array('red','green','blue'); 并且可以忽略 new操作符,

      2.第二种是使用字面量表达法   var arr  = ['red','green','blue'];

  length属性:

   可通过array.length 访问该数组长度。

  1.Array.isArray() 检测数组

   判断某个值是否为数组,返回布尔类型

  1. 1 // 下面的函数调用都返回 true
  2. 2 console.log(Array.isArray([]));
  3. 3 console.log(Array.isArray([1]));
  4. 4 console.log(Array.isArray(new Array()));
  5. 5 // 下面的函数调用都返回 false
  6. 6 console.log(Array.isArray());
  7. 7 console.log(Array.isArray({}));
  8. 8 console.log(Array.isArray(null));
  9. 9 console.log(Array.isArray(undefined));
  10. 10 console.log(Array.isArray(17));
  11. 11 console.log(Array.isArray('Array'));
  12. 12 console.log(Array.isArray(true));
  13. 13 console.log(Array.isArray(false));

  2.Array.join() 

  join(separator):将数组的元素组起一个字符串,以separator为分隔符,省略的话则默认用逗号为分隔符  该方法只接受一个参数:即为分割符;

  1. 1 var arr = [1,2,3];
  2. 2 console.log(arr.join()) //1,2,3
  3. 3 console.log(arr.join('-') // 1-2-3

  3.Array.reverse()  

  reverse():反转数组的顺序

  1. var arr = [ 1,2,3,4,5];
    console.log(arr.reverse())//[5,4,3,2,1,]
    console.log(arr)[1,2,3,4,5]

  4.Array.concat()

  concat():将参数添加到原数组中 这个方法先要创建一个当前数组副本 将参数添加到这个副本的末尾 并返回新构建的数组

  1. 1 var arr = [1,3,5,7];
  2. 2 var arrCopy = arr.concat(9,[11,13]);
  3. 3 console.log(arrCopy); //[1, 3, 5, 7, 9, 11, 13]
  4. 4 console.log(arr); // [1, 3, 5, 7](原数组未被修改)

 可以发现:传入的不是数组,则直接把参数添加到数组后面,如果传入的是数组,则将数组中的各个项添加到数组中。但是如果传入的是一个二维数组呢?

  1. var arrCopy2 = arr.concat([9,[11,13]]);
  2. console.log(arrCopy2); //[1, 3, 5, 7, 9, Array[2]]
  3. console.log(arrCopy2[5]); //[11, 13]

  arrCopy2数组的第五项是一个包含两项的数组,也就是说concat方法只能将传入数组中的每一项添加到数组中,如果传入数组中有些项是数组,那么也会把这一数组项当作一项添加到arrCopy2中。

  

  5.Array.push()和Array.pop()

  push():可以接受任意数量的参数 吧他们逐个添加到数组末尾,并返回修改后的数组的长度。

  pop():数组末尾移除最后一项,减少数组的lenght值,然后返回移除的项。

  1. 1 var arr = ["Lily","lucy","Tom"];
  2. 2 var count = arr.push("Jack","Sean");
  3. 3 console.log(count); // 5
  4. 4 console.log(arr); // ["Lily", "lucy", "Tom", "Jack", "Sean"]
  5. 5 var item = arr.pop();
  6. 6 console.log(item); // Sean
  7. 7 console.log(arr); // ["Lily", "lucy", "Tom", "Jack"]

  

  6.shift()和unshift()

  shift():删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined 。 
  unshift:将参数添加到原数组开头,并返回数组的长度 。

  这组方法和上面的push和pop方法正好对应,一组是操作数组的开头,一组是操作数组的结尾。

  1. 1 var arr = ["Lily","lucy","Tom"];
  2. 2 var count = arr.unshift("Jack","Sean");
  3. 3 console.log(count); // 5
  4. 4 console.log(arr); //["Jack", "Sean", "Lily", "lucy", "Tom"]
  5. 5 var item = arr.shift();
  6. 6 console.log(item); // Jack
  7. 7 console.log(arr); // ["Sean", "Lily", "lucy", "Tom"]

  7、sort()

  sort():按升序排列数组项——即最小的值位于最前面,最大的值排在最后面。

  在排序时,sort()方法会调用每个数组项的 toString()转型方法,然后比较得到的字符串,以确定如何排序。即使数组中的每一项都是数值, sort()方法比较的也是字符串,因此会出现以下的这种情况:

  1. var arr1 = ["a", "d", "c", "b"];
  2. console.log(arr1.sort()); // ["a", "b", "c", "d"]
  3. arr2 = [13, 24, 51, 3];
  4. console.log(arr2.sort()); // [13, 24, 3, 51]
  5. console.log(arr2); // [13, 24, 3, 51](元数组被改变)

  为了解决上述问题,sort()方法可以接收一个比较函数作为参数,以便我们指定哪个值位于哪个值的前面。比较函数接收两个参数,如果第一个参数应该位于第二个之前则返回一个负数,如果两个参数相等则返回 0,如果第一个参数应该位于第二个之后则返回一个正数。以下就是一个简单的比较函数:

  1. function compare(value1, value2) {
  2. if (value1 < value2) {
  3. return -1;
  4. } else if (value1 > value2) {
  5. return 1;
  6. } else {
  7. return 0;
  8. }
  9. }
  10. arr2 = [13, 24, 51, 3];
  11. console.log(arr2.sort(compare)); // [3, 13, 24, 51]

  如果需要通过比较函数产生降序排序的结果,只要交换比较函数返回的值即可

  8、slice()

  slice():返回从原数组中指定开始下标到结束下标之间的项组成的新数组。slice()方法可以接受一或两个参数,即要返回项的起始和结束位置。在只有一个参数的情况下, slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数,该方法返回起始和结束位置之间的项——但不包括结束位置的项。

  1. 1 var arr = [1,3,5,7,9,11];
  2. 2 var arrCopy = arr.slice(1);
  3. 3 var arrCopy2 = arr.slice(1,4);
  4. 4 var arrCopy3 = arr.slice(1,-2);
  5. 5 var arrCopy4 = arr.slice(-4,-1);
  6. 6 console.log(arr); //[1, 3, 5, 7, 9, 11](原数组没变)
  7. 7 console.log(arrCopy); //[3, 5, 7, 9, 11]
  8. 8 console.log(arrCopy2); //[3, 5, 7]
  9. 9 console.log(arrCopy3); //[3, 5, 7]
  10. 10 console.log(arrCopy4); //[5, 7, 9]

  arrCopy只设置了一个参数,也就是起始下标为1,所以返回的数组为下标1(包括下标1)开始到数组最后。 
  arrCopy2设置了两个参数,返回起始下标(包括1)开始到终止下标(不包括4)的子数组。 
  arrCopy3设置了两个参数,终止下标为负数,当出现负数时,将负数加上数组长度的值(6)来替换该位置的数,因此就是从1开始到4(不包括)的子数组。 
  arrCopy4中两个参数都是负数,所以都加上数组长度6转换成正数,因此相当于slice(2,5)。

  9、splice()

  splice():很强大的数组方法,它有很多种用法,可以实现删除、插入和替换。

  删除:可以删除任意数量的项,只需指定 2 个参数:要删除的第一项的位置和要删除的项数。例如, splice(0,2)会删除数组中的前两项。

  插入:可以向指定位置插入任意数量的项,只需提供 3 个参数:起始位置、 0(要删除的项数)和要插入的项。例如,splice(2,0,4,6)会从当前数组的位置 2 开始插入4和6。
  替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,只需指定 3 个参数:起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如,splice (2,1,4,6)会删除当前数组位置 2 的项,然后再从位置 2 开始插入4和6。

  splice()方法始终都会返回一个数组,该数组中包含从原始数组中删除的项,如果没有删除任何项,则返回一个空数组。

  1. 1 var arr = [1,3,5,7,9,11];
  2. 2 var arrRemoved = arr.splice(0,2);
  3. 3 console.log(arr); //[5, 7, 9, 11]
  4. 4 console.log(arrRemoved); //[1, 3]
  5. 5 var arrRemoved2 = arr.splice(2,0,4,6);
  6. 6 console.log(arr); // [5, 7, 4, 6, 9, 11]
  7. 7 console.log(arrRemoved2); // []
  8. 8 var arrRemoved3 = arr.splice(1,1,2,4);
  9. 9 console.log(arr); // [5, 2, 4, 4, 6, 9, 11]
  10. 10 console.log(arrRemoved3); //[7]

  10.indexOf()和 lastIndexOf()

  indexOf():接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中, 从数组的开头(位置 0)开始向后查找。 
  lastIndexOf:接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中, 从数组的末尾开始向前查找。

  这两个方法都返回要查找的项在数组中的位置,或者在没找到的情况下返回1。在比较第一个参数与数组中的每一项时,会使用全等操作符。

  1. 1 var arr = [1,3,5,7,7,5,3,1];
  2. 2 console.log(arr.indexOf(5)); //2
  3. 3 console.log(arr.lastIndexOf(5)); //5
  4. 4 console.log(arr.indexOf(5,2)); //2
  5. 5 console.log(arr.lastIndexOf(5,4)); //2
  6. 6 console.log(arr.indexOf("5")); //-1

   11Array.forEach()

  forEach():对数组进行遍历循环,对数组中的每一项运行给定函数。这个方法没有返回值。参数都是function类型,默认有传参,参数分别为:遍历的数组内容;第对应的数组索引,数组本身。

  1. 1 var arr = [1, 2, 3, 4, 5];
  2. 2 arr.forEach(function(x, index, a){
  3. 3 console.log(x + '|' + index + '|' + (a === arr));
  4. 4 });
  5. 5 // 输出为:
  6. 6 // 1|0|true
  7. 7 // 2|1|true
  8. 8 // 3|2|true
  9. 9 // 4|3|true
  10. 10 // 5|4|true

  12.Array.map()

  map():指“映射”,对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。

  下面代码利用map方法实现数组中每个数求平方。

  1. 1 var arr = [1, 2, 3, 4, 5];
  2. 2 var arr2 = arr.map(function(item){
  3. 3 return item*item;
  4. 4 });
  5. 5 console.log(arr2); //[1, 4, 9, 16, 25]

  13.Array.filter()

  filter():“过滤”功能,数组中的每一项运行给定函数,返回满足过滤条件组成的数组。

  1. 1 var arr = [5,3,6,2,4,8,21,5,2,3,6,4,0,1,5,2,4,1,5,]
  2. 2
  3. 3 var arrs = arr.filter(function(item,i,self){
  4. 4 return self.indexOf(item) === i;
  5. 5 })
  6. 6 console.log(arrs)  //[5, 3, 6, 2, 4, 8, 21, 0, 1]

  去除重复元素依靠的是indexOf总是返回第一个元素的位置,后续的重复元素位置与indexOf返回的位置不相等,因此被filter滤掉了。

  14.Array.every()

  every():判断数组中每一项都是否满足条件,只有所有项都满足条件,才会返回true。

  1. 1 var arr = [1,2,3,4,5,6,7,8,9]
  2. 2
  3. 3 var arr1 = arr.every(function(item){
  4. 4 return item<10
  5. 5 })
  6. 6 console.log(arr1)//true
  7. 7
  8. 8 var arr2 = arr.every(function(item){
  9. 9 return item<5
  10. 10 })
  11. 11 console.log(arr2)//false

  15.Array.some()

  some(): 判断数组中是否有满足条件的一项,只要有一项满足就返回 true 反之 false

  1. 1 var arr = [1,2,3,4,5,6,7]
  2. 2
  3. 3 var arr1 = arr.some(function(item){
  4. 4 return item <1
  5. 5 })
  6. 6 console.log(arr1)//false
  7. 7
  8. 8
  9. 9 var arr2 = arr.some(function(item){
  10. 10 return item<2
  11. 11 })
  12. 12 console.log(arr2)//true

  16.reduce()和 reduceRight()

  这两个方法都会实现迭代数组的所有项,然后构建一个最终返回的值。reduce()方法从数组的第一项开始,逐个遍历到最后。而 reduceRight()则从数组的最后一项开始,向前遍历到第一项。

  这两个方法都接收两个参数:一个在每一项上调用的函数和(可选的)作为归并基础的初始值。

  传给 reduce()和 reduceRight()的函数接收 4 个参数:前一个值、当前值、项的索引和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。第一次迭代发生在数组的第二项上,因此第一个参数是数组的第一项,第二个参数就是数组的第二项。

  下面代码用reduce()实现数组求和,数组一开始加了一个初始值10。

  1. 1 var values = [1,2,3,4,5];
  2. 2 var sum = values.reduceRight(function(prev, cur, index, array){
  3. 3 return prev + cur;
  4. 4 },10);
  5. 5 console.log(sum); //25

javascript 数组 常用方法的更多相关文章

  1. JavaScript 数组 常用方法(二)

    写在前面:续接上篇 JavaScript 数组 常用方法 数组常用方法第二弹来了: some && every 描述: every()与some()方法都是JS中数组的迭代方法. so ...

  2. JavaScript数组常用方法解析和深层次js数组扁平化

    前言 数组作为在开发中常用的集合,除了for循环遍历以外,还有很多内置对象的方法,包括map,以及数组筛选元素filter等. 注:文章结尾处附深层次数组扁平化方法操作. 作为引用数据类型的一种,在处 ...

  3. Javascript数组常用方法

    一.forEach对数组的遍历 二.map返回经过运算的新数组 三.filter返回满足条件的新数组 四.返回数组前后元素运算的结果 五.every遍历数组每项元素是否满足某个条件,全部满足返回tru ...

  4. javascript数组常用方法汇总

    1.join()方法: Array.join()方法将数组中所以元素都转化为字符串链接在一起,返回最后生成的字符串.也可以指定可选的字符串在生成的字符串中来分隔数组的各个元素.如果不指定分隔符,默认使 ...

  5. javascript数组常用方法详解

    1,splice().   array.splice(index,many,list1,list2....)  参数1.index位置 负数为从结尾处算,倒数第一为-1:参数2,many要删除的项目, ...

  6. javascript中数组常用方法总结

    原文:javascript中数组常用方法总结 在javascript的基础编程中,数组是我们最常遇到的,那么数组的一些常用方法也是我们必须要掌握的,下面我们总结一下数组中常用的方法. toString ...

  7. JavaScript数组对象常用方法

    JavaScript数组对象常用方法 方法 形式 返回值 是否改变原数组 描述 concat -items: ConcatArray[] 追加之后的数组 否 连接两个或更多的数组,并返回结果.注意 c ...

  8. 关于javascript数组的定义与其一些常用方法总结

    由于JavaScript是一门宽松的语言,这种宽松可能会带来更加麻烦的事情.比如JavaScript的数组,定义与使用的方式太灵活有时候让人迷惑.下面将JavaScript中关于数组常用的方法.定义之 ...

  9. JavaScript数组方法速查,32个数组的常用方法和属性

    JavaScript数组方法速查手册极简版 http://30ke.cn/doc/js-array-method JavaScript数组方法速查手册极简版中共收了32个数组的常用方法和属性,并根据方 ...

随机推荐

  1. Delphi7中的函数与过程(Function and Procedure)

    1.锁住空间的位置,可以选择Edit--->Lock component ,也可以在窗体设计面板下面找到组件排版功能栏,第二排里面有个带锁的图标,表示组件可以被锁住.点击一下,组件的大小和位置就 ...

  2. tensorflow 模型压缩

    模型压缩 为了将tensorflow深度学习模型部署到移动/嵌入式设备上,我们应该致力于减少模型的内存占用,缩短推断时间,减少耗电.有几种方法可以实现这些要求,如量化.权重剪枝或将大模型提炼成小模型. ...

  3. 【POJ 2449】 Remmarguts' Date

    [题目链接] http://poj.org/problem?id=2449 [算法] A*(启发式搜索) 首先,求第k短路可以用优先队列BFS实现,当T第k次入队时,就求得了第k短路,但是,这种做法的 ...

  4. Spark底层原理简化版

    目录 Spark SQL/DF的执行过程 集群运行部分 Aggregation Join Shuffle Tungsten 内存管理机制 缓存敏感计算(Cacheaware computation) ...

  5. Flink之流处理理论基础

    目录 Introduction to Stateful Stream Processing Traditional Data Infrastructures Stateful Stream Proce ...

  6. BKDRHash 算法 php 版本( 可用于 字符串 hash 为int 转)

    <?php function BKDRHash($str) { $seed = 131; // 31 131 1313 13131 131313 etc.. $hash = 0; $cnt = ...

  7. alipay.trade.refund (统一收单交易退款接口)[支付宝退款]

    首页官网退款的api: https://doc.open.alipay.com/docs/api.htm?spm=a219a.7395905.0.0.UTBitT&docType=4& ...

  8. python 11:range(起始索引,终止索引,步数)(默认情况下步数为1,生成从起始索引,每次增加(终止索引-起始索引)/步数,到终止索引前的数字串)

    squares = [] for value in range(1,11): #第三参数默认为1,生成从1开始,每次增加1步数,到11前的10为止的数字串 square = value ** 2 sq ...

  9. 微信小程序特殊字符转义方法——&转义&amp;等等

    在我编写公司小程序的过程中,有一次在网页端添加了一张图片,结果在小程序端访问失败了,究其原因,竟然是因为该图片名称中有一个“&”符号,网页端添加后,自动转义成了“&”存储到了数据库.当 ...

  10. 小程序开发之搭建WebSocket的WSS环境(Apache+WorkerMan框架+PHP)

    最近公司的一个IoT项目用到了小程序的WSS协议环境,现在把整个的搭建开发过程分享给大家. 这里我们用的是WorkerMan框架,服务器是CentOS,Web服务器是Apache,开发语言是PHP. ...