js数组方法

作者: 郭海杰 | 来源:发表于2020-03-04 15:05 被阅读0次

数组（Array）<迭代器>
js基础了解
js 数组
js关于数组的方法汇总
封装常用数组操作函数
JS数组常用方法
JS如何判断一个数组是否为空、是否含有某个值
数组进阶
数组常用方法
js 数组操作探究

1.join()和split()
join()可选择一个参数（数组转字符串）

var arr = ["a", "b", "c", "e", "f"]
var res = arr.join() // 
var res1 = arr.join("~") // 
console.log(res)//a,b,c,e,f
console.log(res1)//a~b~c~e~f
console.log(arr)// ["a", "b", "c", "e"]

split()两个参数：1.必须选择一个参数 2.可选。该参数可指定返回的数组的最大长度。
将字符串以指定的分隔符分割成数组（字符串转数组）

var str = "a,b,c,e,f"
var str1 = "a~b~c~e~f"
var res = str.split(",",3) // 
var res1 = str1.split("~") // 
console.log(res)//["a", "b", "c"]
console.log(res1)//["a", "b", "c", "e", "f"]

2.push()和pop()
push(): 可以接收任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度。

var arr = ["a","b","c"]
var res = arr.push("e","f")//5
console.log(arr)//["a", "b", "c", "e", "f"]

pop()：数组末尾移除最后一项，减少数组的 length 值，然后返回移除的项。

var arr = ["a", "b", "c", "e", "f"]
var res = arr.pop() // f
console.log(arr)// ["a", "b", "c", "e"]

3.foreach()和map()
foreach()参数自定义可以有三个参数如下

var arr = ["a", "b", "c", "e", "f"]
arr.forEach((item,index,a)=>{
        console.log(item);//数组中的每一项
        console.log(index);//数组中每一项的下表
         console.log(a);//数组本身
} )

map()参数自定义可以有三个参数如下
这个方法需要在处理每一项item之后return返回参数

var arr = ["a", "b", "c", "e", "f"]
var res =  arr.map((item,index,a)=>{
        console.log(item);//数组中的每一项
        console.log(index);//数组中每一项的下表
         console.log(a);//数组本身
        if(item=="b"){
              return "B"
        }else{
              return item
        }
} )
console.log("arr:",arr);//arr:["a", "b", "c", "e", "f"]
console.log("res:",res);res:["a", "B", "c", "e", "f"]

4.reduce()和reduceRight()
reduce()参数自定义可以有四个参数如下
这个方法需要在处理每一项item之后return返回参数
（reduceRight()的循环从最后一个开始，其他相同）
init可选初始值

var arr = ["a", "b", "c", "e", "f"]
var init = "初始值"
arr.reduce((prev,item,index,a)=>{
        console.log(prev)//数组中的前一项的值
        console.log(item);//数组中的每一项的值
        console.log(index);//数组中当前项的下标
        console.log(a);//数组本身
        return item
},init)

5.sort()
sort()方法比较的是把数组中每一项转字符串后的值

var arr = ["f", "e", "c", "b", "a"]
var res = arr.sort() 
console.log("arr:",arr);//arr:["a", "b", "c", "e", "f"]
console.log("res:",res);res:["a", "b", "c", "e", "f"]

sort()方法可以添加一个比较函数用来排序
这个函数可以自定义

function compare(value1, value2) {
if (value1 < value2) {
return -1;
} else if (value1 > value2) {
return 1;
} else {
return 0;
}
}
//var arr = [7,13,5,12,6]
var arr = ["7","13","5","12","6"]//对字符串无效
var res = arr.sort(compare)
console.log(res)//[5, 6, 7, 12, 13]
console.log(arr)// [5, 6, 7, 12, 13]

对字符串有效


function compare(value1,value2) {
  var value1 =  Number(value1)
  var value2 = Number(value2)
  if (value1 < value2) {
  return -1;
  } else if (value1 > value2) {
  return 1;
  } else {
  return 0;
  }
  }
  //var arr = [7,13,5,12,6]
  var arr = ["7","13","5","12","6"]//对字符串有效
  var res = arr.sort(compare)
  console.log(res)// ["5", "6", "7", "12", "13"]//返回的还是字符串类型
  console.log(arr)//  ["5", "6", "7", "12", "13"]

