1. 問題の説明
配列トラバーサルの場合、 splice メソッドを使用して適格な要素を削除します。splice メソッドは元の配列の長さを変更しますが、ループ内の i は依然として元の配列の長さを読み取るため、条件に一致する配列内の一部の要素がスキップまたは削除されるだけです。
デモ
const studentList = [
{
name: 'Tom', grade: 55 },
{
name: 'Jane', grade: 59 },
{
name: 'Murphy', grade: 80 }
]
for(let i = 0; i < studentList.length; i++) {
if (studentList[i].grade < 60) {
studentList.splice(i, 1)
}
}
印刷結果
2.スキーム1
リアルタイム同期インデックス方式。配列トラバーサルの場合、条件に一致する要素に対して splice メソッドを実行すると、読み込んだインデックスを splice 後の配列と同期する
i--操作。
デモ
const studentList = [
{
name: 'Tom', grade: 55 },
{
name: 'Jane', grade: 59 },
{
name: 'Murphy', grade: 80 }
]
for(let i = 0; i < studentList.length; i++) {
if (studentList[i].grade < 60) {
studentList.splice(i, 1)
i--
}
}
印刷結果
3.スキーム2
逆順走査方式。splice メソッドは元の配列を直接操作するため、配列の幅が小さくなり、次の要素が前方に押し出されます。したがって、後ろから前へ読み込んでいくと、削除条件が成立するか否かに関わらず、ループごとに正しい配列項目の値が読み出されます。
デモ
const studentList = [
{
name: 'Tom', grade: 55 },
{
name: 'Jane', grade: 59 },
{
name: 'Murphy', grade: 80 }
]
for(let i = studentList.length - 1; i >= 0; i--) {
if (studentList[i].grade < 60) {
studentList.splice(i, 1)
}
}
印刷結果
4.スキーム3
代わりにフィルタリングします。filter メソッドは splice メソッドとは異なり、元の配列を変更せずに、条件を満たす要素の新しい配列を作成して返します。
デモ
const studentList = [
{
name: 'Tom', grade: 55 },
{
name: 'Jane', grade: 59 },
{
name: 'Murphy', grade: 80 }
]
const goodStudentList = studentList.filter(student => {
return student.grade > 60
})
印刷結果
