操作数组的常用方法

1、改变原数组

  • push:向数组末尾追加元素 (增)

返回值:数组长度

const animals = ['pigs', 'goats', 'sheep'];
const count = animals.push('cows');

console.log(count); // 4
console.log(animals); // ['pigs', 'goats', 'sheep', 'cows']
animals.push('chickens', 'cats', 'dogs');
console.log(animals); // ['pigs', 'goats', 'sheep', 'cows', 'chickens', 'cats', 'dogs']
  •  unshift:向数组前端追加元素 (增)

返回值:数组长度

const array = [1, 2, 3];

console.log(array.unshift(4, 5)); // 5
console.log(array); // [4, 5, 1, 2, 3]
  • pop :删除数组最后一个元素 (删)

返回值:删除的元素

const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];


console.log(plants.pop()); // tomato
console.log(plants); // ["broccoli", "cauliflower", "cabbage", "kale"]

plants.pop();
console.log(plants); // ["broccoli", "cauliflower", "cabbage"]
  •  shift:删除数组第一个元素 (删)

返回值:删除的元素

const array = [1, 2, 3];
const firstElement = array.shift();

console.log(array); // [2, 3]
console.log(firstElement); // 1
  • splice :移除或者替换已存在的元素或添加新元素

splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item1)
splice(start, deleteCount, item1, item2, itemN)

// 移除索引 2 之前的 0(零)个元素,并插入“drum”
const myFish = ["angel", "clown", "mandarin", "sturgeon"];
const removed = myFish.splice(2, 0, "drum");
console.log(myFish) // ["angel", "clown", "drum" "mandarin", "sturgeon"]
console.log(removed) // []

// 在索引 3 处移除 1 个元素
const myFish = ["angel", "clown", "drum", "mandarin", "sturgeon"];
const removed = myFish.splice(3, 1);
console.log(myFish) // ["angel", "clown", "drum", "sturgeon"]
console.log(removed) // ["mandarin"]

// 在索引 2 处移除 1 个元素,并插入“trumpet”
const myFish = ["angel", "clown", "drum", "sturgeon"];
const removed = myFish.splice(2, 1, "trumpet");
console.log(myFish) // ["angel", "clown", "trumpet", "sturgeon"]
console.log(removed) // ["drum"]

// 从索引 0 处移除 2 个元素,并插入“parrot”、“anemone”和“blue”
const myFish = ["angel", "clown", "trumpet", "sturgeon"];
const removed = myFish.splice(0, 2, "parrot", "anemone", "blue");
console.log(myFish) // ["parrot", "anemone", "blue", "trumpet", "sturgeon"]
console.log(removed) // ["angel", "clown"]
  • sort:对数组的元素进行排序,默认排序是将元素转换为字符串,然后按照它们的 UTF-16 码元值升序排序
const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);
// Expected output: Array ["Dec", "Feb", "Jan", "March"]

const array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);
// Expected output: Array [1, 100000, 21, 30, 4]
  • reverse:反转数组中的元素
const array1 = ['one', 'two', 'three'];
console.log('array1:', array1);
// Expected output: "array1:" Array ["one", "two", "three"]

const reversed = array1.reverse();
console.log('reversed:', reversed);
// Expected output: "reversed:" Array ["three", "two", "one"]

// Careful: reverse is destructive -- it changes the original array.
console.log('array1:', array1);
// Expected output: "array1:" Array ["three", "two", "one"]

2、不改变原数组

  • at:接收一个整数值并返回该索引对应的元素

at(index)
index:要返回的数组元素的索引(从零开始),负数索引从数组末尾开始计数——如果 index < 0,则会访问 index + array.length 位置的元素。

返回值:

数组中与给定索引匹配的元素。如果 index < -array.length 或 index >= array.length,则总是返回 undefined

const array = [5, 12, 8, 130, 44];
console.log(array1.at(2)); // 8
console.log(array1.at(-2)); // 130
  • concat:拼接数组
const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);

console.log(array3);
// Expected output: Array ["a", "b", "c", "d", "e", "f"]
  • filter:过滤数组
const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const result = words.filter(word => word.length > 6);

console.log(result);// ["exuberant", "destruction", "present"]
  • forEach:遍历
const array1 = ['a', 'b', 'c'];
array1.forEach(element => console.log(element));

// Expected output: "a"
// Expected output: "b"
// Expected output: "c"
  • indexOf:用于判断是否存在某元素

返回值:数组中第一次出现给定元素的下标,如果不存在则返回 -1

const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];

console.log(beasts.indexOf('bison'));
// Expected output: 1

// Start from index 2
console.log(beasts.indexOf('bison', 2));
// Expected output: 4

console.log(beasts.indexOf('giraffe'));
// Expected output: -1
  • join:将数组转换成字符串,用逗号或指定的分隔符字符串分隔
const elements = ['Fire', 'Air', 'Water'];

console.log(elements.join());
// Expected output: "Fire,Air,Water"

console.log(elements.join(''));
// Expected output: "FireAirWater"

console.log(elements.join('-'));
// Expected output: "Fire-Air-Water"
  • reduce:用于数组求和
const array1 = [1, 2, 3, 4];

// 0 + 1 + 2 + 3 + 4
const initialValue = 0;
const sumWithInitial = array1.reduce(
  (accumulator, currentValue) => accumulator + currentValue,
  initialValue
);

console.log(sumWithInitial);
// Expected output: 10
  • slice
const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// Expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// Expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// Expected output: Array ["bison", "camel", "duck", "elephant"]

console.log(animals.slice(-2));
// Expected output: Array ["duck", "elephant"]

console.log(animals.slice(2, -1));
// Expected output: Array ["camel", "duck"]

console.log(animals.slice());
// Expected output: Array ["ant", "bison", "camel", "duck", "elephant"]
  • some

测试数组中是否至少有一个元素通过了由提供的函数实现的测试。如果在数组中找到一个元素使得提供的函数返回 true,则返回 true;否则返回 false

const array = [1, 2, 3, 4, 5];

// Checks whether an element is even
const even = (element) => element % 2 === 0;

console.log(array.some(even));
// Expected output: true
  • isArray

Array.isArray() 静态方法用于确定传递的值是否是一个 Array

console.log(Array.isArray([1, 3, 5]));
// Expected output: true

console.log(Array.isArray('[]'));
// Expected output: false

console.log(Array.isArray(new Array(5)));
// Expected output: true

console.log(Array.isArray(new Int16Array([15, 33])));
// Expected output: false
  • findIndex

返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回 -1

const array1 = [5, 12, 8, 130, 44];

const isLargeNumber = (element) => element > 13;

console.log(array1.findIndex(isLargeNumber));
// Expected output: 3
  • find

方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined

const array1 = [5, 12, 8, 130, 44];

const found = array1.find(element => element > 10);

console.log(found);
// Expected output: 12

猜你喜欢

转载自blog.csdn.net/weixin_46258341/article/details/131833822