6.shift()和unshift()
shift()：删除原数组第一项，并返回删除元素的值；如果数组为空则返回undefined 。

var arr = ["a", "b", "c", "e", "f"]
var res = arr.shift() 
console.log(res)//a
console.log(arr)// [ "b", "c", "e","f",]

unshift:将参数添加到原数组开头，并返回数组的长度。

var arr = ["a", "b", "c", "e", "f"]
var res = arr.unshift("1","a") 
console.log(res)//6
console.log(arr)//["1", "a", "b", "c", "e", "f"]

7.reserver()
reserver()翻转数组中的顺序

var arr = ["a", "b", "c", "e", "f"]
var res = arr.reserver()
console.log(res)//["f", "e", "c", "b", "a"]
console.log(arr)//["f", "e", "c", "b", "a"]

8.concat()
concat() ：将参数添加到原数组中。这个方法会先创建当前数组一个副本，然后将接收到的参数添加到这个副本的末尾，最后返回新构建的数组。
在没有给 concat()方法传递参数的情况下，它只是复制当前数组并返回副本。

var arr = ["a", "b", "c", "e","d", "f"]
var res = arr.concat("g",["h","i"])
console.log(arr)// ["a", "b", "c", "d","e", "f"]
console.log(res)//["a", "b", "c", "e", "d","f", "g", "h", "i"]
//多维数组
var arr = ["a", "b", "c", "d",["e", "f"]]
var res = arr.concat("g",["h",["i","j"]])
console.log(arr)// ["a", "b", "c", "e", "f"]
console.log(res)//[ "a", "b", "c", ["e", "f"] ,"g","h",["i","j"] ]

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

var arr = ["a", "b", "c", "e", "f","g"]
var arr0 = arr.slice(1);
var arr1 = arr.slice(1,4);
var arr2 = arr.slice(1,-2);
var arr3 = arr.slice(-4,-1);
console.log(arr); //["a", "b", "c", "e", "f", "g"]
console.log(arr0); //["b", "c", "e", "f", "g"]
console.log(arr1); // ["b", "c", "e"]
console.log(arr2); // ["b", "c", "e"]   
console.log(arr3); // ["c", "e", "f"]

10.splice()
splice():可以实现删除、插入和替换方法，并且始终都会返回一个数组，该数组中包含从原始数组中删除的项，如果没有删除任何项，则返回一个空数组。
删除：可以删除任意数量的项，只需指定 2 个参数：要删除的第一项的位置和要删除的项数。

var arr = ["a", "b", "c", "e", "f","g"]
var res = arr.splice(1,5)
console.log(res); // ["b", "c", "e", "f", "g"]
console.log(arr); // ["a"]

插入：只需提供 3 个参数：起始位置、 0（要删除的项数）和要插入的项。

var arr = ["a", "b", "c", "e", "f","g"]
var res =  arr.splice(3,0,"h","i")
console.log(arr); // []
console.log(arr); // ["a", "b", "c", "h", "i", "e", "f", "g"]

替换：只需指定 3 个参数：起始位置、要删除的项数和要插入的任意数量的项。
(插入的项数不必与删除的项数相等)
并且返回删除的项

var arr = ["a", "b", "c", "d","e", "f","g"]
 var res = arr.splice(3,2,"h","i")
console.log(res ); // ["d", "e"]
console.log(arr); // ["a", "b", "c", "h", "i", "f", "g"]

11.indexOf()和lastIndexOf()
indexOf()需要提供两个参数：
从数组的开头（位置 0）开始向后查找。
1.要查找的项
2.（可选的）表示查找起点位置的索引。其中，从数组的开头（位置 0）开始向后查找。
lastIndexOf()也需要提供两个参数（同上），但是从数组的结尾开始向前查找。

