JS中数组的相关方法介绍

简介: JS中数组的相关方法介绍
  1. push()
  • 将一个或多个元素添加到数组的末尾,并返回新的长度。
let arr = [1, 2, 3];  
arr.push(4);  // arr 现在是 [1, 2, 3, 4]
  • pop()
  • 删除并返回数组的最后一个元素
let arr = [1, 2, 3, 4];  
let last = arr.pop();  // last 现在是 4,arr 现在是 [1, 2, 3]
  • shift()
  • 删除并返回数组的第一个元素。
let arr = [1, 2, 3, 4];  
let first = arr.shift();  // first 现在是 1,arr 现在是 [2, 3, 4]
  • unshift()
  • 将一个或多个元素添加到数组的开头,并返回新的长度
let arr = [2, 3, 4];  
arr.unshift(1);  // arr 现在是 [1, 2, 3, 4]

slice()

  • 提取数组的一部分并在新的数组中返回。提取的范围由开始和结束索引确定。不包含结束索引

 

let arr = [0, 1, 2, 3, 4];  
let sliced = arr.slice(1, 3);  // sliced 现在是 [1, 2]

 

splice()

  • 通过删除或替换现有元素或者添加新元素来修改数组,然后返回被修改的元素
let arr = [0, 1, 2, 3];  
arr.splice(1, 2, 'a', 'b');  // arr现在是 [0, 'a', 'b', 3]

 

  1. sort()
  • 对数组元素进行排序。默认排序是字母顺序或数字顺序。按照字母顺序排列字符串时,会先转换为 Unicode 码点。如果提供了比较函数,则按照该函数的结果进行排序。比较函数应该接收两个参数,如果第一个参数应该位于第二个参数之前,则返回负数;如果两个参数相等,则返回零;如果第一个参数应该位于第二个参数之后,则返回正数。
let arr = [3, 1, 4];  
arr.sort();  // arr现在是 [1, 3, 4]

reverse()

  • 将数组的元素颠倒顺序。请注意,原始数组会被修改
let arr = [0, 1, 2];  
arr.reverse();  // arr现在是 [2, 1, 0]
  • concat()
  • 将两个或更多数组连接在一起,并返回结果。不会更改现有数组,而是返回新数组。这是连接两个或更多数组的一种简便方法。它不会修改现有的数组,而是返回一个新数组。如果参数中的某些不是数组,它们会被转换为数组。如果任何参数为null或undefined,则它们将被视为空数组。任何非数组参数都不会改变原数组。这也是一种连接两个或更多数组合并成一个新数组的简便方法。例如:let new_array = old_array.concat(value1[, value2[, ...[, valueN]]]);。它将把所有可迭代的参数合并到一起,并返回结果数组。所以如果要合并两个字符串(字符串也可以使用该方法)也是可以的,代码如下:var str1 = 'Hello';var str2 = 'World'; 通过 str1.concat(str2); 后会得到结果字符串 'HelloWorld'。 注意,该方法并不会把合并的结果存储在新的变量里,而是改变了原来的旧变量。如需使用结果值,需要将结果赋值给新的变量:var result = str1.concat(str2); 这样 result 的值就是 'HelloWorld'

join()

  • 将数组中所有元素连接成一个字符串。需要传入一个参数作为连接符,如果不传则默认为逗号
let arr = ['a', 'b', 'c'];  
let str = arr.join();  // str现在是 "a,b,c"

 

  1. indexOf()
  • 返回指定元素在数组中的第一个索引,如果不存在则返回-1。
let arr = ['a', 'b', 'c'];  
let index = arr.indexOf('b');  // index现在是 1

 

  1. lastIndexOf()
  • 返回指定元素在数组中最后一个索引,如果不存在则返回-1。

 

let arr = ['a', 'b', 'c', 'b'];  
let index = arr.lastIndexOf('b');  // index现在是 3

 

forEach()

  • 对数组中的每个元素执行一次给定的函数
let arr = [1, 2, 3];  
arr.forEach(function(value, index) {  
  console.log(value);  // 依次输出 1, 2, 3  
});
  • map()
  • 创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后的结果
let arr = [1, 2, 3];  
let newArr = arr.map(function(value) {  
  return value * 2;  // 返回新数组 [2, 4, 6]  
});

 

filter()

  • 创建一个新数组,包含通过所提供函数实现的测试的所有元素
let arr = [1, 2, 3, 4];  
let newArr = arr.filter(function(value) {  
  return value > 2;  // 返回新数组 [3, 4]  
});

 

reduce()

  • 对数组中的每个元素应用一个函数,将其减少为单个值
let arr = [1, 2, 3, 4];  
let sum = arr.reduce(function(a, b) {  
  return a + b;  // 返回 10  
}, 0);

 

  1. find()
  • 返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
