JS中some(),every(),forEach(),map(),filter()區(qū)別

CoderBear 發(fā)布于2019-08-23 14:05 / 1529人閱讀

摘要：在中為新增了幾個方法，，，，，也就是一共有這么多方法了。剛開始接觸這些倒也記得不是很清楚，在此紀錄一下以加深影響。我主要從兩個角度來理解和記憶吧，一個是的使用，一個是內部實現(xiàn)。

JS在1.6中為Array新增了幾個方法map()，filter()，some()，every()，forEach()，也就是一共有這么多方法了。

剛開始接觸這些倒也記得不是很清楚，在此紀錄一下以加深影響。我主要從兩個角度來理解和記憶吧，一個是API的使用，一個是內部實現(xiàn)。

函數(shù)簡述

map():返回一個新的Array，每個元素為調用func的結果

filter():返回一個符合func條件的元素數(shù)組

some():返回一個boolean，判斷是否有元素是否符合func條件

every():返回一個boolean，判斷每個元素是否符合func條件

forEach():沒有返回值，只是針對每個元素調用func

function my_func(item) {
  if (item == 1) {
    console.log("t");
    return true;
  }
  console.log("f");
  return false;
}

// init an array
l = [0,1,2,3,4]

// print: f,t,f,f,f
// return:[false, true, false, false, false]
l.map(my_func)


// print: f,t,f,f,f
// return: 1
l.filter(my_func)

// print: f,t
// return: true
l.some(my_func)

// print: f
// return: false
l.every(my_func)

// print: f,t,f,f,f
//return: undefined
l.forEach(my_func)
內部實現(xiàn)

// From：http://developer.mozilla.org

Array.prototype.map = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var res = new Array(len);
  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this)
      res[i] = fun.call(thisp, this[i], i, this);
  }

  return res;
};

Array.prototype.filter = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var res = new Array();
  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this)
    {
      var val = this[i]; // in case fun mutates this
      if (fun.call(thisp, val, i, this))
        res.push(val);
    }
  }

  return res;
};

Array.prototype.some = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this && fun.call(thisp, this[i], i, this))
      return true;
  }

  return false;
};

Array.prototype.every = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this && !fun.call(thisp, this[i], i, this))
    return false;
  }

  return true;
};

Array.prototype.forEach = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this)
      fun.call(thisp, this[i], i, this);
  }
};

參考文獻https://blog.csdn.net/github_...

GPU云服務器云服務器 js取map中數(shù)據(jù) js中取出map的值 matlab中filter函數(shù) js獲取foreach數(shù)據(jù)

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/100073.html

JS 數(shù)組循環(huán)遍歷方法的對比

摘要：循環(huán)方法方法不改變原數(shù)組方法會給原數(shù)組中的每個元素都按順序調用一次函數(shù)。篩選出過濾出數(shù)組中符合條件的項組成新數(shù)組代碼方法方法為數(shù)組中的每個元素執(zhí)行一次函數(shù)，直到它找到一個使返回表示可轉換為布爾值的值的元素。 showImg(https://segmentfault.com/img/bV2QTD?w=1600&h=500); 前言 JavaScript 發(fā)展至今已經發(fā)展出多種數(shù)組的循環(huán)遍...

BlackFlagBin 2019-08-26 11:31 評論0 收藏0
生動形象解釋forEach、filter、map、some、every、find、findIndex

摘要：前言從最開始學的循環(huán)遍歷方法，到后來層出不窮的各種遍歷方法，其實最大的區(qū)別就是應用場景的不同。我們最需要記住的就是，什么情況下用哪一種方法比較合適。前言從最開始學的for循環(huán)遍歷方法，到后來層出不窮的各種遍歷方法，其實最大的區(qū)別就是應用場景的不同。我們最需要記住的就是，什么情況下用哪一種方法比較合適。從挑土豆開始 showImg(https://segmentfault.com/...

Luosunce 2019-08-23 16:51 評論0 收藏0
細說數(shù)組常用遍歷的方法

摘要：需要返回值，如果不給，默認返回使用場景假定有一個數(shù)值數(shù)組將數(shù)組中的值以雙倍的形式放到數(shù)組寫法方法使用場景假定有一個對象數(shù)組將數(shù)中對象某個屬性的值存儲到數(shù)組中三從數(shù)組中找出所有符合指定條件的元素檢測數(shù)值元素，并返回符合條件所有元素的數(shù)組。 showImg(https://segmentfault.com/img/remote/1460000016810336?w=1149&h=524);...

阿羅 2019-08-29 17:05 評論0 收藏0
細說數(shù)組常用遍歷的方法

摘要：需要返回值，如果不給，默認返回使用場景假定有一個數(shù)值數(shù)組將數(shù)組中的值以雙倍的形式放到數(shù)組寫法方法使用場景假定有一個對象數(shù)組將數(shù)中對象某個屬性的值存儲到數(shù)組中三從數(shù)組中找出所有符合指定條件的元素檢測數(shù)值元素，并返回符合條件所有元素的數(shù)組。 showImg(https://segmentfault.com/img/remote/1460000016810336?w=1149&h=524);...

AlphaWatch 2019-08-02 11:48 評論0 收藏0
細說數(shù)組常用遍歷的方法

摘要：需要返回值，如果不給，默認返回使用場景假定有一個數(shù)值數(shù)組將數(shù)組中的值以雙倍的形式放到數(shù)組寫法方法使用場景假定有一個對象數(shù)組將數(shù)中對象某個屬性的值存儲到數(shù)組中三從數(shù)組中找出所有符合指定條件的元素檢測數(shù)值元素，并返回符合條件所有元素的數(shù)組。 showImg(https://segmentfault.com/img/remote/1460000016810336?w=1149&h=524);...

?xiaoxiao, 2019-08-23 12:32 評論0 收藏0