1. 程式人生 > 程式設計 >JavaScript陣列方法-系統性總結詳解

JavaScript陣列方法-系統性總結詳解

目錄
  • 陣列常用方法
    • 陣列元素增添和刪除
      • 運算元組頭部
      • 運算元組尾部
      • 任意位置增刪
      • 陣列拼接
      • 陣列轉換成字串
      • 擷取陣列
  • 陣列排序方法
    • 排序
      • 順序翻轉
      • 陣列迭代方法
        • 陣列遍歷查詢
          • 返回值為下標
          • 返回值為內容
        • 陣列遍歷處理
          • cahttp://www.cppcns.comllback(value[,index[,array]])
          • callback(total,value[,array]])
      • 陣列其他方法
        • 總結

          首先總結的意義就是讓雜亂無章變得更加井然有序,這樣在使用的過程思路會更加清晰。

          陣列使用方法注意點:

          • 變異方法和非變異方法。即變異方法使用會改變原陣列,後者則不會。下面腦圖將其進行了標註。
          • 你或許需要注意陣列方法和字串方法有幾個方法相似,陣列和字串是如何切換的?
          • 有些方法引數是支援負數的,有些方法第二個引數不是代表座標代表的是個數。
          • 甚至回撥函式我們也可以將其梳理一遍,大部分回撥函式引數格式是一樣的,有些回撥函式是不一樣的。
          • 當split,slice,splice,join,contains,includes,push,pop,shift,unshift甚至你被相似的單詞搞得暈頭轉向,以至於你分不清哪個是陣列的方法哪個是字串方法,哪個功能是幹嘛來著。當然我現在可以告訴你上面那些方法究竟是陣列方法還是字串方法,甚至字串方法和陣列都有這麼一個方法,但是沒必要,因為你終究很難記住。所以下面將其進行系統的歸類總結,你就很容易區分出來了。

          接下來你只需要忘記你之前雜亂無章的記憶,通過梳理重新建立你的記憶。

          在這裡插入圖片描述

          陣列常用方法

          陣列元素增添和刪除

          運算元組頭部

          • unshift(value)變異方法陣列頭部插入一個元素
          • shift()變異方法移出陣列頭部的第一個元素

          運算元組尾部

          • push(value)變異方法向陣列尾部壓入一個元素
          • pop()變異方法彈出陣列尾部一個元素

          任意位置增刪

          splice(start,length[…,value])變異方法

          第二個引數為個數,不為0的時候表示需要從start開始刪除length個元素支援增刪一起做。

          陣列拼接

          • concat(…arr)字串有該類似方法

          陣列轉換成字串

          • join(str) 以指定字元進行拼接將陣列轉換成字串
          • toString() 以","號進行分割將陣列轉換字串

          擷取陣列

          • slice(start[,end])支援負數字符串有該類似方法

          陣列排序方法

          排序

          • sort(callback)變異方法對陣列進行排序

          回撥函式返回 a-b為從大到小進行排序,b-a則為從小到大進行排序。

          //callback回撥函式格式
          function callback(a,b) {
          	return a-b
          }
          

          順序翻轉

          reverse()變異方法對陣列的順序進行反轉

          陣列迭代方法

          陣列遍歷查詢

          返回值為下標

          • indexOf(targetValue) 從左到右陣列進行遍歷,查詢目標值的所在下標,返回第一次出現的下標值.
          • lastIndexOf(targetValue) 從右到左對陣列進行遍歷,查詢目標值所在下標,返回第一次出現的下標值.
          • findIndex(callback) 通過回撥函式對陣列元素進行條件判斷,返回第一次滿足條件的元素下標值

          返回值為內容

          • find(callback) 通過回撥函式對陣列元素進行條件判斷,返回第一次滿足條件的元素值

          陣列遍歷處理

          callback(value[,array]])

          //callback回撥函式格式
          function callback( value,index,array) {
          	//處理
          	...
          	return ... //此處是否不需要retrun語句下面對其進行標註
          }
          
          • forEach(callback) 對陣列進行遍歷處理僅處理無返回值。callback不需要return語句
          • map(callback) 遍歷陣列每一個元素使用callback對陣列進行處理,並且將callback處理過的返回值加入到新陣列並返回新陣列。
          • filter(callback) 對陣列進行過濾操作,返回callback返回值為true的元素組成的新陣列。
          • every(callback) 對陣列進行遍歷,如果callback返回值都為true,則方法的返回值為true
          • some(callback) 對陣列進行遍歷,如果callback返回值有一個為trwww.cppcns.comue,則方法的返回值為true

          callback(total,array]])

          //callback回撥函式格式
          function callback(total,value,array) {
            return total + value;
          }
          
          • reduce(callback[,初始值])

          從左往右陣列依次縮短,同時上一次處理的結果total傳入下次回撥函式的作為引數供回撥函式使用

          • reduceRight(callback[,初始值])

          從右往左陣列依次縮短,同時上一次處理的結果total傳入下次回撥函式的http://www.cppcns.com作為引數供回撥函式使用

          陣列其他方法

          includes(value)ES6判斷陣列是否包含某個元素

          總結

          本篇文章就到這裡了,希望能夠給你帶來幫助,也希望您能夠多多關注我們的更多內容!