// 常见数组操作

  const log = console.log.bind(console)

  let color = ['red', 'yellow', 'blue']
  log(color)

1.  判断是否是数组 
  log(Array.isArray(color))
  log(Object.prototype.toString.call(color).slice(8, -1))

2. 拿到数组的值
  log(color.valueOf())

  const messages = ['1', '2', '3'];

  log(messages.toString(), color.toString())


  // push 方法从数组末尾添加元素，返回新数组长度，这一点记住
  // pop 方法从数组末尾删除元素，返回被删除的元素
  // unshift 方法从数组头部添加元素，返回新数组长度
  // shift 方法从数组头部删除元素，返回被删除的元素
  messages.forEach(i => {
    color.push(i)
  })

  log(color)


3.  reverse() 

  // reverse() 数组反转
  log(color.reverse())


4. sort()
  // sort(fn) sort 方法可以传参，不传参的时候数组默认把所有元素先转换为 String 再排序，比较的是 ASCII 码，这个有点坑，
  // 幸好 sort 支持高阶函数，所以我们传入一个自定义的排序函数就可以实现我们正常的排序了，比如对数字排序，我们可以这样写，
  // sort 方法会修改原数组，这是需要注意的地方
  // 默认比较类型是 String
  function compare(x, y) {
    return x - y
  }

  color.sort(compare)
  log(color); // ["1", "2", "3", "blue", "yellow", "red"]

5. concat()
  // concat() 传入元素或者数组都可以
  log(color.concat(messages)) //["1", "2", "3", "blue", "yellow", "red", "1", "2", "3"]


6. slice()
  // slice() 常见截取数组的元素，返回的是一个新数组，不更改原数组，对应 String 中的 subString()
  // 如果不给slice 传入参数，则默认截取所有元素，所以我们可以很容易的复制一个数组
  // slice 可以传入负数，表示从后往前截取
  let arrCopy = color.slice()
  log(arrCopy) // ["1", "2", "3", "blue", "yellow", "red"]

  let arr = color.slice(3, -1)
  log(arr) // ["blue", "yellow"]

7. join()
  // join() 把数组元素合并为一个字符串，如果不带参数，默认用逗号分隔
  log(color.join())
  log(color.join('-'))


8. splice()
  // splice() 算是一个万能的方法对于数组的操作，根据参数不同可以实现从某处起删除多少个元素，
  // 第三个参数往后都是需要添加到末尾的元素，返回值是被删除掉的元素组成的数组
  log(color.splice(2, 3, 'hhh', 'sumin', 'test'), color)  
  // (3) ["3", "blue", "yellow"] (6) ["1", "2", "hhh", "sumin", "test", "red"]


9. indexOf()
  // indexOf() && lastIndexOf()
  // 二者都是验证数组中是否含有某个元素，返回匹配到的元素在数组中所在的位置，如果没有，则返回 -1，
  // 不同的是 indexOf 是从前往后，lastIndexOf 则相反
  log(color.indexOf('sumin'), color.lastIndexOf('ez')) // 3 -1


10. every(fn)
  // every(fn) && some(fn)
  // every and some 都是针对数组每一项运算结果判定，不同的是 every 要求必须所有的都为 true 才能返回 true，
  // some 则只要有一项为 true 则返回 true，并且剩余的元素不会再执行检测
  const num = [1, 2, 3, 4, 5, 4, 3, 2, 1]
  const every = num.every((item, index, array) => {
    return item > 2
  })
  log(every) // false

  const some = num.some((item, index, array) => {
    return item > 2
  })
  log(some) // true


11.  filter(fn)
  // filter(fn) 过滤方法 可以传入高阶函数 ，返回满足条件的元素组成的新数组，不改变原数组
  const filter = num.filter((item, index, array) => {
    return item > 2
  })
  log(filter) // [3, 4, 5, 4, 3]


12. map()
  // map() 对数组的每一项进行计算等处理，返回处理结果组成的数组，其他和 forEach 类似，只不过 forEach 没有返回值，
  // 这里注意与数据类型 Map 进行区分，不要混为一谈
  const map = num.map((item, index, array) => {
    return item > 2
  })
  log(map) // [false, false, true, true, true, true, true, false, false]


  // 顺带了解一下 ES6 的数据类型 Map，
  // 注意: JavaScript 中规定 Map 的数据结构必须是字符串键值对，
  // 类似 Java 中的 Map，新增的数据类型 Map 是为了优化查询速度的
  const m = new Map([['a', 12], ['b', 34], ['c', 67]])
  log(m.get('a')) // 12


