reduce()方法的學習和整理

今天看文章的時候看到reduce方法去做迴圈比較是較為優雅的寫法，遂學習了一波，現整理如下。

文章連結：https://www.jianshu.com/p/e375ba1cfc47

1. 語法

reduce() 方法接收一個函式作為累加器，陣列中的每個值（從左到右）開始縮減，最終計算為一個值。
reduce() 可以作為一個高階函式，用於函式的 compose。
注意: reduce() 對於空陣列是不會執行回撥函式的。

arr.reduce(callback,[initialValue])

callback詳解：

1. previousValues: 上一次呼叫回撥函式返回的值，第一次是 initialValue的值，如何未設定 initialValue 值，是陣列的第一個元素的值
2. currentValue: 陣列當前被處理的值，未設定 initialValue ，為陣列的第二個元素的值。
3. index：當前元素在陣列中的索引。預設值為1，設定 initialValue 則為 initialValue的值
4. array：呼叫reduce方法的陣列
5. initialValue： 第一次呼叫callback的第一個引數

2. 例項

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

列印結果：
1 2 1
3 3 2
6 4 3
[1, 2, 3, 4] 10

3. 其他語法

1. if in

	if ( cur in pre ) {
       pre[cur]++
  	}

if in 用法是判斷屬性是否屬於物件
上述代表的是在 pre 中是否有 cur 屬性

注： in 我一般用於 for in 沒使用過 if in，還是見識少，要多看書和文章。

2. includes

   if ( !pre.includes(cur) ) {
      return pre.concat(cur)
    }

ncludes() 方法用於判斷字串是否包含指定的子字串。
如果找到匹配的字串則返回 true，否則返回 false。
includes() 方法區分大小寫。

故上述程式碼是用來判斷 cur 中是否包含字串 pre

4. 討論

和後臺男朋友說到元素匹配陣列，男朋友告訴我後臺有個 contains 方法，js裡面可能也有，搜尋了一下發現是jQuery 裡的 contains，方法是用來判斷dom元素的包含關係的。

$.contains() 方法用於判斷指定元素內是否包含另一個元素。即判斷另一個DOM元素是否是指定DOM元素的後代。

例項：

$(function () {
    function funcontain( html ){
        document.body.innerHTML += "<br>" + html;
        }
    funcontain($.contains( document.documentElement, document.body )); // true
    funcontain($.contains( document.body, document.documentElement )); // false
})

but 看文章的時候發現有個陣列有個 indexOf 判斷陣列內某個元素是否存在，只用字串的 indexOf ，一查文件，發現還真的有，又學到一個。寫法和字串的一致，返回元素所在的位置，沒有找到返回-1。

有個大佬的文章講這個的，分析的不錯。