JavaScript從數(shù)組中刪除特定數(shù)據(jù)的方法總結(jié)
前言
增刪改查是我們?nèi)粘i_發(fā)中的最基本任務,在JavaScript中我們經(jīng)常需要從數(shù)據(jù)組刪除特定的數(shù)據(jù)項。然而,JavaScript數(shù)組中并沒有提供刪除特定數(shù)據(jù)項的方法。所以我們必須使用替代的方法,來從javaScript中刪除特定數(shù)據(jù)項。
如何在Javascript中刪除特定的數(shù)組項
1:使用 filter()
使用現(xiàn)代 Javascript 刪除特定數(shù)組項的最簡單方法是使用過濾器。讓我們看一個簡單的例子:
let myArr = [ "??", "??", "??", "??" ]; let removedArr = myArr.filter((x) => x !== "??"); console.log(removedArr);
當我們的數(shù)組中的每一個數(shù)據(jù)想都是唯一的時候,他是正常工作的,但是當我們的存在重復項的時候,此時如果你只想刪除一個,保留其他重復的,這種方式是無法做到的。
let myArr = [ "??", "??", "??", "??" ]; let removedArr = myArr.filter((x) => x !== "??"); console.log(removedArr);
由于我們有兩個青蘋果,并且新數(shù)組過濾掉了所有青蘋果,因此我們在使用此方法時實際上刪除了兩個項目。如果我們只想刪除一個元素,我們必須使用另一種方法。
2:使用 indexOf() 和 splice()
indexOf() 方法可返回某個指定的字符串值在字符串中首次出現(xiàn)的位置。如果沒有找到匹配的字符串則返回 -1。 splice() 方法用于添加或刪除數(shù)組中的元素。注意:這種方法會改變原始數(shù)組。 這種方式與上面的區(qū)別在于:
- 首先,它改變了原始數(shù)組——所以我們不在這里復制。原始數(shù)組將被改變。
- 其次,它使用兩個函數(shù)——首先我們獲取indexOf要刪除的數(shù)組項,然后我們splice獲取數(shù)組以刪除單個項。
這是一個例子:
let myArr = [ "??", "??", "??", "??" ]; let getLocation = myArr.indexOf("??"); myArr.splice(getLocation, 1); // myArr now becomes [ "??", "??", "??" ]; console.log(myArr);
附:js delete方法刪除指定位置的數(shù)組元素
delete方法可以通過數(shù)組的下標將js數(shù)組中的一個元素從指定位置上刪除,且刪除掉數(shù)組中的元素后,會把該下標出的值置為undefined,數(shù)組的長度不會變。
語法:
delete.數(shù)組[數(shù)組下標];/*數(shù)組下標控制指定位置,下標從0開始*/
代碼實例:刪除animal數(shù)組的第二項元素,即:animal[1],然后animal[1]的值會為:undefined。
<!DOCTYPE html> <html> ? ? <head> ? ? ? ? <meta charset="UTF-8"> ? ? </head> ? ? <body> ? ? ? ? <div class="demo"> ? ? ? ? ? ? <p>數(shù)組:cat,elephant,tiger,rabbit;<br>數(shù)組長度為:4</p> ? ? ? ? ? ? <button onclick="myFunction()">點我--delete刪除元素</button> ? ? ? ? </div> ? ? </body> ? ? <script type="text/javascript"> ? ? ? ? function myFunction(){ ? ? ? ? ? ?var animal = ["cat", "elephant", "tiger","rabbit"]; ? ? ? ? ? ?document.write("<p>數(shù)組:"+animal+"<br>數(shù)組長度:"+ animal.length+"</p>"); ? ? ? ? ? ?var animal1= delete animal[1]; ? ? ? ? ? ?document.write("<p>新數(shù)組:"+animal+"<br>刪除元素后,現(xiàn)在為:"+ animal[1]+"<br>數(shù)組長度:"+ animal.length+"</p>"); ? ? ? ? } ? ? </script> </html>
總結(jié)
盡管在 Javascript 中沒有直接從數(shù)組中刪除項目的方法,但我們確實有兩個工具可以為我們提供足夠的靈活性來涵蓋幾乎所有有關刪除數(shù)組項目的場景。
到此這篇關于JavaScript從數(shù)組中刪除特定數(shù)據(jù)的文章就介紹到這了,更多相關js數(shù)組刪除特定數(shù)據(jù)內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
onbeforeunload與onunload事件異同點總結(jié)
本文對onbeforeunload與onunload事件的異同點、觸發(fā)于、可以用在哪些元素以及解決刷新頁面時不調(diào)用onbeforeunload等等,感興趣的朋友可以參考下哈2013-06-06