項目中對數組和字符串的處理

最近做的項目中涉及前端做數據的聚合和處理，用到了很多數組的方法，所以依據功能進行分類總結防止混淆

1. 遍歷類（只有直接對item操作纔會改變，返回值需要特別注意）

forEach

對每一項操作，無返回值

map

return + 操作後的新item
對數組中每項操作，有返回值得到一個新數組，原數組多少項就得到多少項

filter

return + 過濾條件
返回滿足條件的數組。和原數組項數不一致

find

return + 滿足條件
返回滿足條件的第一項（注意返回的是項不是數組，而且是第一項）

some

return + 條件
如果數組中滿足這一條件的返回true, 沒有則返回false

every

return + 條件
如果數組中每個都滿足這個條件則返回true, 不是則返回false

for遍歷

【遍歷數組】

for(let item of a)
{
}

【遍歷對象】

for(let item in a)
{
}

2. 增加刪除類（改變原數組，返回值需要特別注意）

push&&pop

push是從後面加一項，返回值是增加後的數組長度
pop是從後面刪除一項，返回值是刪除的那一項

shift&&unshift

shift是從前面刪除一項，返回值是刪除的那一項
unshift從前面加入一項，返回值是增加後的數組長度

splice

a.splice(n,m,l,…)
從第n項（包括n）刪除m項，把l,…插入到n前面，返回值是刪除的數組，原有數組改變。沒有第三項的時候表示只刪除。沒有2，3項的時候表示從第n項刪除到最後。

3. 截取和拼接（原有數組不改變，返回值爲預想結果）

slice

slice(n, m)
從第n項（包括n）開始截取到m項（不包括m），沒有第二項表示到末尾。返回一個截取的新數組，不改變原數組，支持負數索引

concat

a.concat(b,c)
傳參是想要拼接的數組/值，可以是多項傳參，返回值是拼接後的新數組

4. 順序相關（改變原數組，返回值爲預想結果）

reverse

a.reverse()倒過來，改變原數組，返回值是倒序後的數組
【注意】
如果想得到a的倒序而不改變a，以下是錯誤的

let a = [1,2,3,4]
let b = a
b.reverse() //返回值是[4,3,2,1]
console.log(a) //打印出來是[4,3,2,1] a被改變了

這樣仍然改變了a，因爲是按址賦值，a,b共用一個地址，數組是引用類型
【解決】

let b = a.slice()
let b = a.concat()

sort

項目中sort都要有傳參，改變原數組，返回值是排序後的數組

let a = [1,2,3,4]
a.sort((a,b) => {return a - b}) //正序
a.sort((a,b) => {return b - a}) //倒序

如果sort裏不跟傳參會出現問題，根據第一位排序

sort對象數組

在項目中有的是給一個對象數組，要根據該對象數組裏的某個屬性值排序，寫法如下

function compareUp (prop) { //基於對象中的prop屬性升序排列
        return function (a, b) {
          let value1 = a[prop]
          let value2 = b[prop]
          return value1 - value2
        }
      }
//用的時候
a.sort(compareUp('month')) //根據month字段排序

降序的話回調函數裏改爲value2 - value1

5.字符串相關操作（不改變原數組，返回值爲預想結果）

toString

a.toString()
把數組轉化爲數組中的每一項用逗號分隔的字符串，原有數組不改變，返回值爲字符串

join

a.join(’+’)
和toString類似，也是把數組轉換爲字符串，但我們可以是設置爲字符串之後，每一項之間的連接符，返回值爲字符串

indexOf/lastIndexOf

檢測當前值在數組中第一次或者最後一次出現位置的索引，沒有則返回-1

6. 數組去重

項目中經常用到數組去重，利用對象健值即可，es6方便一些

var ary=[1,1,2,3,4,5,5,6,7,3];
var newAry=Array.from(new Set(ary));//把其他轉爲數組
console.log(newAry);

也可以一步一步來，學習一下，如下，好的方法主要是利用了對象的健不能重複
【解決方案一】：

依次拿出數組中的每一項（排除最後一項，因爲最後一項沒有要比較的內容）
和當前拿出項後面每一項比較
如果有重複的，我們把找到的這個重複項在原有數組中刪除掉

var ary=[1,2,2,3,4,5,6,6,7];
for(var i=0;i<ary.length-1;i++)
{
for(var j=i+1;j<ary.length;j++)
{
ary[i]===ary[j]?ary.splice(j,1):null;
}
}
console.log(ary);
//這樣做會發生數組塌陷，刪除後後面向前進一位，原有數組發生改變，索引改變，此時j繼續累加，下一次拿出來的結果就會跳過一位
var ary=[1,2,2,2,3,4,5,6,6,7]
==>[1, 2, 2, 3, 4, 5, 6, 7]
//所以改爲
for(var i=0;i<ary.length-1;i++)
{
for(var j=i+1;j<ary.length;j++)
{
if(ary[i]===ary[j])
{
ary.splice(j,1);
j--;//先減後加
}
}
}

【解決方案二】：
浪費性能
不推薦使用雙for循環
基於對象屬性名不能重複
var ary=[1,2,3,2,2,3,4,3,4,5]

創建幾個空對象
依次遍歷數組中的每一項，把每一項存儲值當作對象的屬性名和屬性值存儲起來
第一次循環 1 {1：1}
第二次循環 2{1：1，2：2}
第三次循環 3{1：1，2：2，3：3}
第四次循環 2 我們在存儲之前做一個判斷，判斷當前對象中是否已經存在屬性名了，如果存在，說明之前有這一項存儲的操作，進一步說明之前數組中出現過這個數值了（也就是重重複了，此時我們把當前項從數組中移除即可）

如何判斷對象中是否這個屬性，如果沒有這個屬性獲取的值是undefined

var ary=[1,2,3,2,2,3,4,3,4,5];
var obj={};
for(var i=0;i<ary.length;i++){
  var item=ary[i];
  //存儲之前要做判斷：如果對象中已經存在這個屬性，說明當前item出現過，也就是當前項重複了，我們把當前刪掉
  if(typeof obj[item]!=='undefined'){
    // ary.splice(i,1);
    // i--;//防止數組塌陷
    // 這種刪除方式不好，改索引耗性能
    // 1.我們把數組最後一項結果獲取到，替換當前項內容
    // 2.再把數組最後一項刪除
    ary[i]=ary[ary.length-1];
    ary.length--;
    i--;//把新值放在這一項，新值還沒比較，所以不能+1開始下一項
    continue;//繼續下一個循環
  }
  obj[item]=item;
}
console.log(ary);
//注意typeof都是小寫

7. 字符串方法

項目中也需要對字符串進行處理，常用方法有
【indexOf/lastIndexOf】和數組一樣
【str.toUpperCase/toLowerCase】改變大小寫
【replace】替換字符串中原有字符
【split】和join對象，把字符串轉化爲數組str.split(’,’)

字符串截取

【slice】str.slice(n,m)從索引n開始找到索引m處（不包含m）,把找到的字符當新字符串返回，支持負數索引
【substring】和slice語法一模一樣，唯一區別在於：substring不支持負數索引
【substr】str.substr(n,m)，從索引n開始截取m個字符, 支持負數索引,第二個參數不傳，截取到末尾，支持第一個索引爲負數索引