13. forEach() 
  // forEach() 遍历数组,与 for 循环类似，不过区别在于 forEach 无法做到按指定的顺序遍历，对于稀疏数组使用 for 循环效率更好

14. reduce(fn)
  // reduce(fn) 累加求和
  // 参数  [ 前一个元素 | 当前元素，从1开始 | 后一个元素的序列，从1开始计数 | 表示该数组 ]
  // 对于 reduce 的很多用法还不是很熟悉，需要多加研究
  const reduce = num.reduce((pre, cur, index, array) => {
    return pre + cur
  })
  log(reduce) // 25

  //每一次迭代之后的结果分别为
  // [3, 3, 4, 5, 4, 3, 2, 1]
  // [6, 4, 5, 4, 3, 2, 1]
  // [10, 5, 4, 3, 2, 1]
  // [15, 4, 3, 2, 1]
  // [19, 3, 2, 1]
  // [22, 2, 1]
  // [24, 1]
  // 25

在学习JS的道路上，数组是一个很重要的部分，数组的API很多，也很容易混淆，最近刷题的时候总是无法很准确的判断用哪个API或者哪个更精妙，所以我今天总结一下。主要参考廖雪峰老师和MDN文档~

arry.push()⌗

把一个元素增加到数组的末尾，返回值为新数组的长度arry.length，示例：

let arry = [2, 9, 5]
let returnValue = arry.push(4)
console.log(returnValue) // 4
console.log(arry) // [2, 9, 5, 4]

arry.pop()⌗

删除数组中最后一个元素，返回值为删除的元素，示例：

let arry = [2, 9, 5]
let returnValue = arry.pop()
console.log(returnValue) // 5
console.log(arry) // [2, 9]

arry.unshift()⌗

与push方法类似，区别在于它是在数组的前面添加元素，返回值为新数组的长度arry.length，示例：

let arry = [2, 9, 5]
let returnValue = arry.unshift(4)
console.log(returnValue) // 4
console.log(arry) // [4, 2, 9, 5]

arry.shift()⌗

与pop方法类似，区别在于它是删除数组前面的元素，返回值依然是被删除的元素，示例：

let arry = [2, 9, 5]
let returnValue = arry.shift()
console.log(returnValue) // 2
console.log(arry) // [9, 5]

由此可知，使用push和shift组合可以实现数据的‘先进先出’当然也可以使用unshift和pop⌗

arry.indexOf()⌗

Array可以通过indexOf()来搜索一个指定的元素的位置，示例：

let arr = [10, 20, '30', 'xyz'];
arr.indexOf(10); // 元素10的索引为0
arr.indexOf(20); // 元素20的索引为1
arr.indexOf(30); // 元素30没有找到，返回-1
arr.indexOf('30'); // 元素'30'的索引为2

arry.reverse()⌗

把数组反向排序，这里要注意它会改变原来的数组，而不会创建新的数组，示例：

let arry = [2, 9, 5]
arry.reverse()
console.log(arry) // [ 5, 9, 2 ]

arry.sort()⌗

对数组进行排序，可接受参数，参数必须是函数，如果不没有参数则是按照字符编码的顺序进行排序，示例：

let arry = [10, 5, 40, 1000]
console.log(arry.sort()) // [ 10, 1000, 40, 5 ]

如果数字想要按大小排列，可写入参数：

let arr = [3, 1, 7]
console.log(arr.sort((a, b) => a - b)) // [ 1, 3, 7 ]

arry.forEach(item, index)与arry.map(item, index)⌗

两者都是对数组遍历，index表示数组索引，不是必须的参数区别在于map方法会返回一个新的数组，具体区别参考MDN，示例：

let arry = [1, 5, 10, 15];
let arry1 = arry.map( x => x + 2);
console.log(arry1) // [ 3, 7, 12, 17 ]

arry.some()⌗

