JavaScript運算元組

熊仔其人發表於2024-12-02
JavaScript

陣列的遍歷、插入、刪除操作

在JavaScript中，陣列是一種常見的資料結構，可以包含多個元素，並且可以進行遍歷、插入和刪除等操作。下面分別介紹陣列的遍歷、插入和刪除操作。
1，陣列的判斷：
程式碼不能操作空物件（空指標），在運算元組之前，一般建議先判斷陣列是否為空。

let arr = [1, 2, 3]; // 假設有一個變數名為arr，判斷arr是否為空
if (Array.isArray(arr)) {  
  console.log("arr 是陣列");
  if (0 < arr.length) {  
    console.log("arr 陣列非空");
  } else {  
    console.log("arr 陣列是空，沒有子元素");  
  }

} else {  
  console.log("arr 不是陣列");  
}

2，陣列的遍歷：
使用for迴圈、forEach方法、for...of迴圈或map方法等，可以對陣列進行遍歷操作。下面是幾種常見的遍歷方式示例：

// for迴圈
const arr = [1, 2, 3, 4, 5];  
for (let i = 0; i < arr.length; i++) {  
  console.log(arr[i]); // 輸出陣列中的每個元素  
}

// forEach方法（箭頭函式）
const arr = [1, 2, 3, 4, 5];  
arr.forEach(item => {  
  console.log(item);  
});  
// forEach方法（匿名函式）
const arr = [1, 2, 3, 4, 5];  
arr.forEach(function(element, index, array) {  
  console.log(element); // 輸出陣列中的每個元素  
});

// for...of迴圈
const arr = [1, 2, 3, 4, 5];  
for (const element of arr) {  
  console.log(element); // 輸出陣列中的每個元素  
}  

// map方法（匿名函式）
let arr = [1, 2, 3, 4];
let newArr = arr.map(function(x) { return x * 2; });
console.log(newArr); // [2, 4, 6, 8]
// map方法（箭頭函式）
const arr = [1, 2, 3, 4, 5];  
arr.map(item => {  
  console.log(item);  
});
// map方法（使用thisValue）
const myObject = {a: 1};
arr.map((num) => { console.log(this); }, myObject);
// 現在，當回撥函式被呼叫時，this將指向myObject，意味著可以從回撥函式中訪問myObject的屬性和方法。

/* 注意返回值：Array.map()方法不會修改原陣列，而是返回一個新陣列，新陣列中的元素是透過回撥函式處理後的結果‌ */

3，陣列的插入和刪除操作：
在JavaScript陣列中插入元素通常涉及以下幾種方法：push、unshift、splice

// push方法（在陣列末尾插入）
const arr = [1, 2, 3];  
arr.push(4); // arr現在是[1, 2, 3, 4]  

// unshift方法（在陣列開頭插入）
const arr = [1, 2, 3];  
arr.unshift(0); // arr現在是[0, 1, 2, 3]  

// splice方法（在任意位置插入）
const arr = [1, 2, 4];  
arr.splice(2, 0, 3); // arr現在是[1, 2, 3, 4]，在索引2的位置插入3，不刪除任何元素

從JavaScript陣列中刪除元素可以透過以下方法實現：pop、shift、splice、filter

// pop方法（刪除並返回陣列最後一個元素）
const arr = [1, 2, 3, 4];  
const last = arr.pop(); // last是4，arr現在是[1, 2, 3]  

// shift方法（刪除並返回陣列第一個元素）
const arr = [1, 2, 3, 4];  
const first = arr.shift(); // first是1，arr現在是[2, 3, 4]  

// splice方法（刪除任意位置的元素）
const arr = [1, 2, 3, 4];  
arr.splice(1, 2); // arr現在是[1, 4]，從索引1開始刪除2個元素  

// filter方法（根據條件刪除元素）
const arr = [1, 2, 3, 4, 5];  
const newArr = arr.filter(function(element) {  
  return element !== 3; // 刪除值為3的元素，newArr現在是[1, 2, 4, 5]  
});  
/* 請注意，filter方法不會修改原始陣列，而是返回一個新陣列。如果你想修改原始陣列，你可以使用splice結合迴圈，或者使用其他會修改原始陣列的方法。 */

相關文章