let arr = [1, 2, 3, 4];  
let value = arr.find(function(value) {  
  return value > 2;  // 返回 3  
});

 

findIndex()

  • 返回数组中满足提供的测试函数的第一个元素的索引。否则返回 -1
let arr = [1, 2, 3, 4];  
let index = arr.findIndex(function(value) {  
  return value > 2;  // 返回 2  
});

 

some()

  • 测试数组中是否至少有一个元素通过由提供的函数实现的测试
let arr = [1, 2, 3, 4];  
let result = arr.some(function(value) {  
  return value > 3;  // 返回 true  
});
  1. every()
  • 测试数组的所有元素是否都通过了由提供的函数实现的测试。
let arr = [1, 2, 3, 4];  
let allPositive = arr.every(function(value) {  
  return value > 0;  // 返回 true  
});
  1. includes()
  • 判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回 false。
let arr = [1, 2, 3, 4];  
let included = arr.includes(2);  // 返回 true
  • flat()flatten() (注意:flatten() 并不是标准的方法,但经常被误用或混淆;应使用 flat())
  • 创建一个新数组,所有子数组的元素都递归连接到一个新数组中。
let arr = [1, 2, [3, 4, [5, 6]]];  
let flattened = arr.flat(2);  // 返回 [1, 2, 3, 4, 5, 6]
  1. flatMap()
  • 先对每个元素执行一个映射函数,然后将结果展平到一个新数组中。
let arr = [1, 2, 3];  
let newArr = arr.flatMap(function(value) {  
  return [value, value * 2];  // 返回 [1, 2, 2, 4, 3, 6]  
});
  1. entries()
  • 返回一个新的数组迭代器对象,它包含数组中每个索引的键/值对。
let arr = ['a', 'b', 'c'];  
let iterator = arr.entries();  
for (let entry of iterator) {  
  console.log(entry);  // 输出 [0, 'a'], [1, 'b'], [2, 'c']  
}
  1. keys()
  • 返回一个新的数组迭代器对象,它包含数组中每个索引的键。
let arr = ['a', 'b', 'c'];  
let iterator = arr.keys();  
for (let key of iterator) {  
  console.log(key);  // 输出 0, 1, 2  
}
  1. values()
  • 返回一个新的数组迭代器对象,它包含数组的每个值。
let arr = ['a', 'b', 'c'];  
let iterator = arr.values();  
for (let value of iterator) {  
  console.log(value);  // 输出 'a', 'b', 'c'  
}
  1. copyWithin()
  • 在数组内部,将一系列元素复制到另一个位置,覆盖原有元素,但不会改变数组大小。
let arr = [1, 2, 3, 4, 5];  
arr.copyWithin(0, 3, 4);  // 返回 [4, 2, 3, 4, 5],从索引3复制元素到索引0
  1. fill()
  • 用一个固定值填充数组的一部分,从起始索引到结束索引。
let arr = [1, 2, 3, 4, 5];  
arr.fill(0, 1, 3);  // 返回 [1, 0, 0, 4, 5],从索引1到索引3(不包括)填充0
相关文章
|
8天前
|
前端开发 JavaScript
前端 js 经典:数组常用方法总结
前端 js 经典:数组常用方法总结
20 0
|
13天前
|
存储 JavaScript 前端开发
史上最详细JavaScript数组去重方法(11种)
使用set和Array.from ()方法 array.from可以将set结构转成数组
24 7
|
7天前
|
移动开发 JavaScript iOS开发
WKWebView和js互调方法的实现
WKWebView和js互调方法的实现
12 0
|
7天前
|
JavaScript 前端开发
Symbol在JavaScript中还有哪些内置的Symbol可以用于定义特定的方法或属性
Symbol在JavaScript中还有哪些内置的Symbol可以用于定义特定的方法或属性
|
8天前
|
前端开发 JavaScript
前端 JS 经典:数组去重万能方法
前端 JS 经典:数组去重万能方法
12 0
|
8天前
|
前端开发 JavaScript 流计算
前端 js 经典:字符串超全方法总结
前端 js 经典:字符串超全方法总结
18 0
|
9天前
|
前端开发 JavaScript 开发者
JavaScript中的异步编程方法总结
在JavaScript开发中,处理异步操作是非常常见的情况。本文将总结JavaScript中常用的异步编程方法,包括Callback、Promise、Async/Await等,分析其优缺点,并提供使用建议。
|
11天前
|
缓存 前端开发 JavaScript
React和Next.js开发常见的HTTP请求方法
React和Next.js开发常见的HTTP请求方法
15 0
|
11天前
|
前端开发 JavaScript
前端 JS 经典:Math 常用方法汇总
前端 JS 经典:Math 常用方法汇总
15 0
|
11天前
|
前端开发 JavaScript
前端 js 经典:Object 常用原生方法
前端 js 经典:Object 常用原生方法
23 2