移除JavaScript陣列中所有空索引
假設有一個數組包含一些空索引,需要移除這些空索引。
讓我們看看輸入輸出場景:
假設有一個包含一些空索引的陣列。現在我們需要排除它們,並返回只有真值元素。
Array = [22, 45, , 56, 71, , 10]; Output = [22, 45, 56, 71, 10]
正如我們在輸出中看到的,陣列中空索引已被移除。我們可以使用多種方法來完成上述任務,讓我們看看解決方法。
使用filter()方法
JavaScript中的filter()方法將建立一個包含滿足函式給定條件的元素的新陣列。此方法不會對空元素執行操作,也不會更改或修改現有陣列。
語法
以下是JavaScript中filter()方法的語法:
array.filter(function(currentValue index, arr));
引數
function()引數是一個函式,用於迭代每個陣列元素。
currentValue引數,這將是當前元素的值。
index引數,這將是當前元素的索引。
arr引數將是當前元素的陣列。
此filter()方法將返回一個包含滿足函式中條件的元素的新陣列。如果沒有任何元素透過條件,則返回空陣列。
示例
在下面的示例中,我們有一個包含空索引的陣列。我們使用了filter()方法來移除空索引。我們呼叫了filter()方法並將一個函式傳遞給它。對於陣列中函式的每次迭代,它將返回當前項。現在它將過濾所有假值(空索引)並返回一個包含陣列中真值項的新陣列。
<!DOCTYPE html>
<html>
<head>
<title>Removing all the empty indices from array</title>
<button onClick = "fun()">Click! </button>
<p id = "para"> </p>
</head>
<body>
<script>
const array = ['Hello', 'Tutorialspoint', , , , 23, , 5, 7];
function fun(){
const res = array.filter(item => {
return item;
});
document.getElementById("para").innerHTML = res;
};
</script>
</body>
</html>
在輸出中,我們可以看到filter()方法過濾了所有空索引(假值)並返回所有真值。
示例:使用While迴圈
實現上述所需任務的另一種方法是使用while迴圈。
在下面的示例中:
我們有一個包含一些空索引的陣列。
然後我們建立了一個空陣列來推送將滿足迴圈中條件的值。
然後我們有一個while迴圈,並檢查元素是否存在,並將它們推入新陣列。
<!DOCTYPE html>
<html>
<head>
<title>Removing all the empty indices from array</title>
<button onClick = "func()"> Click here! </button>
<p id = "para"></p>
</head>
<body>
<script>
const array = [, , , , 4, , 6, 22, , 7, 5,77];
document.write("Existing array : " , array);
function func(){
const resArr = [];
let i = 0;
while (i < array.length) {
i++;
if (array[i]) {
resArr.push(array[i]);
}
};
document.getElementById("para").innerHTML = "After removing empty indices: " + resArr;
};
</script>
</body>
</html>
在輸出中,我們可以看到陣列中存在的元素被推入新陣列。
使用forEach()方法
JavaScript中的forEach()方法對陣列中的每個元素呼叫一個函式,此方法不會對空元素執行操作。
語法
以下是JavaScript中forEach()方法的語法,返回值為undefined。
array.forEach(function(currentValue, index, arr), thisValue)
引數
function引數將迭代每個陣列元素。
currentValue是陣列中當前元素的值。
index是當前元素的索引。
arr,此引數是當前元素的陣列。
示例
在這個例子中:
我們有一個包含空索引的陣列。透過使用forEach()方法,我們已經從陣列中移除了所有空索引。
我們建立了一個空陣列來儲存非空元素。forEach()方法將遍歷陣列,對於每次迭代,它將檢查當前元素是否為null。
如果元素不為null,則我們將元素推入空陣列。
<!DOCTYPE html>
<html>
<head>
<title>Removing all the empty indices from array</title>
<button onClick = "func()"> Click me! </button>
<p id = "para"></p>
</head>
<body>
<script>
const array = ['apple', , , 'ball', , , , , 93];
const ResArray = [];
function func(){
array.forEach(item => {
if (item !== null) {
ResArray.push(item);
}
});
document.getElementById("para").innerHTML = ResArray;
};
</script>
</body>
</html>
正如我們在輸出中看到的,我們已經使用forEach()方法將所有非空索引推入空陣列。
資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP