JavaScript 中遍歷方法小結

遍歷方法小結

經常使用的遍歷方法

• for 遍歷
• forEach（對數組的每一個元素執行一次提供的函數）
• map（建立一個新數組，其結果是該數組中的每一個元素都調用一個提供的函數後返回的結果）

for 遍歷你們都熟悉，因此重點講一下forEach 與 map 的區別

• 相同點：

  1. 回調函數參數相同，都自帶三個屬性：item / index / array
  2. 均不會修改原數組
  3. 第二參數this的指向均指向window（但是使用箭頭函數進行修改）
  4. 只能遍歷數組
  5. 都不能使用循環跳出語句 break & continue

• 不一樣點：

  • forEach

    1. 返回值爲undefined

  • map

    1. 返回值爲一個新的數組
    2. 能夠鏈式調用

    // 鏈式調用
      var str = 'abcde';
      // 使用call在字符類型中使用map方法
      Array.prototype.map.call(str, function(x) {   
        return x;
      }).reverse().join('');
      // edcba

其餘遍歷方法

• filter (建立一個新數組, 其包含經過所提供函數實現的測試的全部元素)
• find (返回數組中知足提供的測試函數的第一個元素的值。不然返回 undefined)
• every (測試數組的全部元素是否都經過了指定函數的測試)
• some (測試是否至少有一個元素經過由提供的函數實現的測試)

【Attention】
filter 將遍歷全部的元素
find & some & every 屬於「條件中斷」遍歷（即當元素知足某一條件是返回boolean）
四個方法都不會對原數組進行修改

---

ES5 中的for...in 遍歷

經常使用於對象key值的遍歷

ES6 引入的遍歷方法

• for...of 遍歷

  [ 前置知識：for...of 可對具備iterator接口的數據結構進行遍歷 ]

  • 原生具備iterator接口的數據結構以下：

    • Array
    • Set
    • Map
    • String
    • TypedArray
    • NodeList 對象
    • 函數的arguments 對象

• keys( ) / values( ) / entries( )

  經常使用來遍歷對象、數組、set、map結構

【番外】

• 改變原數組的方法
  pop、push、reverse、shift、sort、splice、unshift
• 不會改變原數組的方法concat、join、slice、toString、toLocaleString、indexOf、lastIndexOf