数组的创建和初始化
使用数组字面量
创建一个数组最简单的方法是使用数组字面量。数组字面量是一个由逗号分隔的元素列表,这些元素被包含在一对方括号 []
中。
let numbers = [1, 2, 3, 4, 5];
使用 Array 构造函数
除了使用数组字面量外,还可以使用 Array
构造函数来创建数组。构造函数可以接受多个参数或一个表示数组长度的数字。
// 接受多个参数 let fruits = new Array('apple', 'banana', 'cherry'); // 接受一个表示数组长度的数字 let emptyArray = new Array(10); // 创建一个包含10个 undefined 的数组
访问和修改数组元素
访问数组元素
数组元素可以通过索引来访问,索引从 0 开始。通过索引访问数组元素就像访问普通变量一样简单。
let fruits = ['apple', 'banana', 'cherry']; console.log(fruits[0]); // 输出 "apple" console.log(fruits[2]); // 输出 "cherry"
修改数组元素
通过索引也可以修改数组中的元素。
let fruits = ['apple', 'banana', 'cherry']; fruits[1] = 'orange'; console.log(fruits); // 输出 ["apple", "orange", "cherry"]
数组的属性和方法
length 属性
length
属性用于获取或设置数组的长度。当设置一个新的长度时,数组会根据新长度进行扩展或收缩。
let fruits = ['apple', 'banana', 'cherry']; console.log(fruits.length); // 输出 3 fruits.length = 2; console.log(fruits); // 输出 ["apple", "banana"] fruits.length = 5; console.log(fruits); // 输出 ["apple", "banana", "cherry", undefined, undefined]
push 和 pop 方法
push
方法可以在数组末尾添加一个或多个元素,并返回新的数组长度。
let fruits = ['apple', 'banana', 'cherry']; fruits.push('orange'); console.log(fruits); // 输出 ["apple", "banana", "cherry", "orange"]
pop
方法可以从数组末尾删除一个元素,并返回该元素。
let fruits = ['apple', 'banana', 'cherry', 'orange']; let lastFruit = fruits.pop(); console.log(lastFruit); // 输出 "orange" console.log(fruits); // 输出 ["apple", "banana", "cherry"]
unshift 和 shift 方法
unshift
方法可以在数组开头添加一个或多个元素,并返回新的数组长度。
let fruits = ['apple', 'banana', 'cherry']; fruits.unshift('orange'); console.log(fruits); // 输出 ["orange", "apple", "banana", "cherry"]
shift
方法可以从数组开头删除一个元素,并返回该元素。
let fruits = ['orange', 'apple', 'banana', 'cherry']; let firstFruit = fruits.shift(); console.log(firstFruit); // 输出 "orange" console.log(fruits); // 输出 ["apple", "banana", "cherry"]
slice 和 splice 方法
slice
方法用于提取数组的一部分,并返回一个新的数组。
let fruits = ['apple', 'banana', 'cherry', 'orange']; let slicedFruits = fruits.slice(1, 3); console.log(slicedFruits); // 输出 ["banana", "cherry"]
splice
方法用于添加或删除数组中的元素,并返回被删除的元素。
let fruits = ['apple', 'banana', 'cherry', 'orange']; let removedFruits = fruits.splice(1, 2); console.log(removedFruits); // 输出 ["banana", "cherry"] console.log(fruits); // 输出 ["apple", "orange"]
forEach 方法
forEach
方法用于遍历数组中的每个元素,并执行提供的函数。
-- -------------------- ---- ------- --- ------ - --------- --------- ---------- ------------------------------ - ------------------- --- -- --- -- ----- -- ------ -- ------
map 方法
map
方法用于创建一个基于原数组中每个元素的新数组。
let numbers = [1, 2, 3, 4, 5]; let squaredNumbers = numbers.map(function(number) { return number * number; }); console.log(squaredNumbers); // 输出 [1, 4, 9, 16, 25]
filter 方法
filter
方法用于创建一个基于条件的新数组。
let numbers = [1, 2, 3, 4, 5]; let evenNumbers = numbers.filter(function(number) { return number % 2 === 0; }); console.log(evenNumbers); // 输出 [2, 4]
reduce 方法
reduce
方法用于将数组缩减为单个值。
let numbers = [1, 2, 3, 4, 5]; let sum = numbers.reduce(function(total, number) { return total + number; }, 0); console.log(sum); // 输出 15
数组排序
sort 方法
sort
方法用于对数组元素进行排序。默认情况下,它将元素转换为字符串并按照字符编码顺序进行排序。
let numbers = [4, 2, 5, 1, 3]; numbers.sort(); console.log(numbers); // 输出 [1, 2, 3, 4, 5] let fruits = ['banana', 'apple', 'cherry']; fruits.sort(); console.log(fruits); // 输出 ["apple", "banana", "cherry"]
可以通过提供一个比较函数来自定义排序规则。
let numbers = [4, 2, 5, 1, 3]; numbers.sort(function(a, b) { return a - b; }); console.log(numbers); // 输出 [1, 2, 3, 4, 5]
多维数组
创建多维数组
多维数组是指数组的元素也是数组。
let matrix = [ [1, 2, 3], [4, 5, 6], [7, 8, 9] ];
访问多维数组元素
可以通过多次索引访问多维数组中的元素。
let matrix = [ [1, 2, 3], [4, 5, 6], [7, 8, 9] ]; console.log(matrix[0][0]); // 输出 1 console.log(matrix[2][2]); // 输出 9
遍历多维数组
遍历多维数组需要嵌套循环。
-- -------------------- ---- ------- --- ------ - - --- -- --- --- -- --- --- -- -- -- ---------------------------- - -------------------------- - ------------------ --- --- -- --- -- - -- - -- - -- - -- - -- - -- - -- - -- -
数组去重
使用 Set 去重
ES6 引入了 Set
数据结构,它只允许存储唯一的值,因此可以用来去重。
function unique(arr) { return [...new Set(arr)]; } let numbers = [1, 2, 2, 3, 4, 4, 5]; let uniqueNumbers = unique(numbers); console.log(uniqueNumbers); // 输出 [1, 2, 3, 4, 5]
使用 filter 去重
也可以通过 filter
方法实现去重。
-- -------------------- ---- ------- -------- ----------- - --- ---- - --- ------ ------------------------- - ------ ------------------------- - ----- - ----------- - ------ --- - --- ------- - --- -- -- -- -- -- --- --- ------------- - ---------------- --------------------------- -- -- --- -- -- -- --
以上便是关于 JavaScript 数组操作的详细介绍。数组是 JavaScript 中非常重要的数据结构之一,在日常开发中广泛使用。熟练掌握数组的各种操作和方法对于提高编程能力至关重要。