JS基礎(chǔ)回顧:filter

一炭剪、filter定義:

filter也是一個常用的操作辉阶,它用于把Array的某些元素過濾掉先壕,然后返回剩下的元素。

和map()類似睛藻,Array的filter()也接收一個函數(shù)启上。和map()不同的是邢隧,filter()把傳入的函數(shù)依次作用于每個元素店印,然后根據(jù)返回值是true還是false決定保留還是丟棄該元素

【例如】

在一個Array中倒慧,刪掉偶數(shù)按摘,只保留奇數(shù)包券,可以這么寫:
var arr = [1, 2, 4, 5, 6, 9, 10, 15];
var r = arr.filter(function (x) {
    return x % 2 !== 0;
});
r; // [1, 5, 9, 15]
把一個Array中的空字符串刪掉,可以這么寫:
var arr = ['A', '', 'B', null, undefined, 'C', '  '];
var r = arr.filter(function (s) {
    return s && s.trim(); // 注意:IE9以下的版本沒有trim()方法
});
arr; // ['A', 'B', 'C']

可見用filter()這個高階函數(shù)炫贤,關(guān)鍵在于正確實現(xiàn)一個“篩選”函數(shù)溅固。

二、filter回調(diào)函數(shù)

filter()接收的回調(diào)函數(shù)兰珍,其實可以有多個參數(shù)侍郭。通常我們僅使用第一個參數(shù),表示Array的某個元素掠河×猎回調(diào)函數(shù)還可以接收另外兩個參數(shù),表示元素的位置和數(shù)組本身

var arr = ['A', 'B', 'C'];
var r = arr.filter(function (element, index, self) {
    console.log(element); // 依次打印'A', 'B', 'C'
    console.log(index); // 依次打印0, 1, 2
    console.log(self); // self就是變量arr
    return true;
});

利用filter唠摹,可以巧妙地去除Array的重復元素:

'use strict';

var r,
    arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry'];
    r = arr.filter(function (element, index, self) {
    return self.indexOf(element) === index;
});
alert(r.toString());
去除重復元素依靠的是indexOf總是返回第一個元素的位置爆捞,后續(xù)的重復元素位置與indexOf返回的位置不相等,因此被filter濾掉了勾拉。

廖雪峰:http://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/0014351219769203e3fbe1ed611475db3d439393add8997000

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末煮甥,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子藕赞,更是在濱河造成了極大的恐慌成肘,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,290評論 6 491
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件斧蜕,死亡現(xiàn)場離奇詭異艇劫,居然都是意外死亡,警方通過查閱死者的電腦和手機惩激,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,107評論 2 385
  • 文/潘曉璐 我一進店門店煞,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人风钻,你說我怎么就攤上這事顷蟀。” “怎么了骡技?”我有些...
    開封第一講書人閱讀 156,872評論 0 347
  • 文/不壞的土叔 我叫張陵鸣个,是天一觀的道長。 經(jīng)常有香客問我布朦,道長囤萤,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,415評論 1 283
  • 正文 為了忘掉前任是趴,我火速辦了婚禮涛舍,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘唆途。我一直安慰自己富雅,他們只是感情好掸驱,可當我...
    茶點故事閱讀 65,453評論 6 385
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著没佑,像睡著了一般毕贼。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上蛤奢,一...
    開封第一講書人閱讀 49,784評論 1 290
  • 那天鬼癣,我揣著相機與錄音,去河邊找鬼啤贩。 笑死扣溺,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的瓜晤。 我是一名探鬼主播锥余,決...
    沈念sama閱讀 38,927評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼痢掠!你這毒婦竟也來了驱犹?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,691評論 0 266
  • 序言:老撾萬榮一對情侶失蹤足画,失蹤者是張志新(化名)和其女友劉穎雄驹,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體淹辞,經(jīng)...
    沈念sama閱讀 44,137評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡医舆,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,472評論 2 326
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了象缀。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片蔬将。...
    茶點故事閱讀 38,622評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖央星,靈堂內(nèi)的尸體忽然破棺而出霞怀,到底是詐尸還是另有隱情,我是刑警寧澤莉给,帶...
    沈念sama閱讀 34,289評論 4 329
  • 正文 年R本政府宣布毙石,位于F島的核電站,受9級特大地震影響颓遏,放射性物質(zhì)發(fā)生泄漏徐矩。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 39,887評論 3 312
  • 文/蒙蒙 一叁幢、第九天 我趴在偏房一處隱蔽的房頂上張望滤灯。 院中可真熱鬧,春花似錦、人聲如沸力喷。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,741評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽弟孟。三九已至,卻和暖如春样悟,著一層夾襖步出監(jiān)牢的瞬間拂募,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,977評論 1 265
  • 我被黑心中介騙來泰國打工窟她, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留陈症,地道東北人。 一個月前我還...
    沈念sama閱讀 46,316評論 2 360
  • 正文 我出身青樓震糖,卻偏偏與公主長得像录肯,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子吊说,可洞房花燭夜當晚...
    茶點故事閱讀 43,490評論 2 348

推薦閱讀更多精彩內(nèi)容