用于检测数组中的元素是否满足指定条件,参数也是函数如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。如果没有满足条件的元素，则返回false。

let arry = [1, 5, 10, 15];
console.log(arry.some(item => item > 10)) // true

arry.every()⌗

用于检测数组中的所有元素是否满足指定条件,只有当数组中灭一个元素都满足条件时，表达式返回true , 否则返回false，示例：

let arry = [5, 10, 15];
console.log(arry.every(item => item > 2)) // true

arry.filter()⌗

它创建一个新的数组，原数组不变，新数组中的元素是通过检查指定数组中符合条件的所有元素，示例：

let arry = [1, 5, 10, 15];
let arry1 = arry.filter(item => item > 5)
console.log(arry) // [ 1, 5, 10, 15 ]
console.log(arry1) // [ 10, 15 ]

arry.join()⌗

join()方法是一个非常实用的方法，它把当前Array的每个元素都用指定的字符串连接起来，然后返回连接后的字符串，示例：

let arr = ['A', 'B', 'C', 1, 2, 3];
arr.join('-'); // 'A-B-C-1-2-3'

arry.splice()⌗

splice()方法是修改Array的“万能方法”，它可以从指定的索引开始删除若干元素，然后再从该位置添加若干元素，示例：

let arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
// 从索引2开始删除3个元素,然后再添加两个元素:
arr.splice(2, 3, 'Google', 'Facebook'); // 返回删除的元素 ['Yahoo', 'AOL', 'Excite']
arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']
// 只删除,不添加:
arr.splice(2, 2); // ['Google', 'Facebook']
arr; // ['Microsoft', 'Apple', 'Oracle']
// 只添加,不删除:
arr.splice(2, 0, 'Google', 'Facebook'); // 返回[],因为没有删除任何元素
arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']

arry.slice()⌗

slice()就是对应String的substring()版本，它截取Array的部分元素，然后返回一个新的Array，示例：

let arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
arr.slice(0, 3); // 从索引0开始，到索引3结束，但不包括索引3: ['A', 'B', 'C']
arr.slice(3); // 从索引3开始到结束: ['D', 'E', 'F', 'G']

arry.concat()⌗

用于连接两个或多个数组，返回值为连接后的新数组，原数组不变，示例：

let arry1 = [1, 2, 3]
let arry2 = [4, 5, 6]
arry1.concat(arry2)
console.log(arry1.concat(arry2)) // [ 1, 2, 3, 4, 5, 6 ]

arry.reduce()⌗

reduce() 方法对累加器和数组中的每个元素（从左到右）应用一个函数，将其减少为单个值，示例：

var total = [0, 1, 2, 3].reduce(function(sum, value) {
  return sum + value;
}, 0);
// total is 6

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
  return a.concat(b);
}, []);
// flattened is [0, 1, 2, 3, 4, 5]

arry.fill()⌗

fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素，示例：

//语法
arr.fill(value) 
arr.fill(value, start) 
arr.fill(value, start, end)
-----------------------------------------

[1, 2, 3].fill(4)            // [4, 4, 4]
[1, 2, 3].fill(4, 1)         // [1, 4, 4]
[1, 2, 3].fill(4, 1, 2)      // [1, 4, 3]
[1, 2, 3].fill(4, 1, 1)      // [1, 2, 3]
[1, 2, 3].fill(4, -3, -2)    // [4, 2, 3]
[1, 2, 3].fill(4, NaN, NaN)  // [1, 2, 3]
Array(3).fill(4);            // [4, 4, 4]
[].fill.call({length: 3}, 4) // {0: 4, 1: 4, 2: 4, length: 3}

arry.find()⌗

find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined，示例：

function isBigEnough(element) {
  return element >= 15;
}

[12, 5, 8, 130, 44].find(isBigEnough); // 130

arry.from()⌗

arry.from() 方法从一个类似数组或可迭代对象中创建一个新的数组实例，示例：

const bar = ["a", "b", "c"];
Array.from(bar);
// ["a", "b", "c"]

Array.from('foo');
// ["f", "o", "o"]

这些基本上都是常用的数组操作的API，有些不常用的API之所以写出来因为刷题遇到过特别的效果，如果有错误欢迎提出，希望大家多多点赞~