JavaScript 用forEach循環中的數組刪除元素

發表於 | 更新於 | 分類於

用forEach循環中的數組刪除元素

Array.prototype.splice

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var pre = document.getElementById('out');

function log(result) {
  pre.appendChild(document.createTextNode(result + '\n'));
}

var review = ['a', 'b', 'c', 'b', 'a'];

review.forEach(function(item, index, object) {
  if (item === 'a') {
    object.splice(index, 1);
  }
});

log(review);
1
<pre id="out"></pre>

b,c,b

刪除數組指定的值後，後面的值會遞補位置，所以會有以下的情況

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var pre = document.getElementById('out');

function log(result) {
  pre.appendChild(document.createTextNode(result + '\n'));
}

var review = ['a', 'a', 'b', 'c', 'b', 'a', 'a'];

review.forEach(function(item, index, object) {
  if (item === 'a') {
    object.splice(index, 1);
  }
});

log(review);
1
<pre id="out"></pre>

a,b,c,b,a

ES5 - Array.prototype.reduceRight

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var pre = document.getElementById('out');

function log(result) {
  pre.appendChild(document.createTextNode(result + '\n'));
}

var review = ['a', 'a', 'b', 'c', 'b', 'a', 'a'];

review.reduceRight(function(acc, item, index, object) {
  if (item === 'a') {
    object.splice(index, 1);
  }
}, []);

log(review);
1
<pre id="out"></pre>

b,c,b

ES5 - Array.prototype.forEach

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var pre = document.getElementById('out');

function log(result) {
  pre.appendChild(document.createTextNode(result + '\n'));
}

var review = ['a', 'a', 'b', 'c', 'b', 'a', 'a'];

review.slice().reverse().forEach(function(item, index, object) {
  if (item === 'a') {
    review.splice(object.length - 1 - index, 1);
  }
});

log(review);
1
<pre id="out"></pre>

b,c,b

ES6 - yield

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
var pre = document.getElementById('out');

function log(result) {
  pre.appendChild(document.createTextNode(result + '\n'));
}

function* reverseKeys(arr) {
  var key = arr.length - 1;

  while (key >= 0) {
    yield key;
    key -= 1;
  }
}

var review = ['a', 'a', 'b', 'c', 'b', 'a', 'a'];

for (var index of reverseKeys(review)) {
  if (review[index] === 'a') {
    review.splice(index, 1);
  }
}

log(review);

1
<pre id="out"></pre>

b,c,b

後記

Array.prototype.filter 但是這不會改變原來的數組，而是創建一個新的數組。

參考

0%