JS 数组的几个炫酷操作

原创 智云编程 随笔 前端 176阅读 15 天前 举报

前言

本文主要从应用来讲数组api的一些骚操作,如一行代码扁平化n维数组、数组去重、求数组最大值、数组求和、排序、对象和数组的转化等。

上面这些应用场景你可以用一行代码实现吗?

1.扁平化n维数组
1.终极篇

Array.flat(n)是ES10扁平数组的api, n表示维度, n值为 Infinity时维度为无限大。

2.开始篇

实质是利用递归和数组合并方法 concat实现扁平。

2.去重

1.终极篇

set是ES6新出来的一种一种定义不重复数组的数据类型。

Array.from是将类数组转化为数组。

...是扩展运算符,将set里面的值转化为字符串。

2.开始篇

取新数组存值,循环两个数组值相比较。

3.排序

1.终极篇

sort是js内置的排序方法,参数为一个函数

2.开始篇

冒泡排序:

选择排序:

对web开发技术感兴趣的小伙伴,欢迎加入:前端学习圈,不管你是小白还是大牛我都欢迎
4.最大值

1.终极篇

Math.max()是 Math对象内置的方法,参数是字符串。

reduce是ES5的数组api,参数有函数和默认初始值。

函数有四个参数:

pre:上一次的返回值

cur:当前值

curIndex:当前值索引

arr:当前数组

2.开始篇

先排序再取值。

5.求和

1.终极篇

2.开始篇

利用 slice截取改变数组,再利用递归求和。

6.合并

1.终极篇

2.开始篇

7.判断是否包含值

1.终极篇

includes()、 find()、 findIndex()是ES6的api。

2.开始篇

8.类数组转化

1.终极篇

类数组:表示有 length属性,但是不具备数组的方法。

call、 apply:改变 slice里面的 this指向 arguments,所以 arguments也可调用数组的方法。

Array.from:将类似数组或可迭代对象创建为数组。

...:将类数组扩展为字符串,再定义为数组。

2.开始篇

9.每一项设置值

1.终极篇

fill是ES6的方法。2.开始篇

10.每一项是否满足

every是ES5的api,,每一项满足返回 true。

11.有一项满足

some是ES5的api,有一项满足返回 true。

12.过滤数组

filter是ES5的api,返回满足添加的项的数组。

13.对象和数组转化

我们采集的是石头,但是必须时刻展望未来的大教堂。

持续做一些小改进,慢慢地你就会惊奇地发现你的经验得到了怎么样的发展,你的技能得到了怎样的提升。

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复