【Web前端】关于JS数组方法的一些理解
创始人
2024-05-27 07:06:29
0

一、具备栈特性的方法

unshift(...items: T[]) : number

将一个或多个元素添加到数组的开头,并返回该数组的新长度。

shift(): T | undefined

从数组中删除第一个元素,并返回该元素的值。此方法更改数组的长度。

二、具备队列特性的方法

push(...items: T[]): number;

将一个或多个元素添加到数组的末尾,并返回该数组的新长度。

pop(): T | undefined;

方法从数组中删除最后一个元素,并返回该元素的值。此方法会更改数组的长度。

三、具备排序特性的方法

reverse()

将数组中元素的位置颠倒,并返回该数组。数组的第一个元素会变成最后一个,数组的最后一个元素变成第一个。该方法会改变原数组。

sort(compareFn?: (a: number, b: number) => number): this;

对数组的元素进行排序,并返回数组。

1、如果没有指明 compareFn ,会按照转换为的字符串的诸个字符的 Unicode 位点进行排序。例如 "Banana" 会被排列到 "cherry" 之前。涉及到数字时要尤为注意:

const array1 = [1, 30, 4, 21, 100000];

array1.sort();

console.log(array1); // [1, 100000, 21, 30, 4]

2、如果指明了 compareFn ,那么数组会按照调用该函数的返回值排序:

compareFn(a, b) 返回值

排序顺序

> 0

a 在 b 后

< 0

a 在 b 前

=== 0

保持 a 和 b 的顺序

四、数组截取的方法

slice(start?: number, end?: number): Int8Array;

将 [start,end) 范围内的元素浅拷贝至一个新数组中并返回该数组,原始数组不会被改变。

splice(start: number, deleteCount?: number): T[];

通过删除、替换现有元素或原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。

五、元素遍历相关的方法

every(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): boolean;

判断数组内的所有元素是否都满足函数的执行条件。都通过返回true,否则返回false

some(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): boolean;

判断数组内是否有元素满足函数的执行条件。只要有一个通过就返回true,否则返回false

map(callbackfn: (value: number, index: number, array: Int8Array) => number, thisArg?: any): Int8Array;

创建一个新数组,这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成,一般用于数据转换,注意map函数是在遍历每一项元素时执行回调函数,而不是调用者控制遍历,因此return不能跳出map循环

forEach(callbackfn: (value: number, index: number, array: Uint8Array) => void, thisArg?: any): void;

使用上基本和map和一样,区别在于它没有返回值。

reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number) => T): T;

遍历数组,每循环一次,将循环返回值当成下一次循环的初始值参与计算。

比如计算所有元素的总和:

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

arr.reduce((pre,cur)=>(pre+cur)); // return 15

详细使用参考这篇文章

六、元素查找的方法

at(index:number)

返回index索引对应的元素,允许正数和负数。负整数从数组中的最后一个元素开始倒数。

indexOf(searchElement: T, fromIndex?: number): number;

返回在数组中可以找到给定元素的第一个索引,如果不存在,则返回 -1。

lastIndexOf(searchElement: T, fromIndex?: number): number;

返回指定元素在数组中的最后一个的索引,如果不存在则返回 -1。从后向前查找。

findIndex(predicate: (value: number, index: number, obj: Int8Array) => boolean, thisArg?: any): number;

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

find(predicate: (value: number, index: number, obj: Uint8Array) => boolean, thisArg?: any): number | undefined;

返回数组中满足提供的函数条件的第一个元素的值。否则返回 undefined。

七、toString()和toLocalString()的区别

toString()和toLocalString()都是对数组的每个元素执行Object对应的方法并用”,”join出一段字符串返回。一般情况下元素的toString和toLocalString是一样的,但请注意number和date这俩货,他们重写了toLocalString方法。

1、数字:

const number=123456789;

console.log(number.toString()); //'123456789'

console.log(number.toLocalString()); //'123,456,789'

2、日期:

const date=new Date();

console.log(date.toString()); //'Tue Feb 28 2023 16:54:36 GMT+0800 (中国标准时间)'

console.log(date.toLocalString()); //'2023/2/28 16:54:36'

相关内容

热门资讯

监控摄像头接入GB28181平... 流程简介将监控摄像头的视频在网站和APP中直播,要解决的几个问题是:1&...
Windows10添加群晖磁盘... 在使用群晖NAS时,我们需要通过本地映射的方式把NAS映射成本地的一块磁盘使用。 通过...
protocol buffer... 目录 目录 什么是protocol buffer 1.protobuf 1.1安装  1.2使用...
在Word、WPS中插入AxM... 引言 我最近需要写一些文章,在排版时发现AxMath插入的公式竟然会导致行间距异常&#...
【PdgCntEditor】解... 一、问题背景 大部分的图书对应的PDF,目录中的页码并非PDF中直接索引的页码...
修复 爱普生 EPSON L4... L4151 L4153 L4156 L4158 L4163 L4165 L4166 L4168 L4...
Fluent中创建监测点 1 概述某些仿真问题,需要创建监测点,用于获取空间定点的数据࿰...
educoder数据结构与算法...                                                   ...
MySQL下载和安装(Wind... 前言:刚换了一台电脑,里面所有东西都需要重新配置,习惯了所...
MFC文件操作  MFC提供了一个文件操作的基类CFile,这个类提供了一个没有缓存的二进制格式的磁盘...