js array添加元素|极客笔记

js array添加元素

在JavaScript中，数组是一种常用的数据结构，用于存储和操作多个值。在实际开发中，我们经常需要向数组中添加元素。本文将详细介绍在JavaScript中如何添加元素到数组中。

一、使用push()方法

push()方法是JavaScript数组原生提供的方法，用于向数组的末尾添加一个或多个元素，并返回新的数组长度。

语法

array.push(element1, element2, ..., elementN);

示例代码

let fruits = ['apple', 'banana', 'orange'];
console.log(fruits); // 输出：['apple', 'banana', 'orange']

fruits.push('grape');
console.log(fruits); // 输出：['apple', 'banana', 'orange', 'grape']

fruits.push('watermelon', 'kiwi');
console.log(fruits); // 输出：['apple', 'banana', 'orange', 'grape', 'watermelon', 'kiwi']

运行结果

['apple', 'banana', 'orange']
['apple', 'banana', 'orange', 'grape']
['apple', 'banana', 'orange', 'grape', 'watermelon', 'kiwi']

二、使用concat()方法

concat()方法也是JavaScript数组原生提供的方法，用于连接两个或多个数组，并返回一个新的数组。通过传递要添加到数组中的元素作为参数，可以将元素添加到现有数组的末尾。

语法

array.concat(value1, value2, ..., valueN);

示例代码

let fruits1 = ['apple', 'banana', 'orange'];
console.log(fruits1); // 输出：['apple', 'banana', 'orange']

let fruits2 = fruits1.concat('grape');
console.log(fruits2); // 输出：['apple', 'banana', 'orange', 'grape']

let fruits3 = fruits1.concat('watermelon', 'kiwi');
console.log(fruits3); // 输出：['apple', 'banana', 'orange', 'watermelon', 'kiwi']

运行结果

['apple', 'banana', 'orange']
['apple', 'banana', 'orange', 'grape']
['apple', 'banana', 'orange', 'watermelon', 'kiwi']

三、使用直接赋值语法

JavaScript中的数组是动态的，可以通过直接赋值的方式添加元素。

示例代码

let fruits = ['apple', 'banana', 'orange'];
console.log(fruits); // 输出：['apple', 'banana', 'orange']

fruits[3] = 'grape';
console.log(fruits); // 输出：['apple', 'banana', 'orange', 'grape']

运行结果

['apple', 'banana', 'orange']
['apple', 'banana', 'orange', 'grape']

四、使用splice()方法

splice()方法是JavaScript数组原生提供的方法，可以实现在给定位置添加或删除元素，并返回被删除的元素。通过设置0作为删除的数量，可以在指定的位置添加元素。

语法

array.splice(index, 0, element1, element2, ..., elementN);

示例代码

let fruits = ['apple', 'banana', 'orange'];
console.log(fruits); // 输出：['apple', 'banana', 'orange']

fruits.splice(2, 0, 'grape');
console.log(fruits); // 输出：['apple', 'banana', 'grape', 'orange']

运行结果

['apple', 'banana', 'orange']
['apple', 'banana', 'grape', 'orange']

五、使用ES6扩展运算符

在ES6中，可以使用扩展运算符来添加一个或多个元素到数组中。扩展运算符可以将一个数组中的元素展开，并逐个添加到新数组中。

示例代码

let fruits = ['apple', 'banana', 'orange'];
console.log(fruits); // 输出：['apple', 'banana', 'orange']

let newFruits = [...fruits, 'grape'];
console.log(newFruits); // 输出：['apple', 'banana', 'orange', 'grape']

let moreFruits = [...fruits, 'watermelon', 'kiwi'];
console.log(moreFruits); // 输出：['apple', 'banana', 'orange', 'watermelon', 'kiwi']

运行结果

['apple', 'banana', 'orange']
['apple', 'banana', 'orange', 'grape']
['apple', 'banana', 'orange', 'watermelon', 'kiwi']

结论

本文介绍了JavaScript中五种常见的向数组中添加元素的方法，包括使用push()方法、concat()方法、直接赋值语法、splice()方法和ES6扩展运算符。根据实际需求，可以选择适合的方法来添加元素到数组中。

js array添加元素