微信登录

内置对象 - Array 对象 - 数组的增删改查操作

前端 - Javascript 《内置对象 - Array 对象 - 数组的增删改查操作》

在 JavaScript 的世界里,数组就像是一个神奇的百宝箱,能容纳各种类型的数据,从数字、字符串到对象,无所不能。而对数组进行增删改查操作,就如同我们在百宝箱里添加、拿走、更换或者寻找宝贝一样。接下来,就让我们一起深入探索数组的这些操作吧!

数组的增加操作

1. push() 方法

push() 方法就像是往百宝箱的最末端放入新宝贝。它会在数组的末尾添加一个或多个元素,并返回新的数组长度。

  1. let fruits = ['apple', 'banana'];
  2. let newLength = fruits.push('cherry');
  3. console.log(fruits); // 输出: ['apple', 'banana', 'cherry']
  4. console.log(newLength); // 输出: 3

2. unshift() 方法

unshift() 方法则是把新宝贝放在百宝箱的最前端。它会在数组的开头添加一个或多个元素,并返回新的数组长度。

  1. let fruits = ['apple', 'banana'];
  2. let newLength = fruits.unshift('strawberry');
  3. console.log(fruits); // 输出: ['strawberry', 'apple', 'banana']
  4. console.log(newLength); // 输出: 3

数组的删除操作

1. pop() 方法

pop() 方法就像是从百宝箱的末尾拿走一个宝贝。它会移除数组的最后一个元素,并返回该元素。

  1. let fruits = ['apple', 'banana', 'cherry'];
  2. let removedFruit = fruits.pop();
  3. console.log(fruits); // 输出: ['apple', 'banana']
  4. console.log(removedFruit); // 输出: 'cherry'

2. shift() 方法

shift() 方法是从百宝箱的开头拿走一个宝贝。它会移除数组的第一个元素,并返回该元素。

  1. let fruits = ['apple', 'banana', 'cherry'];
  2. let removedFruit = fruits.shift();
  3. console.log(fruits); // 输出: ['banana', 'cherry']
  4. console.log(removedFruit); // 输出: 'apple'

数组的修改操作

直接通过索引修改

我们可以像直接在百宝箱里更换某个位置的宝贝一样,通过数组的索引来修改元素。

  1. let fruits = ['apple', 'banana', 'cherry'];
  2. fruits[1] = 'grape';
  3. console.log(fruits); // 输出: ['apple', 'grape', 'cherry']

数组的查询操作

1. 通过索引查询

这就像是直接在百宝箱里找到某个特定位置的宝贝。我们可以使用数组的索引来访问元素。

  1. let fruits = ['apple', 'banana', 'cherry'];
  2. let selectedFruit = fruits[2];
  3. console.log(selectedFruit); // 输出: 'cherry'

2. indexOf() 方法

indexOf() 方法可以帮助我们在百宝箱里寻找某个宝贝的位置。它会返回指定元素在数组中第一次出现的索引,如果没有找到则返回 -1。

  1. let fruits = ['apple', 'banana', 'cherry'];
  2. let index = fruits.indexOf('banana');
  3. console.log(index); // 输出: 1

总结表格

操作类型 方法名 作用 返回值
增加 push() 在数组末尾添加元素 新的数组长度
增加 unshift() 在数组开头添加元素 新的数组长度
删除 pop() 移除数组最后一个元素 被移除的元素
删除 shift() 移除数组第一个元素 被移除的元素
修改 直接通过索引修改 修改指定索引位置的元素 无
查询 通过索引查询 获取指定索引位置的元素 该位置的元素
查询 indexOf() 查找元素第一次出现的索引 元素的索引,未找到返回 -1

通过这些操作,我们可以随心所欲地管理数组这个百宝箱,让它更好地为我们服务。希望大家在 JavaScript 的编程之旅中,能熟练运用这些数组操作,创造出更精彩的代码!