JS中filter( )數(shù)組過濾器的使用
更新時(shí)間：2021年11月02日 15:55:30 作者：勇敢小陳
這篇文章主要介紹了filter() 數(shù)組過濾的使用方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
一、前言
數(shù)組過濾器是前端數(shù)據(jù)處理的一種常用方法，對于前端來說，后端返回的數(shù)據(jù)我們需要經(jīng)過處理以后才能獲取到自己想要的數(shù)據(jù)，進(jìn)行進(jìn)一步的操作。有時(shí)候后端返回給我我們的值僅可以作為參考。
二、方法簡介
filter( )方法會(huì)創(chuàng)建一個(gè)新數(shù)組，數(shù)組中的數(shù)據(jù)是經(jīng)過指定數(shù)據(jù)中過濾出來的符合條件的數(shù)據(jù)
filter( )的兩大特點(diǎn)
1.filter( )不會(huì)對空數(shù)組進(jìn)行檢測
2.filter( )不會(huì)改變原數(shù)組
filter( )方法的用法：
array.filter(function(currentValue,index,arr), thisValue) //currentValue：當(dāng)前元素的值 //index：當(dāng)前元素的下標(biāo) //arr：原數(shù)組
三、用法案例
1.獲取數(shù)組中符合條件的元素
const school = [
{
occupation:"老師",
age:40
},
{
occupation:"學(xué)生",
age:23
},{
occupation:"程序猿",
age:1
}
]
var newShool = school.filter(item => item.age > 20)
console.log(newShool);//[ { occupation: '老師', age: 40 }, { occupation: '學(xué)生', age: 23 } ]
總結(jié)
本篇文章就到這里了，希望能夠給你帶來幫助，也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容！
您可能感興趣的文章:
- JavaScript遍歷數(shù)組的三種方法map、forEach與filter實(shí)例詳解
- JavaScript 數(shù)組some()和filter()的用法及區(qū)別
- JavaScript中find()、findIndex()、filter()、indexOf()處理數(shù)組方法的具體區(qū)別詳解
- js 數(shù)組 find,some,filter,reduce區(qū)別詳解
- JS中的常見數(shù)組遍歷案例詳解(forEach,?map,?filter,?sort,?reduce,?every)
- JavaScript數(shù)組常用方法find、findIndex、filter、map、flatMap及some詳解
- JavaScript 數(shù)組的常用方法find 和 filter詳解及區(qū)別介紹
- JavaScript數(shù)組方法push()、forEach()、filter()、sort()實(shí)戰(zhàn)教程
相關(guān)文章
JavaScript中arguments和this對象用法分析
這篇文章主要介紹了JavaScript中arguments和this對象用法,結(jié)合實(shí)例形式較為詳細(xì)的分析了arguments對象和this對象的功能、常見用法及相關(guān)操作注意事項(xiàng),需要的朋友可以參考下2018-08-08
有一個(gè)比較復(fù)雜的HTML片段(A)，如果把這個(gè)HTML片段嵌入到其他頁面中（B,C,D....）。 問題的關(guān)鍵是在HTML片段中有大量的JavaScript邏輯需要處理，比如說分頁，點(diǎn)擊事件響應(yīng)等。2011-03-03
原生js實(shí)現(xiàn)的移動(dòng)端可拖動(dòng)進(jìn)度條插件功能詳解
這篇文章主要介紹了原生js實(shí)現(xiàn)的移動(dòng)端可拖動(dòng)進(jìn)度條插件功能,結(jié)合實(shí)例形式詳細(xì)分析了javascript拖動(dòng)進(jìn)度條插件的具體定義與使用技巧,需要的朋友可以參考下2019-08-08
JS下拉框內(nèi)容左右移動(dòng)效果的具體實(shí)現(xiàn)
這篇文章介紹了JS下拉框內(nèi)容左右移動(dòng)效果的具體實(shí)現(xiàn)方法，有需要的朋友可以參考一下2013-07-07
Redux中進(jìn)行異步操作(網(wǎng)絡(luò)請求)的示例方案
這篇文章主要介紹了Redux中進(jìn)行異步操作(網(wǎng)絡(luò)請求)的方案,本文結(jié)合示例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-12-12
這篇文章主要介紹了使用AutoJs實(shí)現(xiàn)微信搶紅包的代碼,本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-12-12
這篇文章主要為大家詳細(xì)介紹了微信小程序地圖實(shí)現(xiàn)展示線路，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-06-06
詳解如何用webpack打包一個(gè)網(wǎng)站應(yīng)用項(xiàng)目
本篇文章主要介紹了如何用webpack打包一個(gè)網(wǎng)站應(yīng)用，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-07-07
原生javascript實(shí)現(xiàn)DIV拖拽并計(jì)算重復(fù)面積
這篇文章主要介紹了使用原生javascript實(shí)現(xiàn)DIV拖拽并計(jì)算重復(fù)面積的方法及示例代碼分享，效果十分漂亮,需要的朋友可以參考下2015-01-01
腳本收藏iframe...2006-07-07