在 JavaScript 中,陣列(Array)是一種用於存儲多個值的有序集合。陣列可以包含各種不同的值,包括數字、字串、物件、函數等。
以下是一些關於 JavaScript 陣列的重要概念和特性:
宣告陣列:可以使用 []
或 Array
關鍵字來宣告一個陣列。
陣列可以放各種型態:
const array1 = []; // 使用 []
const array2 = Array(); // 使用 Array 關鍵字
#陣列可以放各種型態:
let data = ["孫悟空" ,123, 3.14, false, undefined, null]
存取陣列元素:可以使用索引來存取陣列中的元素。陣列的索引從 0 開始,最後一個元素的索引為 陣列長度 - 1。 修改陣列元素:可以通過索引對陣列中的元素進行修改。
const array = [10, 20, 30];
console.log(array[0]); // 存取第一個元素,輸出 10
console.log(array[2]); // 存取第三個元素,輸出 30
//修改
array[1] = 25; // 修改第二個元素的值
console.log(array); // 輸出 [10, 25, 30]
****陣列的長度:可以使用 length
屬性獲取陣列的長度。
const array = [10, 20, 30];
console.log(**array.length**); // 輸出 3,陣列中有三個元素
迭代陣列:可以使用迴圈(如 for
迴圈或 forEach
方法)來迭代陣列中的元素。
const array = [10, 20, 30];
1.
for (let i = 0; i < array.length; i++) {
console.log(array[i]);
}
2.
**array.forEach**((element) => { #對於每個element去顯示值
console.log(element);
});
陣列方法:JavaScript 提供了許多內建的陣列方法,例如 push
、pop
、shift
、unshift
等,用於在陣列上進行各種操作。
array.push(40)
: 陣列末尾添加元素
array.pop()
: 刪除在陣列末尾元素
array.unshift(5)
: 在陣列開頭添加元素
array.shift()
: 刪除陣列開頭的元素
const array = [10, 20, 30];
**array.push**(40); // 在陣列末尾添加元素
console.log(array); // 輸出 [10, 20, 30, 40]
**array.pop**(); // 刪除陣列末尾的元素
console.log(array); // 輸出 [10, 20, 30]
**array.unshift**(5); // 在陣列開頭添加元素
console.log(array); // 輸出 [5, 10, 20, 30]
**array.shift**(); // 刪除陣列開頭的元素
console.log(array); // 輸出 [10, 20, 30]
array.splice
: 刪除、插入或替換陣列
const array = [10, 20, 30, 40, 50];
**array.splice**(2, 1); // 從索引 2 的位置刪除 1 個元素
console.log(array); // [10, 20, 40, 50]
**array.splice**(1, 0, 15, 25); // 從索引1的位置(砍0個元素), 插入元素 15 和 25
console.log(array); // [10, 15, 25, 20, 30, 40, 50]
**array.splice**(3, 2, 35, 45); // 從索引3(40), 砍掉2個元素(40&50) 加入元素 35 和 45
console.log(array); // [10, 20, 30, 35, 45]
array.concat()
: 將兩個或多個陣列合併為一個新的陣列。
var array1 = [1, 2, 3];
var array2 = [4, 5, 6];
var result1 = array1.concat(array2);
console.log(result1); // [1, 2, 3, 4, 5, 6]
var result2 = array1.concat(10, 11);
console.log(result2); // [1, 2, 3, 10, 11]
array.slice()
: 從陣列中提取陣列。 使用兩個參數, 起始索引(包含) 和結束索引(不包含)
let array = [1, 2, 3, 4, 5];
var result1 = array.slice(1, 3);
console.log(result1); // [2, 3]
let result2 = array.slice(2);
console.log(result2); // [3, 4, 5]
var result3 = array.slice(-2);
console.log(result3); // [4, 5]
搜尋陣列元素:或者使用 includes
方法檢查陣列中是否包含指定元素。
array.indexOf(30)
: 找尋某個元素, 會印出元素的索引值 (if 不存在的話會印出**-1**)
array.includes(40)
: 確認某個元素是否有在陣列內, 印出布林值
const array = [10, 20, 30, 40, 50];
console.log(**array.indexOf**(30)); // 2 ,30 的索引位置
console.log(**array.includes**(40)); // true,陣列包含元素 40
陣列的排序和反轉:可以使用 sort
方法對陣列元素進行排序,或者使用 reverse
方法將陣列元素順序反轉。
這是針對字串長度的排序
const array = [30, 10, 50, 20, 40];
**array.sort**(); // 對陣列元素進行排序
console.log(array); // 輸出 [10, 20, 30, 40, 50]
sort()
+ 匿名函數
const numbers = [19, 5, 42, 2, 77];
//升序
*numbers.sort((a, b) => a - b); // numbers.sort(function(a, b){ a* - b });
console.log(numbers); // [2, 5, 19, 42, 77]
//降序
*numbers.sort((a, b) => b - a);*
console.log(numbers); //[77, 42, 19, 5, 2]
const arr = [5, 9, 1, 3, 2, 6];
// 升序
arr.sort(function(a, b) {
if(a > b){
return 1; // 正數時,後面的數放在前面
} else {
return -1 // 負數時,前面的數放在前面
}
});
// 降序
arr.sort(function(a, b) {
if(a < b){
return 1; // 正數時,後面的數放在前面
} else {
return -1 // 負數時,前面的數放在前面
}
});
length
: **length
**屬性用於獲取字串或陣列的長度。它返回字串中的字符數或陣列中的元素數量。indexOf()
: **indexOf()
**方法在字串或陣列中搜索指定的元素,並返回第一個匹配的索引位置。如果未找到匹配的元素,則返回-1。slice()
: **slice()
**方法在字串或陣列中截取指定範圍的部分,並返回一個新的字串或陣列,不影響原始的字串或陣列。