數(shù)組方法及操作

高階函數(shù)

1碧绞、map/reduce
map:如果我們有一個函數(shù)f(x)=x2许蓖,要把這個函數(shù)作用在一個數(shù)組[1,2,3,4,6,5]上罪塔,就可以使用map實現(xiàn)角骤。

    'use strict';
    
    function pow(x) {
      return x * x
    }
    
    var arr = [1,2,3,4]
    var results = arr.map(pow) 
    // [1,4,9,16]
    

map() 作為高階函數(shù)隅忿,實質(zhì)是對數(shù)組中的每一項做計算,然后重新保存到新的數(shù)組中邦尊。

reduce:和map一樣也是作用在數(shù)組的每一項上背桐,但是函數(shù)必須接受2個參數(shù),將上一個元素的計算結(jié)果累計到下一個元素中胳赌。效果其實就是:

    [x1,x2,x3,x4].reduce(f) = f(f(f(x1,x2),x3),x3)

對于數(shù)組:


    var arr = [1,2,3,7,4]
    function sum(x,y) {
      return x + y
    }
    arr.reduce(sum)
    // 17
    function h(x,y){
      return x * y
    }
    arr.reduce(h)
    //  168

2牢撼、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;
    });
    // [1, 5, 9, 15]

filter()接收回調(diào)函數(shù)可以有多個參數(shù)灾杰,f(element, index, self){}

element: 當前元素

index: 當前元素索引值

self: 數(shù)組本身

filter去重

    '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;
    });
    
    console.log(r);

3、sort()
算法排序:對于兩個元素x和y熙参,如果認為x < y艳吠,則返回-1,如果認為x == y孽椰,則返回0昭娩,如果認為x > y,則返回1
如果對數(shù)組直接進行排序黍匾,發(fā)現(xiàn)結(jié)果:

    // 看上去正常的結(jié)果:
    ['Google', 'Apple', 'Microsoft'].sort(); // ['Apple', 'Google', 'Microsoft'];
    
    // apple排在了最后:
    ['Google', 'apple', 'Microsoft'].sort(); // ['Google', 'Microsoft", 'apple']
    
    // 無法理解的結(jié)果:
    [10, 20, 1, 2].sort(); // [1, 10, 2, 20]

這是因為Array的sort()方法默認把所有元素先轉(zhuǎn)換為String再排序栏渺,apple在最后,是因為a的ASCI碼在大學字母后面锐涯,結(jié)果'10'排在了'2'的前面磕诊,因為字符'1'比字符'2'的ASCII碼小。

幸運的是全庸,sort()方法也是一個高階函數(shù)秀仲,它還可以接收一個比較函數(shù)來實現(xiàn)自定義的排序。

要按數(shù)字大小排序壶笼,我們可以這么寫:

    'use strict'
    
    var arr = [1,4,11,6,3,6,]
    arr.sort(function(x, y) {
        return x - y
    })
    console.log(arr)  //[1, 3, 4, 6, 6, 11]
    
    arr.sort(function(x, y) {
        return y - x
    })
    console.log(arr)  //[11, 6, 6, 4, 3, 1]

如果需要忽略大小寫進行字符串排序神僵,我們需要在函數(shù)中將x, y 統(tǒng)一轉(zhuǎn)換為大寫或小寫進行比較,返回的才能正確

使用方法

1覆劈、兩個或多個數(shù)組合并去重

    var arr0 = [1,2,3,4,5]
    var arr1 = [2,4,6,8,0]
    var arr2 = [5,6,7,8,9]
    
    function arrFilter() {
        var arr = Array.prototype.slice.apply(arguments)
        
        arr = arr.reduce(function(x, y){
            return x.concat(y)
        })
        arr = arr.filter(function(ele, index, self){
            return self.indexOf(ele) === index
        })
        return arr
    }
    
    console.log(arrFilter(arr0,arr1,arr2))
   //[1, 2, 3, 4, 5, 6, 8, 0, 7, 9]

2保礼、兩個或多個數(shù)組選擇沒有重復的元素組成一個新數(shù)組

    var arr0 = [1,2,3,4,5]
    var arr1 = [2,4,6,8,0]
    var arr2 = [5,6,7,8,9]
    
    function newArr() {
        var arr = Array.prototype.slice.apply(arguments)
        var newArr = []
        arr = arr.reduce(function(x, y){
            return x.concat(y)
        })
        
        arr = arr.filter(function(ele, index, self){
            var length = self.length
            var canReturn = self.includes(ele, index+1) || self.indexOf(ele) !== index
            return !canReturn
        })
        return arr
    }
    console.log(newArr(arr0,arr1,arr2))
    // [1, 3, 0, 7, 9]

