JS数组方法

数组方法

一、数组

  • JavaScript 数组的大小是可调整的,并且可以包含不同 数据类型。(当不需要这些特性时,请使用 类型数组。)

    注:JavaScript 类型数组是类似数组的对象,它提供了一种在内存缓冲区中读取和写入原始二进制数据的机制。

  • JavaScript 数组不是关联数组,因此不能使用任意字符串作为索引来访问数组元素,但必须使用非负整数(或其各自的字符串形式)作为索引来访问。

二、数组属性

属性描述
constructor返回创建数组对象的原型函数。
length设置或返回数组元素的个数。
prototype允许你向数组对象添加属性或方法。

1.constructor属性

var arr = [1,2,3,4]
console.log(arr.constructor);//返回数组的原型函数

在这里插入图片描述

2.length属性

var arr = [1,2,3,4]
console.log(arr.length)//返回数组的长度

3.prototype属性

// 一个新的数组方法,将数组值转换为大写Array.prototype.myUcase = function(){for(i=0;i<arr.length;i++){this[i]=this[i].toUpperCase();}}//创建数组,调用myUcase方法var arr=["apple","mango"]arr.myUcase()console.log(arr)

在这里插入图片描述

三、数组方法

1.concat()方法

连接两个或更多的数组,并返回结果,该方法不会改变现有的数组,而是返回一个新的数组。

语法:

array1.concat(array2, array3,..., arrayX)

示例:

		var a = [1,2,3]var b = [4,5,6]var c = a.concat(b)console.log(c)  //[1,2,3,4,5,6]

2.copyWhithin()方法

copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

语法:

array.copyWithin(target, start, end)

参数:

trarget :将序列复制到的从零开始的索引,转换为整数。这对应于 start 处的元素将被复制到的位置,并且 startend 之间的所有元素都将复制到后续索引。

start:从零开始的索引,从该位置开始复制元素,转换为整数。

end:结束从 转换为整数 复制元素的从零开始的索引。copyWithin() 复制直至但不包括 end

示例1(不写结束位置):

var fruits = ["Banana", "Orange", "Apple", "Mango","pink"];fruits.copyWithin(2, 0);console.log(fruits)

在这里插入图片描述

示例2(有结束位置):

var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi", "Papaya"];fruits.copyWithin(2, 0, 2);console.log(fruits)

在这里插入图片描述

3.entries()方法

entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)。

迭代对象中数组的索引值作为 key, 数组元素作为 value。

var fruits = ["Banana", "Orange", "Apple", "Mango"];var a=fruits.entries();console.log(a.next().value)console.log(a.next().value)console.log(a.next().value)console.log(a.next().value)

在这里插入图片描述

(1)使用索引和元素进行迭代
		const a = ["a", "b", "c"];for (const [index, element] of a.entries()) {console.log(index, element);}

在这里插入图片描述

(2)使用for···of循环
		const array = ["a", "b", "c"];const arrayEntries = array.entries();for (const element of arrayEntries) {console.log(element);}

在这里插入图片描述

(3)对非数组对象调用entries()

entries() 方法读取 thislength 属性,然后访问键为小于 length 的非负整数的每个属性。

