高階函數(shù)

1、map/reduce
map:如果我們有一個(gè)函數(shù)f(x)=x2，要把這個(gè)函數(shù)作用在一個(gè)數(shù)組[1,2,3,4,6,5]上，就可以使用map實(shí)現(xiàn)。

    'use strict';
    
    function pow(x) {
      return x * x
    }
    
    var arr = [1,2,3,4]
    var results = arr.map(pow) 
    // [1,4,9,16]
    

map() 作為高階函數(shù)，實(shí)質(zhì)是對數(shù)組中的每一項(xiàng)做計(jì)算，然后重新保存到新的數(shù)組中。

reduce:和map一樣也是作用在數(shù)組的每一項(xiàng)上，但是函數(shù)必須接受2個(gè)參數(shù)，將上一個(gè)元素的計(jì)算結(jié)果累計(jì)到下一個(gè)元素中。效果其實(shí)就是：

    [x1,x2,x3,x4].reduce(f) = f(f(f(x1,x2),x3),x3)

對于數(shù)組：

    var arr = [1,2,3,7,4]
    function sum(x,y) {
      return x + y
    }
    arr.reduce(sum)
    // 17
    function h(x,y){
      return x * y
    }
    arr.reduce(h)
    //  168

2、filter
filter也是一個(gè)常用的操作，它用于把Array的某些元素過濾掉，然后返回剩下的元素。
和map()類似，Array的filter()也接收一個(gè)函數(shù)。和map()不同的是，filter()把傳入的函數(shù)依次作用于每個(gè)元素，然后根據(jù)返回值是true還是false決定保留還是丟棄該元素。
例如，在一個(gè)Array中，刪掉偶數(shù)，只保留奇數(shù)，可以這么寫：

    var arr = [1, 2, 4, 5, 6, 9, 10, 15];
    var r = arr.filter(function (x) {
        return x % 2 !== 0;
    });
    // [1, 5, 9, 15]

filter()接收回調(diào)函數(shù)可以有多個(gè)參數(shù)，f(element, index, self){}

element: 當(dāng)前元素

index: 當(dāng)前元素索引值

self: 數(shù)組本身

filter去重

    'use strict'
    
    var
    r,
    arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry'];
    
    r = arr.filter(function (element, index, self) {
        return self.indexOf(element) === index;
    });
    
    console.log(r);

3、sort()
算法排序：對于兩個(gè)元素x和y，如果認(rèn)為x < y，則返回-1，如果認(rèn)為x == y，則返回0，如果認(rèn)為x > y，則返回1
如果對數(shù)組直接進(jìn)行排序，發(fā)現(xiàn)結(jié)果：

    // 看上去正常的結(jié)果:
    ['Google', 'Apple', 'Microsoft'].sort(); // ['Apple', 'Google', 'Microsoft'];
    
    // apple排在了最后:
    ['Google', 'apple', 'Microsoft'].sort(); // ['Google', 'Microsoft", 'apple']
    
    // 無法理解的結(jié)果:
    [10, 20, 1, 2].sort(); // [1, 10, 2, 20]

這是因?yàn)锳rray的sort()方法默認(rèn)把所有元素先轉(zhuǎn)換為String再排序，apple在最后，是因?yàn)閍的ASCI碼在大學(xué)字母后面，結(jié)果'10'排在了'2'的前面，因?yàn)樽址?1'比字符'2'的ASCII碼小。

幸運(yùn)的是，sort()方法也是一個(gè)高階函數(shù)，它還可以接收一個(gè)比較函數(shù)來實(shí)現(xiàn)自定義的排序。

要按數(shù)字大小排序，我們可以這么寫：

    'use strict'
    
    var arr = [1,4,11,6,3,6,]
    arr.sort(function(x, y) {
        return x - y
    })
    console.log(arr)  //[1, 3, 4, 6, 6, 11]
    
    arr.sort(function(x, y) {
        return y - x
    })
    console.log(arr)  //[11, 6, 6, 4, 3, 1]

如果需要忽略大小寫進(jìn)行字符串排序，我們需要在函數(shù)中將x, y 統(tǒng)一轉(zhuǎn)換為大寫或小寫進(jìn)行比較，返回的才能正確

使用方法

1、兩個(gè)或多個(gè)數(shù)組合并去重

    var arr0 = [1,2,3,4,5]
    var arr1 = [2,4,6,8,0]
    var arr2 = [5,6,7,8,9]
    
    function arrFilter() {
        var arr = Array.prototype.slice.apply(arguments)
        
        arr = arr.reduce(function(x, y){
            return x.concat(y)
        })
        arr = arr.filter(function(ele, index, self){
            return self.indexOf(ele) === index
        })
        return arr
    }
    
    console.log(arrFilter(arr0,arr1,arr2))
   //[1, 2, 3, 4, 5, 6, 8, 0, 7, 9]

2、兩個(gè)或多個(gè)數(shù)組選擇沒有重復(fù)的元素組成一個(gè)新數(shù)組

    var arr0 = [1,2,3,4,5]
    var arr1 = [2,4,6,8,0]
    var arr2 = [5,6,7,8,9]
    
    function newArr() {
        var arr = Array.prototype.slice.apply(arguments)
        var newArr = []
        arr = arr.reduce(function(x, y){
            return x.concat(y)
        })
        
        arr = arr.filter(function(ele, index, self){
            var length = self.length
            var canReturn = self.includes(ele, index+1) || self.indexOf(ele) !== index
            return !canReturn
        })
        return arr
    }
    console.log(newArr(arr0,arr1,arr2))
    // [1, 3, 0, 7, 9]

3、includes() 判斷一個(gè)數(shù)組是否包含一個(gè)指定的值，返回布爾值

    let a = [1,2,3]
    a.includes(2)  //true
    a.includes(4)  //false

語法：

    arr.includes(searchElement)
    arr.includes(searchElement, fromIndex)

searchElement: 需要查找的元素
fromIndex|可選: 從該索引處開始查找searchElement。如果為負(fù)值，則按升序從array.length + fromIndex的索引開始搜索。默認(rèn)為0。

    [1, 2, 3].includes(2);     // true
    [1, 2, 3].includes(4);     // false
    [1, 2, 3].includes(3, 3);  // false
    [1, 2, 3].includes(3, -1); // true
    [1, 2, NaN].includes(NaN); // true

如果fromIndex 大于等于數(shù)組長度 ，則返回 false 。該數(shù)組不會(huì)被搜索。

4、樹節(jié)點(diǎn)過濾

var tree = [{
  id: 1,
  text: '中國',
  children: [
    {
      id: 2,
      text: '浙江',
      children: [
        {
          id: 3,
          text: '杭州',
        },
        {
          id: 4,
          text: '麗水',
          children: [
            {
              id: 5,
              text: '慶元'
            },
            {
              id: 6,
              text: '龍泉'
            }
          ]
        },
        {
          id: 7,
          text: '溫州',
          children: [
            {
              id: 8,
              text: '泰順'
            }
          ]
        },
      ]
    },
    {
      id: 9,
      text: '重復(fù)測試',
      children: [
        {
          id: 10,
          text: '溫州'
        }
      ]
    }
  ]
}]

function filter(arr, val) {
  let node = []
  arr.map(item => {
    if (item.text.indexOf(val) >= 0) {
      node.push(item)
      return
    }
    if (item.children && item.children.length > 0) {
      let child = filter(item.children, val)
      if (child.length > 0) {
        item.children = child
        node.push(item)
      }
      return
    }
    return
  })
  return node
}

console.log(filter(tree, '溫州'))