1. 程式人生 > >js 陣列filter 總結

js 陣列filter 總結

filter過濾陣列

filter()
1.方法建立一個新的陣列,新陣列中的元素是通過檢查指定陣列中符合條件的所有元素
2.不會改變原始陣列

var arr = [
  { id: 1, text: 'aa', done: true },
  { id: 2, text: 'bb', done: false }
]
console.log(arr.filter(item => item.done))

轉成ES5

arr.filter(function (item) {
  return item.done;
});

return後面判斷結果,取布林值,true的話就添入新的filter陣列中,false的話,不會添進filter的陣列中。

最後得到新的陣列是

[{id: 1, text: "aa", done: true}]
var arr = [
  { id: 1, text: 'aa', done: true },
  { id: 2, text: 'bb', done: '' }
]
console.log(arr.filter(item => item.done))

結果還是一樣,因為”空字串轉成布林型別為false

用處

1.去掉陣列中的空字串項

var arr = ['1.jpg','2.jpg','', '3.jpg',' ']
var newArr = arr.filter(item
=> item) console.log(newArr,arr)
newArr => ["1.jpg", "2.jpg", "3.jpg", " "]   空字串項被過濾掉了
arr => ["1.jpg", "2.jpg", "", "3.jpg", " "]

2.去掉陣列中不符合的項

var arr = [73,84,56, 22,100]
var newArr = arr.filter(item => item>80)   //得到新陣列 [84, 100] 
console.log(newArr,arr)
var arr = ['aa','cb','cc'
, 'bd','rf'] var newArr = arr.filter(item => item.indexOf('b')<0) 不包含b字串的 得到新陣列 ["aa", "cc", "rf"]