3、includes() 判斷一個數(shù)組是否包含一個指定的值责语,返回布爾值

    let a = [1,2,3]
    a.includes(2)  //true
    a.includes(4)  //false

語法:

    arr.includes(searchElement)
    arr.includes(searchElement, fromIndex)

searchElement: 需要查找的元素
fromIndex|可選: 從該索引處開始查找searchElement炮障。如果為負值,則按升序從array.length + fromIndex的索引開始搜索坤候。默認為0胁赢。

    [1, 2, 3].includes(2);     // true
    [1, 2, 3].includes(4);     // false
    [1, 2, 3].includes(3, 3);  // false
    [1, 2, 3].includes(3, -1); // true
    [1, 2, NaN].includes(NaN); // true

如果fromIndex 大于等于數(shù)組長度 ,則返回 false 白筹。該數(shù)組不會被搜索智末。

4谅摄、樹節(jié)點過濾

var tree = [{
  id: 1,
  text: '中國',
  children: [
    {
      id: 2,
      text: '浙江',
      children: [
        {
          id: 3,
          text: '杭州',
        },
        {
          id: 4,
          text: '麗水',
          children: [
            {
              id: 5,
              text: '慶元'
            },
            {
              id: 6,
              text: '龍泉'
            }
          ]
        },
        {
          id: 7,
          text: '溫州',
          children: [
            {
              id: 8,
              text: '泰順'
            }
          ]
        },
      ]
    },
    {
      id: 9,
      text: '重復測試',
      children: [
        {
          id: 10,
          text: '溫州'
        }
      ]
    }
  ]
}]

function filter(arr, val) {
  let node = []
  arr.map(item => {
    if (item.text.indexOf(val) >= 0) {
      node.push(item)
      return
    }
    if (item.children && item.children.length > 0) {
      let child = filter(item.children, val)
      if (child.length > 0) {
        item.children = child
        node.push(item)
      }
      return
    }
    return
  })
  return node
}

console.log(filter(tree, '溫州'))
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市系馆,隨后出現(xiàn)的幾起案子送漠,更是在濱河造成了極大的恐慌,老刑警劉巖由蘑,帶你破解...
    沈念sama閱讀 217,657評論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件闽寡,死亡現(xiàn)場離奇詭異,居然都是意外死亡尼酿,警方通過查閱死者的電腦和手機爷狈,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,889評論 3 394
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來谓媒,“玉大人淆院,你說我怎么就攤上這事何乎【涔撸” “怎么了?”我有些...
    開封第一講書人閱讀 164,057評論 0 354
  • 文/不壞的土叔 我叫張陵支救,是天一觀的道長抢野。 經(jīng)常有香客問我,道長各墨,這世上最難降的妖魔是什么指孤? 我笑而不...
    開封第一講書人閱讀 58,509評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮贬堵,結(jié)果婚禮上恃轩,老公的妹妹穿的比我還像新娘。我一直安慰自己黎做,他們只是感情好叉跛,可當我...
    茶點故事閱讀 67,562評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著蒸殿,像睡著了一般筷厘。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上宏所,一...
    開封第一講書人閱讀 51,443評論 1 302
  • 那天酥艳,我揣著相機與錄音,去河邊找鬼爬骤。 笑死充石,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的霞玄。 我是一名探鬼主播骤铃,決...
    沈念sama閱讀 40,251評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼浓镜,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了劲厌?” 一聲冷哼從身側(cè)響起膛薛,我...
    開封第一講書人閱讀 39,129評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎补鼻,沒想到半個月后哄啄,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,561評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡风范,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,779評論 3 335
  • 正文 我和宋清朗相戀三年咨跌,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片硼婿。...
    茶點故事閱讀 39,902評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡锌半,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出寇漫,到底是詐尸還是另有隱情刊殉,我是刑警寧澤,帶...
    沈念sama閱讀 35,621評論 5 345
  • 正文 年R本政府宣布州胳,位于F島的核電站记焊,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏栓撞。R本人自食惡果不足惜遍膜,卻給世界環(huán)境...
    茶點故事閱讀 41,220評論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望瓤湘。 院中可真熱鬧瓢颅,春花似錦、人聲如沸弛说。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,838評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽剃浇。三九已至巾兆,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間虎囚,已是汗流浹背角塑。 一陣腳步聲響...
    開封第一講書人閱讀 32,971評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留淘讥,地道東北人圃伶。 一個月前我還...
    沈念sama閱讀 48,025評論 2 370
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親窒朋。 傳聞我的和親對象是個殘疾皇子搀罢,可洞房花燭夜當晚...
    茶點故事閱讀 44,843評論 2 354