2021-06-29-陣列移除指定資料

前言：
關於陣列移除，印象之前在開發時候就有找過如何移除特定 ITEM。但今天測試時後才發現那時候眼睛業障重，根本沒有移除。所以今天就順便紀錄一下如何移除指定 ITEM 資料。

---

參考資料：
Array.prototype.includes()
9 Ways to Remove Elements From A JavaScript Array - Plus How to Safely Clear JavaScript Arrays
Comparing and Filtering two arrays

---

情境如下：

我今天有一筆陣列 let array = ["20210607001","20210607003","20210607002"] 當今天使用者在刪除資料時，假設他輸入資料如 "20210607001"，此時我的 array 裡面有這筆資料，這時候我想要移除這筆資料，該怎麼處理?

更新寫法20210630：

原本以為昨天測試完後，程式碼應該就沒問題。但今天再測試時候，又發現昨天寫法會動到原本既有的 Array ，主要原因在於我目前情況為兩個陣列長度不同，而我在 splice 資料時候因為 index 不同，會刪除錯筆資料。所以今天又改寫一版。希望沒問題了吧!?

function DeleteOldArray(data,ColumnName) {
    // Step1. 先New 一個空的 Array
    let tempArray = [];
    // Step2. 這邊會需要這樣寫，是因為 Kendo 回寫陣列時，我取道資料並不是陣列，所以才再轉一次
    if (data[ColumnName]._events !== undefined) {
        tempArray = data[ColumnName].toJSON(); //轉回json
    }
    else {
        tempArray = data[ColumnName];
    }
    // Step3. 將處理好 Array 回填進原本陣列中
    data[ColumnName] = tempArray;

    // Step4. 刪除Old Array
    let NewArray = [];
    // Step5. 以全域資料為主體跟 原本舊陣列做比對，清除舊陣列資料
    NewArray = checkTempSerialData.filter((item) => {
        return data[ColumnName].includes(item) !== true;
    });
    // Step6. 重新賦值
    checkTempSerialData = NewArray;
}

延伸想法

如果我今天不是兩個 array 作比對的話，是多於兩個的話，我是否可以在傳入參數時，另外一個參數為陣列集合或是或把兩個陣列直接合併( concact )、展開運算式

原本想法如下20210629：

我原本想說陣列本身有沒有可以直接移除特定 ITEM 方法，但我後來發現沒有。進而想到可以用 Filter 跟 includes 做搭配處理，寫法如下

let array = ["20210607001","20210607003","20210607002"]
array.filter((item,index) => {
   if(array.includes(item)){
      array.splice(index,1); // 移除傳入的 ITEM
   }
});

但這種方法只適用於一次移除一筆且資料為 KEY 值，如果是多筆有重複就會發生重複資料序號往前，造成資料沒有篩選成功!例如：

let arr = [1, 2, 3, 4, 5, 5, 6, 7, 8, 5, 9, 0];
let filtered = arr.filter(function(value, index, arr){ 
        if(value === 5){
              arr.splice(index,1)
           }
    });
console.log(arr); //[1, 2, 3, 4, 5, 6, 7, 8, 9, 0]

補充

剛看了參考文章，發現其實也可以把 塞選寫成一個 Function ，每次都可以直接呼叫!例如：

function arrayRemove(arr, value) { 
    
        return arr.filter(function(ele){ 
            return ele != value; 
        });
    }
    
    var result = arrayRemove(array, 6);
    // result = [1, 2, 3, 4, 5, 7, 8, 9, 0]