JavaScript常用数组方法记录

start：日常开发常用的一些数组方法，罗列一遍加强记忆

0、Array.isArray()

• 用于检测数据类型是否为Array

Array.isArray([1,2,3]) 	// true
Array.isArray({1,2,3})	// false

1、toString()

• 不改变原数组
• 将数组转换为用逗号隔开的字符串

let array = ['中国','美国','日本','英国','德国'];
let val = array.toString();
// val : 中国，美国，日本，英国，德国

2、join()

• 不改变原数组
• 将数组转换为连续字符串，可以自定义分隔符

let array = ['red','yellow','green','black','link'];
let val = array.join(" \ ");
// val : red\yellow\green\black\link

3、push()

• 原数组改变
• 向数组末尾添加内容

let array = ["Banana", "Orange", "Apple", "Mango"];
array.push("china");
// array = ["Banana", "Orange", "Apple", "Mango","china"]

4、pop()

• 原数组改变
• 删除数组最后一个元素

let array = ["Banana", "Orange", "Apple", "Mango"];
array.pop();
// array = ["Banana", "Orange", "Apple"]

5、shift()

• 原数组改变
• 向数组开头添加元素

let array = ["Banana", "Orange", "Apple", "Mango"];
array.shift("jappan");
// array = ["jappan","Banana", "Orange", "Apple", "Mango"]

6、unshift()

• 原数组改变
• 删除数组第一个元素

let array = ["Banana", "Orange", "Apple", "Mango"];
array.unshift();
// array = ["Orange", "Apple", "Mango"]

7、length

• 数组长度
• length 属性提供了向数组追加新元素的简易方法：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0] = "Kiwi";     
// 把 fruits 的第一个元素改为 "Kiwi"


var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";        
// 向 fruits 追加 "Kiwi"

8、splice(index,count,value)

• 原数组改变
• **添加或删除数组中的指定元素,添加/删除/替换 **
• 从索引为index处删除count个元素，插入value

1、第一个参数为一个整数，用来指定添加/删除元素的位置（下标），可为负数，从数组末尾开始  必选参数
2、第二个参数为需要删除元素的数量，可设置为0，不删除     可选参数
3、第三个开始后面的所有参数为需要添加的内容            可选参数

let arr = [1,2,3,4,5];
// 删除
arr.splice(0,1) // [2,3,4,5]   删除指定下标0开始的1个元素
arr.splice(2,2) // [1,2,5]     删除指定下标2开始的2个参数

// 添加/替换
arr.splice(1,0,9) // [1,9,2,3,4,5]  不删除元素，并向指定下标1位置添加元素9
arr.splice(2,1,6) // [1,2,6,4,5]    删除指定下标开始的1个元素，并向当前位置添加元素6 （相当于把3替换为6）

9、reverse()

• 改变原数组
• 数组反转

let arr = [1,2,3]
arr.reverse()
// [3,2,1]

10、sort()

• 改变原数组
• 数组排序
• 默认按字母排序为升序
• 如遇到非字符串字符，先调用toString()方法将元素转换为字符串，在进行字符串排序
• 参数为规定排序的比较函数（可选项）

let arr = ["A", "C", "B", "E", "D"]
arr.sort()  // ['A','B','C','D','E']

let arr1 = [1, 0, 5, 4, 9, 45, 78, 6, 14, 2];
arr1.sort((a,b) => a - b ) // 升序
arr1.sort((a,b) => b - a ) // 降序

// 按年龄排序，若年龄相同，就女士(sex属性为0) 排在男士(sex属性为1)之前
let arr4 = [
  { age: 18, sex: 0 },
  { age: 19, sex: 0 },
  { age: 20, sex: 0 },
  { age: 18, sex: 1 },
  { age: 19, sex: 1 },
]

arr4.sort((a, b) => {
  if (a.age == b.age) {
    return a.sex - b.sex // 如果年龄相同按照性别排序
  } else {
    return a.age - b.age // 其他依然按照年龄排序
  }
})

// 结果
[
  { age: 18, sex: 0 },
  { age: 18, sex: 1 },
  { age: 19, sex: 0 },
  { age: 19, sex: 1 },
  { age: 20, sex: 0 }
]

11、splice(start,end)

• 不改变原数组，返回新数组
• 截取数组索引

1、第一个参数位开始的索引（必填）
2、第二个参数位结束的索引（可选）  （截取不包括第二个索引）

let arr5 = [1,2,3,4,5]
let result = arr5.splice(1,3)  
console.log(result) // [2,3]
console.log(arr5)   // [1,2,3,4,5]     不改变原数组

// more
arr5.slice(0) // 返回[1,2,3,4,5]  从开头截取到末尾
arr5.slice(1) // 返回[2,3,4,5]    只有一个参数并且大于0，从该索引截取到末尾
arr5.slice(-2)// 返回[4,5]        只有一个参数并且小于0，从倒数start位截取到末尾
arr5.slice(2,4) // 返回[3,4]	   	两位大于0的参数，从start位截取到end的前一位，不包括end位索引
arr5.slice(-1,1)// 返回[]          不符合规则，返回空数组
arr5.slice(1,-2)// 返回[2,3]     两个参数一正一负，从正数start位开始截取到倒数end位，不包括end位索引
arr5.slice(-4,-2)// 返回[2,3]    两个参数都为负数，倒数start位截取至倒数end位，不包含end位索引

12、indexOf(value)

• 不改变原数组

1、从索引0开始检索，检查数组中是否包含value，有则返回匹配到的第一个索引，没有则返回-1

let arr = ['a', 'b', 'c', 'd', 'e', 'f', 'e', 'e', 'i']

arr.indexOf(e)        // 4    有的话匹配该元素第一个索引
arr.indexOf(g)        // -1   没有返回-1
console.log(arr)      // ['a', 'b', 'c', 'd', 'e', 'f', 'e', 'e', 'i']   不改变原数组


//    利用indexOf()方法实现数组去重
let arr1 = []
for(let i = 0; i < arr.length; i++){
    if(arr1.indexOf(arr[i]) < 0){
        arr1.push(arr[i])
    }
}

console.log(arr1)  // ['a', 'b', 'c', 'd', 'e', 'f', 'i']

13、lastIndexOf(value)

• 不改变原数组

1、从最后的索引开始，检查数组是否包含value，有的话返回匹配到的第一个索引（也可以说是返回最后一个索引），没有返回-1
2、语法与indexOf相同
3、也可以用该方法实现数组去重

14、concat（value）

• 不改变原数组
• 将数组/值连接成新的数组

let a = ['a','b'] , b = [1,2], c = ['中国','小日本']

a.concat(b,c).sort()   //  [ 1, 2, 'a', 'b', '中国', '小日本' ]