原生js forEach()和map()遍歷

A：相同點：

   1.都是迴圈遍歷陣列中的每一項。

   2.forEach() 和 map() 裡面每一次執行匿名函式都支援3個引數：陣列中的當前項item,當前項的索引index,原始陣列input。

   3.匿名函式中的this都是指Window。

   4.只能遍歷陣列。

B：不同

1.forEach()

   沒有返回值

　　var ary = [12,23,2,3]; 

　　var res = ary.forEach(function (item,index,ary) {  

　　　　 input[index] = item*10;  

　　})  

　　console.log(res);//-->undefined;  

　　console.log(ary);//-->會對原來的陣列產生改變；

2.map()

  有返回值，可以return 出來。

　　var ary = [12,2,4,22,1];  

　　var res = ary.map(function (item,index,ary) {  

　　　　return item*10;  

　　})  

　　console.log(res);//[120,20,40,220,10];  

　　console.log(ary);//[12,2,4,22,1];  

3.filter()篩選

篩選值

function isBigNum(element) {
  return element >= 10;
}
 
var filtered = [12, 5, 8, 10, 40].filter(isBigNum);
// filtered is [12, 10, 40]

篩選json中的無效值

var arr = [
  { id: 15 },
  { id: -1 },
  { id: 0 },
  { id: 3 },
  { id: 12.2 },
  { },
  { id: null },
  { id: NaN },
  { id: 'undefined' }
];

var invalidEntries = 0;

function isNumber(obj) {
  return obj !== undefined && typeof(obj) === 'number' && !isNaN(obj);
}

function filterByID(item) {
  if (isNumber(item.id) && item.id !== 0) {
    return true;
  } 
  invalidEntries++;
  return false; 
}

var arrByID = arr.filter(filterByID);

console.log('Filtered Array\n', arrByID); 
// Filtered Array
// [{ id: 15 }, { id: -1 }, { id: 3 }, { id: 12.2 }]

console.log('Number of Invalid Entries = ', invalidEntries); 
// Number of Invalid Entries = 5

陣列中篩選：

var color = ['red', 'grey', 'green', 'yellow', 'orange'];

/**
 * Array filters items based on search criteria (query)
 */
function filterItems(query) {
  return color.filter(function(el) {
      return el.toLowerCase().indexOf(query.toLowerCase()) > -1;
  })
}

console.log(filterItems('re')); // ['red', 'grey', 'green']
console.log(filterItems('or')); // ['orange']

ES5實現

var color = ['red', 'grey', 'green', 'yellow', 'orange'];

const filterItems = (query) => {
  return color.filter((el) =>
    el.toLowerCase().indexOf(query.toLowerCase()) > -1
  );
}

console.log(filterItems('re')); // ['red', 'grey', 'green']
console.log(filterItems('or')); // ['orange']