const arrayLike = {length: 3,0: "a",1: "b",2: "c",3: "d", // ignored by entries() since length is 3};for (const entry of Array.prototype.entries.call(arrayLike)) {console.log(entry);}

4.every()方法

every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。

every() 方法使用指定函数检测数组中的所有元素:

  • 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
  • 如果所有元素都满足条件,则返回 true。

语法:

array.every(function(currentValue,index,arr), thisValue)

参数:

参数描述
currentValue必须。当前元素的值
index可选。当前元素的索引值
arr可选。当前元素属于的数组对象

thisValue : 可选。对象作为该执行回调时使用,传递给函数,用作 “this” 的值。
如果省略了 thisValue ,“this” 的值为 “undefined”

示例:

检测数组中的数值是否全部大于18,如果是则返回true,如果不是则返回false

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><p>点击按钮检测数组的所有元素是否大于18:</p><button onclick="myFunction()">点我</button><script>var ages = [32,33,16,20]function checkAdult(age){//console.log(age)  //age是被检测的数组元素return age >=18;}function myFunction(){console.log(ages.every(checkAdult))}</script>
</body>
</html>

5.fill()方法

fill() 方法用于将一个固定值替换数组的元素。

语法:

array.fill(value, start, end)

参数:

参数描述
value必需。填充的值。
start可选。开始填充位置。
end可选。停止填充位置 (默认为 array.length)

示例:

var fruits = ["Banana", "Orange", "Apple", "Mango","pink"];
fruits.fill("Runoob", 2, 4);
console.log(fruits);

6.filter()方法

filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

注意: filter() 不会对空数组进行检测,不会改变原始数组。

语法:

array.filter(function(currentValue,index,arr), thisValue)

参数:

参数描述
currentValue必须。当前元素的值
index可选。当前元素的索引值
arr可选。当前元素属于的数组对象
thisValue 可选传递给函数的值一般用 “this” 值。 如果这个参数为空, “undefined” 会传递给 “this” 值

示例:

		var arr = [100,100,120,300,230,150]var newArr = arr.filter(function newNum(num){return num<=200;})// var newArr = arr.filter(num=>num<=200)  //使用箭头函数,可以省略returnconsole.log("newArr:"+newArr)console.log("arr"+arr)

输出结果:

在这里插入图片描述

7.find()方法

find() 方法返回符合条件的第一个数组元素。

find() 方法为数组中的每个元素都调用一次函数执行:

  • 当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。
  • 如果没有符合条件的元素返回 undefined

注意: find() 对于空数组,函数是不会执行的,没有改变数组的原始值。

注意: IE 11 及更早版本不支持 find() 方法。

语法:

array.find(function(currentValue, index, arr),thisValue)
参数描述
currentValue必需。当前元素
index可选。当前元素的索引值
arr可选。当前元素所属的数组对象
More ActionsthisValue可选。 传递给函数的值一般用 “this” 值。 如果这个参数为空, “undefined” 会传递给 “this” 值

示例:

//检测数组当中符合函数小于等于200的元素
var arr = [250,300,100,150,200,150]var newArr = arr.find(function newNum(num){return num<=200;})// var newArr = arr.filter(num=>num<=200)  //使用箭头函数,可以省略returnconsole.log("newArr:"+newArr)console.log("arr"+arr)

运行结果:

在这里插入图片描述

8.findIndex()方法

findIndex() 方法返回符合条件的数组第一个元素位置(下标)。

findIndex() 方法为数组中的每个元素都调用一次函数执行:

  • 当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
  • 如果没有符合条件的元素返回 -1

注意: findIndex() 对于空数组,函数是不会执行的,没有改变数组的原始值。

语法:

array.findIndex(function(currentValue, index, arr), thisValue)

参数:

参数描述
currentValue必需。当前元素
index可选。当前元素的索引
arr可选。当前元素所属的数组对象
thisValue可选。 传递给函数的值一般用 “this” 值。 如果这个参数为空, “undefined” 会传递给 “this” 值

示例:

var arr = [250,300,100,150,200,150]var newArr = arr.findIndex(function newNum(num){return num<=200;})// var newArr = arr.filter(num=>num<=200)  //使用箭头函数,可以省略returnconsole.log("newArr:"+newArr)console.log("arr"+arr)

运行结果:

在这里插入图片描述

9.forEach()方法

forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

注意: forEach() 对于空数组是不会执行回调函数的。

语法:

array.forEach(callbackFn(currentValue, index, arr), thisValue)

其他形式的语法格式:

// 箭头函数
forEach((element) => { /* … */ })
forEach((element, index) => { /* … */ })
forEach((element, index, array) => { /* … */ })// 回调函数
forEach(callbackFn)
forEach(callbackFn, thisArg)// 内联回调函数
forEach(function(element) { /* … */ })
forEach(function(element, index) { /* … */ })
forEach(function(element, index, array){ /* … */ })
forEach(function(element, index, array) { /* … */ }, thisArg)

参数:

参数描述
currentValue必需。当前元素
index可选。当前元素的索引值。
arr可选。当前元素所属的数组对象。
thisValue可选。传递给函数的值一般用 “this” 值。
如果这个参数为空, “undefined” 会传递给 “this” 值

示例:

var sum = 0;var arr = [65, 44, 12, 4];arr.forEach(function fn(item){console.log(`item:${item}`)sum+=item;return sum;})console.log(sum)console.log(arr)

运行结果:
在这里插入图片描述

10.from()方法

from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。

如果对象是数组返回 true,否则返回 false。

语法:sss

Array.from(object, mapFunction, thisValue)

参数:

参数描述
object必需,要转换为数组的对象。
mapFunction可选,数组中每个元素要调用的函数。
thisValue可选,映射函数(mapFunction)中的 this 对象。

示例1:

var myArr = Array.from("RUNOOB");
console.log(myArr) 

在这里插入图片描述

示例2:

返回集合中包含的数组对象

var setObj = new Set(["a", "b", "c"]);var objArr = Array.from(setObj);console.log(`objArr[1]:${objArr[1]}`)

在这里插入图片描述

示例3:

使用箭头语法和映射函数更改元素的值。

var arr = Array.from([1, 2, 3], x => x * 10);console.log(arr) //[10,20,30]

11.includes()方法

includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。

语法:

arr.includes(searchElement)
arr.includes(searchElement, fromIndex)

参数:

参数描述
searchElement必须。需要查找的元素值。
fromIndex可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。

示例:

var arr = ['a', 'b', 'c'];console.log(arr.includes('c', 3));   //false  判断arr数组当中,下标为3的元素是否为cconsole.log(arr.includes('c', 100)); //false 判断arr数组当中,下标为100的元素是否为cconsole.log(arr.includes('c'));      //true 判断函数当中是否包含"c"

注意:如果 fromIndex 为负值,计算出的索引将作为开始搜索searchElement的位置。如果计算出的索引小于 0,则整个数组都会被搜索。

var arr = ['a', 'b', 'c'];
console.log(arr.includes('c', -100)); //true

12.indexOf()方法

indexOf() 方法可返回数组中某个指定的元素位置。

该方法将从头到尾地检索数组,看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头(没有指定 start 参数时)。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。

如果在数组中没找到指定元素则返回 -1。

提示如果你想查找字符串最后出现的位置,请使用 lastIndexOf() 方法。

语法:

array.indexOf(item,start)

参数:

参数描述
item必须。查找的元素。
start可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。

示例:

var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"];
var a = fruits.indexOf("Apple",4);
console.log(`从下标为4的开始检测,Apple的位置是${a}`)  //6

13.isArray()方法

判断对象是否为数组

语法:

Array.isArray(obj)

参数:

参数描述
obj必需,要判断的对象。

示例:

var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"];
console.log(Array.isArray(fruits))  // true

14.join()方法

join() 方法用于把数组中的所有元素转换一个字符串。

元素是通过指定的分隔符进行分隔的。

语法:

array.join(separator)

参数:

参数描述
separator可选。指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符。

示例:

var arr= [2000,2,13,]
var newArr = arr.join("-") //如果不写参数,那么默认以逗号分隔
console.log(newArr)  //2000-2-13

15.keys()方法

keys() 方法用于从数组创建一个包含数组键的可迭代对象。

语法:

array.keys()

示例:

var arr= [2000,2,13,]
var newArr = arr.keys()
console.log(newArr)  //返回一个数组可迭代对象

16.lastIndexOf()方法

lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置,从该字符串的后面向前查找。

如果要检索的元素没有出现,则该方法返回 -1。

该方法将从尾到头地检索数组中指定元素 item。开始检索的位置在数组的 start 处或数组的结尾(没有指定 start 参数时)。如果找到一个 item,则返回 item 从尾向前检索第一个次出现在数组的位置。数组的索引开始位置是从 0 开始的。

如果在数组中没找到指定元素则返回 -1。

提示: 如果你想查找数组首次出现的位置,请使用 indexOf() 方法。

语法:

array.lastIndexOf(item,start)

参数:

参数描述
item必需。规定需检索的字符串值。
start可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的最后一个字符处开始检索。

示例:

var arr= [1,2,3,4,5,6,6,5,4,3,2,1]var a = arr.lastIndexOf(2)console.log(a)//10
//从数组中的第四个位置查找字符串2出现的位置:
var arr= [1,2,3,4,5,6,6,5,4,3,2,1]var a = arr.lastIndexOf(2,4)console.log(a)//1

17.map()方法

map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

map() 方法按照原始数组元素顺序依次处理元素。

注意: map() 不会对空数组进行检测。

注意: map() 不会改变原始数组。

语法:

array.map(function(currentValue,index,arr), thisValue)

参数:

参数描述
thisValue可选。对象作为该执行回调时使用,传递给函数,用作 “this” 的值。
如果省略了 thisValue,或者传入 null、undefined,那么回调函数的 this 为全局对象。
currentValue必须。当前元素的值
index可选。当前元素的索引值
arr可选。当前元素属于的数组对象

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style></style>
</head>
<body>输入框:<input type="text" id="ipt" value="10"><script>//将数组中的每个元素乘输入框指定的值,并且返回var arr = [1,2,3,4]var newArr=arr.map(item=>item*document.getElementById("ipt").value)console.log(newArr)</script>
</body>
</html>

在这里插入图片描述

18.pop()方法

pop() 方法用于删除数组的最后一个元素并返回删除的元素。

**注意:**此方法改变数组的长度!

提示: 移除数组第一个元素,请使用 shift() 方法。

语法:

array.pop()

示例:

var arr = [1,2,3,4]var a=arr.pop()console.log(a) //返回被删除的数组元素console.log(arr) //改变数组长度

在这里插入图片描述

19.push()方法

push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度。

注意: 新元素将添加在数组的末尾。

注意: 此方法改变数组的长度。

提示: 在数组起始位置添加元素请使用 unshift() 方法。

语法:

array.push(item1, item2, ..., itemX)

参数:

参数描述
item1, item2, …, itemX必需。要添加到数组的元素。

示例:

		var arr = [1,2,3,4]var a=arr.push(5,5)console.log(a)  //返回数组长度 6console.log(arr) //在尾部添加 [1,2,3,4,5,5]

20.unshift()方法

unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。

注意: 该方法将改变数组的数目。

提示: 将新项添加到数组末尾,请使用 push() 方法。

语法:

array.unshift(item1,item2, ..., itemX)

参数:

参数描述
item1,item2, …, itemX可选。向数组起始位置添加一个或者多个元素。

示例:

		var arr = [1,2,3,4]var a=arr.unshift(5,5)console.log(a)  //返回数组长度 6console.log(arr) //在头部添加 [5,5,1,2,3,4]

21.shift()方法

shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。

注意: 此方法改变数组的长度!

提示: 移除数组末尾的元素可以使用 pop() 方法。

语法:

array.shift()

示例:

var arr = [1,2,3,4]var newArr = arr.shift()console.log(newArr) // 被删除的第一个元素 1console.log(arr)   // 删除第一个元素以后,返回的新的数组 [2,3,4]

22.reduce()方法

reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

reduce() 可以作为一个高阶函数,用于函数的 compose。

注意: reduce() 对于空数组是不会执行回调函数的。

语法:

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数:

参数描述
total必需。初始值, 或者计算结束后的返回值。
currentValue必需。当前元素
currentIndex可选。当前元素的索引
arr可选。当前元素所属的数组对象。
initialValue可选。传递给函数的初始值

示例:

var arr = [1,2,3,4,5]var num = arr.reduce(function getArr(total,item){return total+item;})console.log(num) //15

23.reduceRight()方法

reduceRight() 方法的功能和 reduce() 功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。

注意: reduce() 对于空数组是不会执行回调函数的。

语法:

array.reduceRight(function(total, currentValue, currentIndex, arr), initialValue)

参数:

参数描述
total必需。初始值, 或者计算结束后的返回值。
currentValue必需。当前元素
currentIndex可选。当前元素的索引
arr可选。当前元素所属的数组对象。
initialValue可选。传递给函数的初始值

示例:

var arr = [1,2,3,4,100]var num = arr.reduceRight(function getArr(total,item){console.log(`total:${total}`)console.log(`item:${item}`)return total-item;})console.log(num)

运行结果:

在这里插入图片描述

24.reverse()方法

反转数组的顺序

语法:

array.reverse()

示例:

let arr = [1,2,3,4,100]let newArr = arr.reverse() console.log(`newArr:${newArr}`)console.log(`arr:${arr}`)

运行结果:
在这里插入图片描述

25.slice()方法

slice() 方法可从已有的数组中返回选定的元素。

slice() 方法可提取字符串的某个部分,并以新的字符串返回被提取的部分。

注意: slice() 方法不会改变原始数组。

语法:

array.slice(start, end)

参数:

参数描述
start可选。规定从何处开始选取。如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。
end可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素(不包含最后一个元素,也就是只有倒数第二个元素)。

示例:

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];// var myBest = fruits.slice(-3,-1); // 截取从倒数第三个 到 倒数第一个(不包含)的两个元素    "Lemon", "Apple"var myBest = fruits.slice(-3);  // 截取最后三个元素console.log(`myBest:${myBest}`) //"Lemon", "Apple", "Mango"console.log(`fruits:${fruits}`)

在这里插入图片描述

26.some()方法

some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。

some() 方法会依次执行数组的每个元素:

  • 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
  • 如果没有满足条件的元素,则返回false。

注意: some() 不会对空数组进行检测。

		some() 不会改变原始数组。

语法:

array.some(function(currentValue,index,arr),thisValue)

参数:

参数描述
currentValue必须。当前元素的值
index可选。当前元素的索引值
arr可选。当前元素属于的数组对象
thisValue可选。对象作为该执行回调时使用,传递给函数,用作 “this” 的值。
如果省略了 thisValue ,“this” 的值为 “undefined”

示例:

		let ages = [4, 12, 16, 20]; //声明一个数组let a= ages.some(function checkAdult(item) {console.log(item)return item >= 18;})console.log(`a:${a}`)

运行结果:

在这里插入图片描述

27.sort()方法

sort() 方法用于对数组的元素进行排序。

排序顺序可以是字母或数字,并按升序或降序。

默认排序顺序为按字母升序。

**注意:**当数字是按字母顺序排列时"40"将排在"5"前面,是按数字第一位进行排序,而无关数字的大小。

使用数字排序,必须通过一个函数作为参数来调用。

函数指定数字是按照升序还是降序排列。

注意: 这种方法会改变原始数组!。

语法:

array.sort(sortfunction)

参数:

参数描述
sortfunction可选。规定排序顺序。必须是函数。

示例1:

//字母排序var arr = ['a','b','c','an','b'];arr.sort(); //升序排列console.log(arr)arr.reverse();  //降序排列就是在升序的基础上使用反转数组的方式,来实现降序排列console.log(arr)

在这里插入图片描述

示例2:

//数字排序
var arr = [1,2,3,12,1,3,1,12,56,32];arr.sort(); //升序排列console.log(arr)/*arr.reverse();  //降序排列就是在升序的基础上使用反转数组的方式,来实现降序排列console.log(arr)*/

在这里插入图片描述

思考:那么如何让数字进行排序呢?

示例3:

//数字排序和降序const arr = [40,100,1,5,25,10];console.log(`arr:${arr}`)let newNum=arr.sort(function(a,b){//console.log(`a:${a}  b:${b}`)return b-a  //如果是a-b那么就是升序排列});console.log(`newNum:${newNum}`)

在这里插入图片描述

28.splice()方法

splice() 方法用于添加或删除数组中的元素。

**注意:**这种方法会改变原始数组。

语法:

array.splice(index,howmany,item1,.....,itemX)

参数:

参数描述
index必需。规定从何处添加/删除元素。 该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany可选。规定应该删除多少元素。必须是数字,但可以是 “0”。 如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1, …, itemX可选。要添加到数组的新元素

示例:

var arr = [1,2,3,4,5];arr.splice(2,1,100,200); //移除数组的第三个元素,并在数组第三个位置添加新元素100和200,相当于替换。console.log(arr) //[1,2,100,200,4,5]
var arr = [1,2,3,4,5];arr.splice(2,2); //从第三个位置开始删除数组后的两个元素3和4console.log(arr)  //[1,2,5]

29.toString()方法

将数组转换为字符串,并返回结果

注意: 数组中的元素之间用逗号分隔。

语法:

array.toString()

示例:

const arr = [1,2,3,4,5];let str=arr.toString(); console.log( str, typeof str) //1,2,3,4,5 string

30.valueOf()方法

valueOf() 方法返回 Array 对象的原始值。

该原始值由 Array 对象派生的所有对象继承。

valueOf() 方法通常由 JavaScript 在后台自动调用,并不显式地出现在代码中。

注意: valueOf() 方法不会改变原数组。

语法:

array.valueOf()

示例:

const arr = [1,2,3,4,5];let a=arr.valueOf(); console.log( a) //[1,2,3,4,5]

31.of()方法

of() 方法用于将一组值转换为数组,不考虑参数的数量或类型。

Array.of() 和 Array() 构造函数之间的区别在于对单个参数的处理:Array.of(5) 创建一个具有单个元素 7 的数组,而 Array(5) 创建一个 length 为 5 的空数组。

如果对象是数组返回 true,否则返回 false。

语法:

Array.of(element0)
Array.of(element0, element1)
Array.of(element0, element1, /* … ,*/ elementN)

参数:

参数描述
element0必需,要转换为数组的元素。
element1, /* … ,*/ elementN可选,要转换为数组的元素。

示例:

let a=Array.of(1);         // [1]
let b=Array.of(1, 2, 3);   // [1, 2, 3]
let c=Array.of(undefined); // [undefined]
console.log(a)
console.log(b)
console.log(c)

Array.of()与Array()的区别:

		let a1=Array.of(7); // [7]  7个undefined组成的数组let a2=Array(7); // array of 7 empty slots 7个空槽let b1=Array.of(1, 2, 3); // [1, 2, 3]let b2=Array(1, 2, 3);    // [1, 2, 3]console.log(`a1使用Array.of()创建的:`,a1)console.log(`a2b1使用Array()创建的:`,a2)console.log(`b1使用Array.of()创建的:`,b1)console.log(`b2使用Array()创建的:`,b2)

运行结果:

在这里插入图片描述

32.at()方法

at() 方法用于接收一个整数值并返回该索引对应的元素,允许正数和负数。负整数从数组中的最后一个元素开始倒数。

匹配给定索引的数组中的元素。如果找不到指定的索引,则返回 undefined。

在传递非负数时,at() 方法等价于括号表示法。例如,array[0] 和 array.at(0) 均返回第一个元素。但是,当你需要从数组的末端开始倒数时,则不能使用 Python 和 R 语言中支持的 array[-1],因为方括号内的所有值都会被视为字符串属性,因此你最终读取的是 array[“-1”],这只是一个普通的字符串属性而不是数组索引。

通常的做法是访问 length 并将其减去从末端开始的相对索引。例如,array[array.length - 1]。at() 方法允许使用相对索引,因此上面的示例可以简化为 array.at(-1)。更正式地,当 index < 0 时,该方法将访问索引 index + array.length。

at() 方法是通用的。其仅期望 this 具有 length 属性和以整数为键的属性。

语法:

at(index)

参数:

参数描述
index要返回的数组元素的索引(位置)。当传递负数时,支持从数组末端开始的相对索引;也就是说,如果使用负数,返回的元素将从数组的末端开始倒数。

示例:

		const array1 = [5, 12, 8, 130, 44];let index1 = 2;str1 = `索引号为 ${index1} 的值为 ${array1.at(index1)}`;console.log(str1);let index2 = -2;str2 = `索引号为 ${index2} 的值为 ${array1.at(index2)}`;console.log(str2)

运行结果:
在这里插入图片描述

33.flat()方法

flat() 方法方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回,可以实现数组扁平化(数组降维)。

flat() 方法返回一个包含将数组与子数组中所有元素的新数组。

flat() 方法会递归地遍历数组,将所有嵌套的数组元素提取出来,生成一个新的一维数组。

语法:

flat()
flat(depth)

参数:

参数描述
depth指定要提取嵌套数组的结构深度,默认值为 1。

示例:

		let arr1 = [1, 2, [3, 4, [5, 6]]];let newArr = arr1.flat();console.log(newArr);// 输出: [1, 2, 3, 4, [5, 6]]// 指定深度为2let arr2 = [1, 2, [3, 4, [5, 6]]];let arr3 = arr2.flat(2);console.log(arr3);// 输出: [1, 2, 3, 4, 5, 6]//使用 Infinity,可展开任意深度的嵌套数组let arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];let arr5=arr4.flat(Infinity);// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]console.log(arr5)

运行结果:
在这里插入图片描述

34.flatMap()方法

首先将数组中的每一个元素都执行方法的回调函数,然后将结果返回到 flatMap 这个方法中然后将其展平,最终输出

flatMap() 方法首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。它与 map 连着深度值为 1 的 flat 几乎相同,但 flatMap 通常在合并成一种方法的效率稍微高一些。

flatMap() 方法一个新的数组,其中每个元素都是回调函数的结果,并且结构深度 depth 值为 1。

语法:

// 箭头函数
flatMap((currentValue) => { /* … */ } )
flatMap((currentValue, index) => { /* … */ } )
flatMap((currentValue, index, array) => { /* … */ } )// 回调函数
flatMap(callbackFn)
flatMap(callbackFn, thisArg)// 行内回调函数
flatMap(function(currentValue) { /* … */ })
flatMap(function(currentValue, index) { /* … */ })
flatMap(function(currentValue, index, array){ /* … */ })
flatMap(function(currentValue, index, array) { /* … */ }, thisArg)

参数:

参数描述
callback可以生成一个新数组中的元素的函数,可以传入三个参数:
currentValue当前正在数组中处理的元素index可选可选的。数组中正在处理的当前元素的索引。array可选可选的。被调用的 map 数组
thisArg可选的。执行 callback 函数时 使用的this 值。

示例:

 const arr1 = [1, 2, 1];const result = arr1.flatMap((num) => (num === 2 ? [2, 2] : 1));
//注意只能展开一层
console.log(result);// Array [1, 2, 2, 1] 

35.with()方法

with() 方法用于更新指定的数组元素。

with() 方法会返回一个新数组。

with() 方法不会改变原始数组。

语法:

array.with(index, value)

参数:

参数描述
index必需。要更改的元素的索引(位置)。负索引从数组末尾开始计数。
value必需。新的值。

示例:

const arr = [1,2,3,4];const arr1 = arr.with(1, 100);console.log(arr1)  //[1,100,3,4]

36.findLastIndex()方法

findLastIndex() 方法会对数组中的每个元素执行一个函数。

findLastIndex() 方法返回通过测试的最后一个元素的索引(位置)。

如果没有找到匹配项,则返回 -1。

对于空数组元素,findLastIndex() 方法不会执行函数。

findLastIndex() 方法不会改变原始数组。

语法:

array.findLastIndex(function(currentValue, index, arr), thisValue)

参数:

参数描述
function必需。为每个数组元素运行的函数。
currentValue必需。当前元素的值。
index可选。当前元素的索引。
arr可选。当前元素所在的数组。
thisValue可选,默认为 undefined。作为函数的 this 值传递。

示例:

const ages = [3, 30, 18, 20];let a = ages.findLastIndex(age => age>18);console.log(`最后一个大于18的元素的下标为:${a}`) //3

37.lastIndexOf()方法

检查数组当中符合条件的元素最后一次出现的下标,从该字符串的后面向前查找,如果要检索的元素没有出现,则该方法返回 -1。

语法:

array.lastIndexOf(item,start)

参数:

参数描述
item必需。规定需检索的字符串值。
start可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的最后一个字符处开始检索。

示例:

const arr = [3, 30, 18, 20];let a = arr.lastIndexOf(20);console.log(`元素20最后一次出现的的下标为:${a}`) //3
const arr = [3, 30, 18, 20];let a = arr.lastIndexOf(40);console.log(`元素40最后一次出现的的下标为:${a}`) //-1
const arr = [3, 20, 18, 20];let a = arr.lastIndexOf(20,2);console.log(`元素20从下标2开始向后,最后一次出现的的下标为:${a}`) //1

38.findLast()方法

findLast() 方法返回通过条件判断的最后一个元素的值。

findLast() 方法会对数组中的每个元素执行一个函数。

如果未找到符合条件的元素,则 findLast() 方法返回 undefined。

对于空数组元素,findLast() 方法不会执行函数。

findLast() 方法不会改变原始数组。

语法:

array.findLast(function(currentValue, index, arr), thisValue)

参数:

方法描述
indexOf()找到具有指定值的第一个元素的索引
lastIndexOf()找到具有指定值的最后一个元素的索引
find()找到通过测试的第一个元素的值
findIndex()找到通过测试的第一个元素的索引
findLast()找到通过测试的最后一个元素的值
findLastIndex()找到通过测试的最后一个元素的索引

示例:

	const ages = [3, 10, 18, 20,30,40];let a = ages.findLast(age => age>18) console.log(`最后一次符合大于18的条件的元素是${a}`) //40

39.toReversed()方法

反转数组顺序,与reverse()方法实现的效果相同,是reverse()方法的复制版本。

语法:

array.toReversed()

示例:

	// 创建数组const arr = [1,2,3,4];// 反转数组const arr1 = arr.toReversed();console.log(arr1)//[4,3,2,1]

与reverse 的区别

toReversed() 的返回值永远不是稀疏的。空槽在返回的数组中变为 undefined

	// 创建数组const arr = [1,,2,3,4];// 反转数组const arr1 = arr.toReversed();console.log(arr1)

在这里插入图片描述

// 创建数组const arr = [1,,2,3,4];// 反转数组const arr1 = arr.reverse();console.log(arr1)

在这里插入图片描述

40.toSorted() 方法

toSorted() 方法用于对数组中的元素按字母顺序进行排序,排序的方法与sort()方法一致,同样的toSorted()的返回值永远不是稀疏的。空槽在返回的数组中变为 undefined

toSorted() 方法返回一个新的数组。

toSorted() 方法不会修改原始数组。

toSorted() 是 sort() 方法的复制版本。

语法:

array.toSorted(compareFunction)

参数:

参数描述
compareFunction(可选)定义排序顺序的函数。该函数应根据参数返回负值、零或正值,例如:function(a, b) { return a - b; }当 sort() 比较两个值时,它会将值传递给比较函数,并根据返回值(负值、零、正值)对值进行排序。

示例:

//降序排序
const fruits = ["Banana", "Orange", "Apple", "Mango"];
const fruits2 = fruits.toSorted();
fruits2.reverse();

这里数字的排序与sort()方法一致

//查找最小值
const points = [40, 100, 1, 5, 25, 10];let points2 = points.toSorted(function(a, b) { return a - b; });let lowest = points2[0];console.log(lowest) //1
//查找最大值
const points = [40, 100, 1, 5, 25, 10];let points2 = points.toSorted(function(a, b) { return b - a; });let highest = points2[0];console.log(highest)

41.toSpliced() 方法

toSpliced() 方法用于向数组中添加和/或移除元素,toSpliced()的返回值永远不是稀疏的。空槽在返回的数组中变为 undefined

toSpliced() 方法返回一个新的数组。

toSpliced() 方法不会修改原始数组。

toSpliced() 是 splice() 方法的复制版本。

语法:

array.toSpliced(index, count, item1, ..., itemX)

参数:

参数描述
index(必需)要添加或移除元素的索引(位置)。负值从数组末尾开始计数。
count(可选)要移除的元素数量。
item1, …(可选)要添加的新元素。

示例:

const fruits = ["Banana", "Orange", "Apple", "Mango"];
const fruits2 = fruits.toSpliced(2, 2); 
console.log(fruits2 )// ["Banana", "Orange"]

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/41240.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

string 的接口

我们继续来讲解一些常用的string接口。 一.at接口 我们来看一个越界的问题。 我们运行之后发现这是一个断言错误&#xff0c;直接就终止我们的程序了&#xff0c;不能作为异常被捕捉到&#xff0c;但是我们如果不想让程序直接崩溃该怎么办呢&#xff1f; 此时我们就要用到at关键…

2000-2019年各省地方财政行政事业性收费收入数据

2000-2019年各省地方财政行政事业性收费收入数据 1、时间&#xff1a;2000-2019年 2、来源&#xff1a;国家统计局、统计年鉴 3、指标&#xff1a;行政区划代码、地区、年份、地方财政行政事业性收费收入 4、范围&#xff1a;31省 5、指标说明&#xff1a;地方财政行政事业…

Pytorch学习笔记(九)Learning PyTorch - Deep Learning with PyTorch: A 60 Minute Blitz

这篇博客瞄准的是 pytorch 官方教程中 Learning PyTorch 章节的 Deep Learning with PyTorch: A 60 Minute Blitz 部分&#xff0c; 官网链接&#xff1a;https://pytorch.org/tutorials/beginner/deep_learning_60min_blitz.html 完整网盘链接: https://pan.baidu.com/s/1L9…

Elasticsearch 的搜索功能

Elasticsearch 的搜索功能 建议阅读顺序&#xff1a; Elasticsearch 入门Elasticsearch 搜索&#xff08;本文&#xff09; 1. 介绍 使用 Elasticsearch 最终目的是为了实现搜索功能&#xff0c;现在先将文档添加到索引中&#xff0c;接下来完成搜索的方法。 查询的分类&…

比特币等虚拟货币实时价格使用说明,数字货币价格获取,k线获取,实时价格获取

数据截图 k线数据 websocket 实时价格数据 根据这些数据可以做出自己的产品 获取时间段内的k线数据 在开始之前&#xff0c;你需要知道的知识&#xff1a; 币种缩写英文名币种IDBTCBitcoinbitcoinETHEthereumethereumEOSEOSeosUSDTTethertetherLTCLitecoinlitecoinUSDDol…

初阶7 vector

本章重点 vector的介绍vector的使用vector的模拟实现 1.vector的介绍 vector就类似数据结构中的顺序表 vector是表示可变大小数组的序列容器。 就像数组一样&#xff0c;vector也采用的连续存储空间来存储元素。 意味着可以采用下标对vector的元素 进行访问&#xff0c;和数…

解码未来:DeepSeek开源FlashMLA,推理加速核心技术,引领AI变革

前言&#xff1a; DeepSeek 兑现了自己的诺言&#xff0c;开源了一款用于 Hopper GPU 的高效型 MLA 解码核&#xff1a;FlashMLA。 项目地址&#xff1a;https://github.com/deepseek-ai/FlashMLA 1:FlashMLA 是什么呀&#xff1f; MLA是DeepSeek大模型的重要技术创新点&…

scss预处理器对比css的优点以及基本的使用

本文主要在vue中演示&#xff0c;scss的基本使用。安装命令 npm install sass sass-loader --save-dev 变量 SCSS 支持变量&#xff0c;可将常用的值&#xff08;如颜色、字体大小、间距等&#xff09;定义为变量&#xff0c;方便重复使用和统一修改。 <template><…

GPU架构与通信互联技术介绍

文章目录 GPU架构介绍SM 和 Warp Scheduler GPU通信互联技术介绍1、GPUDirectGPUDirect Shared AccessGPUDirect P2PGPUDirect for VideoGPUDirect for RDMARDMAGPUDirect RDMA GPUDirect Storage 2、NVLink & NVSwitchNVLinkNVSwitch 3、应用场景总结 GPU架构介绍 SM 和 …

强化学习与神经网络结合(以 DQN 展开)

目录 基于 PyTorch 实现简单 DQN double DQN dueling DQN Noisy DQN&#xff1a;通过噪声层实现探索&#xff0c;替代 ε- 贪心策略 Rainbow_DQN如何计算连续型的Actions 强化学习中&#xff0c;智能体&#xff08;Agent&#xff09;通过与环境交互学习最优策略。当状态空间或动…

day 16

创建链接文件 软链接&#xff1a;又叫符号链接&#xff0c;类似win的快捷方式&#xff0c;是一种用来建立文件的特殊文件&#xff0c;这个文件里的数据都是建立链接的文件&#xff0c;但是它和建立链接的文件不是一个东西&#xff0c;如果建立链接的文件移动或删除&#xff0c…

fork系统调用

基本概念&#xff1a; 在操作系统里&#xff0c;进程是正在运行的程序的实例。fork() 函数的作用是复制当前进程&#xff0c;生成一个新的进程&#xff0c;这个新进程被称作子进程&#xff0c;而原本的进程则是父进程。这两个进程&#xff08;父进程和子进程&#xff09;会从 …

【leetcode刷题记录】(java)数组 链表 哈希表

文章目录 四、题目之&#xff1a;代码随想录(1) 代码随想录&#xff1a;数组[704. 二分查找](https://leetcode.cn/problems/binary-search/)[27. 移除元素](https://leetcode.cn/problems/remove-element/)暴力解:双指针&#xff1a; [977. 有序数组的平方](https://leetcode.…

在线运行vscode

安装 https://github.com/coder/code-server?utm_sourcesyndication&pubDate20250317 运行前预览脚本 curl -fsSL https://code-server.dev/install.sh | sh -s -- --dry-run运行脚本 curl -fsSL https://code-server.dev/install.sh | sh其他 可以通过后台服务运行&am…

【Tauri2】002——Cargo.toml和入口文件

目录 前言 正文 toml文件的基础 注释——# Comment 键值对——Key/Value 表——[table] 内联表——Inline Table 数组——Array package和crate Cargo.toml文件 Cargo.toml——dependencies Cargo.toml——lib crate-type main.rs 前言 【Tauri2】001——安装及…

Netty源码—7.ByteBuf原理三

大纲 9.Netty的内存规格 10.缓存数据结构 11.命中缓存的分配流程 12.Netty里有关内存分配的重要概念 13.Page级别的内存分配 14.SubPage级别的内存分配 15.ByteBuf的回收 9.Netty的内存规格 (1)4种内存规格 (2)内存申请单位 (1)4种内存规格 一.tiny&#xff1a;表示从…

W、M、C练题笔记(持续更新中)

web here are the flag 点击&#xff0c;页面跳转404.php&#xff0c;用bp抓包访问/flag.php页面&#xff0c;得到flag用base64解码 TryToFindFlag 打开后查看源代码 发现是robots协议&#xff0c;访问robots.txt 访问flllaaa......&#xff0c;得到空白页面&#xff0c;查看…

【高项】信息系统项目管理师(十二)项目干系人管理【3分】

项目干系人管理包括识别能够影响项目或会受项目影响的人员、团队或组织,分析干系人对项目的期望和影响,制定管理策略有效调动干系人参与项目决策和执行。项目干系人管理过程能够支持项目团队的工作。一、管理基础 1、管理的重要性 项目经理和团队管理干系人的能力决定着项目…

Keil(ARMCC)编译改为Cmake(GNU)编译

1. 环境介绍&#xff1a; 某款ARM-M4芯片&#xff08;应该芯片通用&#xff09;cmkeGNUNinja&#xff08;CLion&#xff09; 2. 必备&#xff1a; 芯片启动文件 startup_xxxx.s链接文件 xxxx_flash.ldCMakeLists.txt 3. 具体修改步骤 第一步&#xff1a;观察启动文件…

SpringCould微服务架构之Docker(4)

Docker ce是社区版。 安装docker之前&#xff0c;先安装yum-util 。 安装docker之前&#xff0c;一定要先关闭防火墙。