JavaScript基础--数组方法和ES6数组方法

1、instanceof

该操作符使用来检测一个变量是不是Array数组的实例。缺点就是只能有一个全局执行环境下

var arr = [1, 2, 3];
console.log(arr instanceof Array)  // true

2、Array.isArray

也是确定一个变量是不是数组。

var arr = [1, 2, 3]
console.log(Array.isArray(arr)) // true

3、valueOf()、toString()和join()

toString是将数组中每一项以字符串的形式拼接成一个以逗号分割的字符串

valueOf则返回还是数组本身

join则可以使用不同的分隔符来分割数组返回字符串

var str = ["red", "green", "blue"];
console.log(str.toString())  //"red,green,blue"
console.log(str.valueOf())  //["red", "green", "blue"]
console.log(str.join("/"))  //"red/green/blue"

4、push()和pop()

这两种方法都是属于栈方法(栈就是一种LIFO先进先出的数据结构)。

push是想数组的末尾添加数据，并返回新数组的长度

pop是删除数组的最后一项，并返回被删除项

var arr = [];
console.log(arr.push("red", "green"))   // 2
console.log(arr)  //["red", "green"]
console.log(arr.pop())  //"green"
console.log(arr)   //["red"]

5、shift()和unshift()

unshift是想数组的第一项添加数据，并返回新数组的长度

shift是删除数组的第一项数据，并返回被删除的数据

var arr = ["red", "green", "yellow"];
console.log(arr.shift()); //"red"

var arr = ["red", "green", "yellow"];
console.log(arr.unshift("blue"))  //3

6、reverse()和sort()

reverse用来将数组中的数据反转，返回新数组

sort按照升序的方法来排列数组(但是不是比较大小而是通过toString转为字符串在进行比较，有可能出现不一样的排序)，返回新数组

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

var arr1 = [1, 10, 15, 13, 5];
console.log(arr1.sort());// [1, 10, 13, 15, 5]

对sort方法的改进可以传递一个比较函数作为参数

function compare(val1, val2) {
      if(val1 < val2) {
        return -1
      } else if(val1 > val2) {
        return 1
      } else {
        return 0
      }
    } 
console.log(arr1.sort(compare)) //[1, 5, 10, 13, 15]

7、concat()、splice()和slice()

concat方法是用来合并多个数组，返回新的数组

splice方法是用来删除数组项或者插入或者替换，改变原数组

     删除：参数一表示开始删除的索引位置参数二表示要删除的长度，返回被删除项的数组

     插入：参数一表示要插入的起始位置索引，参数为0，参数三要插入的数据，返回一个空数组

     替换：蚕食一表示起始位置，参数二表示要删除的项数，参数三表示要插入任意数量的项，返回被删除项的数组

slice方法是用来切割数组，返回一个新数组，但是不会影响到原数组，不包含最后一项

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

    var arr1 = [1, 2, 3, 4];
    console.log(arr1.splice(0, 2))  //[1, 2]
    console.log(arr1)  //[3, 4]
    var arr2 = [1, 2, 3, 4];
    console.log(arr2.splice(1, 0, 1.5))  // []
    console.log(arr2)  // [1, 1.5, 2, 3, 4]
    var arr3 = [1, 2, 3, 4];
    console.log(arr3.splice(1, 1, 2.5, 3.0)) // [2]
    console.log(arr3)  //[1, 2.5, 3.0, 3, 4]

    var colors = ["red", "green", "yellow", "blue", "pink"];
    console.log(colors.slice(1, 2))  //["green"]
    console.log(colors)  //["red", "green", "yellow", "blue", "pink"];

8、indexOf()和lastIndexOf()

这个两个方法都是用来查找数组的符合条件第一项，如果没有则返回-1，有则返回索引，是按照全等进行查找(===)

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

9、every()、some()、filter()、map()和forEach

参数有三个：数组项的值、该项在数组的位置和数组本身

every：对数组的每一项都运行给定的函数，如果该函数对每一项返回true则返回true

some：对数组的每一项都运行给定的函数，如果该函数任意一项返回true则返回true

forEach：对数组每一项运行给定函数，没有返回值

map：对数组的每一项都运行给定的函数，返回值组成一个数组

filter：对数组的每一项都运行给定的函数，返回该函数为true组成的数组

10、reduce()和reduceRight()

两个方法都有四个参数：前一项的值、当前项的值、项的索引和数组对象(一般前一项的值是第一项的值)

    var arr = [1, 2, 3, 4, 5];
    var sum = arr.reduce(function(pre, cur, index, arr) {
      return pre + cur  
    })
    console.log(sum)  // 15

ES6新增的数组方法

1、扩展运算符(...)

可以用来就数组分割成参数序列

let arr = [1, 2, 3]
console.log(...arr)  // "1, 2, 3"

还可以用在函数调用

function add(a, b) {
    return a + b
}
const num = [1, 2]
console.log(add(...num))  // 3

2、代替运算符apply方法

求数组最大值

let arr = [1, 3, 5, 6, 4, 2];
console.log(Math.max(...arr))  // 6

var arr = [1, 3, 6, 4, 5, 2]
console.log(Math.max.apply(null, arr))  // 6

将数组添加到另一个数组中

let arr1 = [1, 2, 3]
let arr2 = [4, 5, 6]
arr1.push(...arr2)  
console.log(arr1)  // [1, 2, 3, 4, 5, 6]

将字符串真正的数组

console.log(..."hello")  //["h","e","l","l","o"]

实现了 Iterator 接口的对象

任何 Iterator 接口的对象，都可以用扩展运算符转为真正的数组