javascript 数组精简技巧小结


Posted in Javascript onFebruary 26, 2020

数组是 JS 最常见的一种数据结构,咱们在开发中也经常用到,在这篇文章中,提供一些小技巧,帮助咱们提高开发效率。

1. 删除数组的重复项

javascript 数组精简技巧小结

2. 替换数组中的特定值

有时在创建代码时需要替换数组中的特定值,有一种很好的简短方法可以做到这一点,咱们可以使用.splice(start、value to remove、valueToAdd),这些参数指定咱们希望从哪里开始修改、修改多少个值和替换新值。

javascript 数组精简技巧小结

3. Array.from 达到 .map 的效果

咱们都知道 .map() 方法,.from() 方法也可以用来获得类似的效果且代码也很简洁。

javascript 数组精简技巧小结

4.置空数组

有时候我们需要清空数组,一个快捷的方法就是直接让数组的 length 属性为 0,就可以清空数组了。

javascript 数组精简技巧小结

5. 将数组转换为对象

有时候,出于某种目的,需要将数组转化成对象,一个简单快速的方法是就使用展开运算符号(...):

javascript 数组精简技巧小结

6. 用数据填充数组

在某些情况下,当咱们创建一个数组并希望用一些数据来填充它,这时 .fill()方法可以帮助咱们。

javascript 数组精简技巧小结

7. 数组合并

使用展开操作符,也可以将多个数组合并起来。

javascript 数组精简技巧小结

8.求两个数组的交集

求两个数组的交集在面试中也是有一定难度的正点,为了找到两个数组的交集,首先使用上面的方法确保所检查数组中的值不重复,接着使用.filter 方法和.includes方法。如下所示:

javascript 数组精简技巧小结

9.从数组中删除虚值

在 JS 中,虚值有 false, 0''null, NaN, undefined。咱们可以 .filter() 方法来过滤这些虚值。

javascript 数组精简技巧小结

10. 从数组中获取随机值

有时我们需要从数组中随机选择一个值。一种方便的方法是可以根据数组长度获得一个随机索引,如下所示:

javascript 数组精简技巧小结

11.反转数组

现在,咱们需要反转数组时,没有必要通过复杂的循环和函数来创建它,数组的 reverse 方法就可以做了:

javascript 数组精简技巧小结

12 lastIndexOf() 方法

javascript 数组精简技巧小结

13.对数组中的所有值求和

JS 面试中也经常用 reduce 方法来巧妙的解决问题

javascript 数组精简技巧小结

总结

在本文中,介绍了13个技巧,希望它们可以帮助编写简洁代码,如果你还有更好的办法,欢迎留言讨论。

英文原文:

https://dev.to/duomly/13-useful-javascript-array-tips-and-tricks-you-should-know-2jfo

到此这篇关于javascript 数组精简技巧小结的文章就介绍到这了,更多相关js数组精简内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
jquery ajax对特殊字符进行转义防止js注入使用示例
Nov 21 Javascript
Redis基本知识、安装、部署、配置笔记
Mar 05 Javascript
jQuery的Scrollify插件实现滑动到页面下一节点
Jul 05 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
Nov 17 Javascript
获取input标签的所有属性的方法
Jun 28 Javascript
bootstrap switch开关组件使用方法详解
Aug 22 Javascript
Angular2.0/4.0 使用Echarts图表的示例代码
Dec 07 Javascript
Vue中的验证登录状态的实现方法
Mar 09 Javascript
Vue实现回到顶部和底部动画效果
Jul 31 Javascript
keep-alive不能缓存多层级路由菜单问题解决
Mar 10 Javascript
解决VUE 在IE下出现ReferenceError: Promise未定义的问题
Nov 07 Javascript
vue动态合并单元格并添加小计合计功能示例
Nov 26 Vue.js
vue父子模板传值问题解决方法案例分析
Feb 26 #Javascript
jquery实现直播视频弹幕效果
Feb 25 #jQuery
JavaScript实现打砖块游戏
Feb 25 #Javascript
深入理解Antd-Select组件的用法
Feb 25 #Javascript
京东优选小程序的实现代码示例
Feb 25 #Javascript
手把手带你入门微信小程序新框架Kbone的使用
Feb 25 #Javascript
vue 路由守卫(导航守卫)及其具体使用
Feb 25 #Javascript
You might like
人尽可用的Windows技巧小贴士之下篇
2007/03/22 PHP
PHP下使用CURL方式POST数据至API接口的代码
2013/02/14 PHP
探讨:php中在foreach中使用foreach ($arr as &$value) 这种类型的解释
2013/06/24 PHP
php多种形式发送邮件(mail qmail邮件系统 phpmailer类)
2014/01/22 PHP
php实现的中秋博饼游戏之绘制骰子图案功能示例
2017/11/06 PHP
用jquery实现下拉菜单效果的代码
2010/07/25 Javascript
js 静态动态成员 and 信息的封装和隐藏
2011/05/29 Javascript
JavaScript高级程序设计(第3版)学习笔记2 js基础语法
2012/10/11 Javascript
Jquery事件的连接使用示例
2013/06/18 Javascript
JQuery实现样式设置、追加、移除与切换的方法
2015/06/11 Javascript
jQuery实现简单的文件上传进度条效果
2020/03/26 Javascript
js实现微信分享代码
2020/10/11 Javascript
Bootstrap零基础学习第一课之模板
2016/07/18 Javascript
JS中检测数据类型的几种方式及优缺点小结
2016/12/12 Javascript
简单实现js放大镜效果
2017/07/24 Javascript
webpack使用 babel-loader 转换 ES6代码示例
2017/08/21 Javascript
JS中‘hello’与new String(‘hello’)引出的问题详解
2018/08/14 Javascript
使用Python设置tmpfs来加速项目的教程
2015/04/17 Python
python中函数总结之装饰器闭包详解
2016/06/12 Python
分享Python开发中要注意的十个小贴士
2016/08/30 Python
Python中字典和集合学习小结
2017/07/07 Python
python文件特定行插入和替换实例详解
2017/07/12 Python
numpy.linspace函数具体使用详解
2019/05/27 Python
Pyqt QImage 与 np array 转换方法
2019/06/27 Python
解决Python二维数组赋值问题
2019/11/28 Python
Python super()方法原理详解
2020/03/31 Python
python中使用asyncio实现异步IO实例分析
2021/02/26 Python
PHP面试题附答案
2015/11/28 面试题
学生生病请假条范文
2014/02/16 职场文书
合作意向协议书范本
2014/03/31 职场文书
优秀求职信
2014/05/29 职场文书
司法所长先进事迹
2014/06/02 职场文书
党员对照检查材料思想汇报
2014/09/16 职场文书
教师群众路线教育实践活动学习笔记
2014/11/05 职场文书
违反纪律检讨书范文
2015/05/07 职场文书
2015-2016年小学教导工作总结
2015/07/21 职场文书