var arr = ["a", "b", "c", "d","e", "f","g"]
 var res = arr.indexOf("c")
 var res1 = arr.indexOf("d",2)
 var res2 = arr.indexOf("d",4)
 var res3 = arr.indexOf("d",5)
console.log(res); // 2
console.log(res1); // 3
console.log(res2); // -1
console.log(res3); // -1 表示没有查找到
console.log(arr); // ["a", "b", "c", "d", "e", "f", "g"]

12.filter()
filter()函数满足过滤条件组成的数组
注意：不会对空数组进行检测。
注意：不会改变原始数组。

var arr = ["a", "b", "c", "d","e", "f","g"]

var res = arr.filter((item,index,a)=>{
        console.log(item);//数组中的每一项
        console.log(index);//数组中每一项的下表
         console.log(a);//数组本身
         //console.log(this);//这个第四个参数不明白具体是做什么的
        return item>"c"?true:false
} ,{  x:"这是X的值"})
console.log(arr); // ["a", "b", "c", "d", "e", "f", "g"]//不改变原来的数组
console.log(res); // ["d", "e", "f", "g"]

13.every()和some()
every()：判断数组中每一项都是否满足条件，只有所有项都满足条件，才会返回true。

var arr = [ "b", "c", "d","e", "f","g"]
var res = arr.every((item,index,a)=>{
        console.log(item);//数组中的每一项
        console.log(index);//数组中每一项的下表
         console.log(a);//数组本身
        return item>"a"
} ,{  x:"这是X的值"})
console.log(arr); // ["a", "b", "c", "d", "e", "f", "g"]//不改变原来的数组
console.log(res); // true

some()判断数组中是否存在满足条件的项，只要有一项满足条件，就会返回true。

var arr = [ "b", "c", "d","e", "f","g"]
var res = arr.some((item,index,a)=>{
        console.log(item);//数组中的每一项
        console.log(index);//数组中每一项的下表
         console.log(a);//数组本身
        return item>"f"
} ,{  x:"这是X的值"})
console.log(arr); // ["a", "b", "c", "d", "e", "f", "g"]//不改变原来的数组
console.log(res); // true

for in和for of

  var arr = [ "b", "c", "d","e", "f","g"]
  for(let item in arr){ // item为index,数组索引
      console.log(item); 
  }

  var arr = [{a:"1"},{b:"2"},{c:"3"}]
  for(let item in arr){ // item为index,数组索引
      console.log(item); 
  }

  var arr =  [ "b", "c", "d","e", "f","g"]
   for(let item of arr){ // item为value
     console.log(item); //a遍历为每一项的键
   }

  var arr = [{a:"1"},{b:"2"},{c:"3"}]
   for(let item of arr){ // item为value
     console.log(item); //{a: "1"}遍历为每一项
   }

数组（Array）<迭代器>
一、Js数组迭代器方法主要介绍js数组中的forEach,every,some,filter,map迭代器方法 ...
js基础了解
js数组常用遍历方法使用： js数组常用操作方法使用：基本逻辑运算：基本字符串操作方法：
js 数组
js 中数组的长度发生改变，数组就真的发生改变，快速清空数组就让数组长度为0js 数组的方法
js关于数组的方法汇总
js关于数组的方法汇总
封装常用数组操作函数
1. 数组扁平化方法一 : 递归迭代数组方法二 : 通过js原生 falt方法展开数组方法三通过正则...
JS数组常用方法
@[toc] JS数组方法数组是 js 中最常用到的数据集合，其内置的方法有很多，熟练掌握这些方法，可以有效...
JS如何判断一个数组是否为空、是否含有某个值
一、js判断数组是否为空方法一： arr.length 二、js判断数组是否含有某个值方法一： arr.ind...
数组进阶
JS数组奇巧淫技数组进阶方法~ 数组使用方法比较多。什么时候使用什么方法，用对方法，不用对很大的原因就是数组方法...
数组常用方法
数组常用方法一、js数组常用方法： 1、join() Array.join() 方法将数组中所有元素都转换成字...
js 数组操作探究
有空闲时间了, 深入的研究一下js 中的数组方法 js中的数组方法首先是会改变原数组的方法: shift un...