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 相关文章推荐
js函数setTimeout延迟执行的简单介绍
Jul 17 Javascript
用jquery中插件dialog实现弹框效果实例代码
Nov 15 Javascript
JavaScript中统计Textarea字数并提示还能输入的字符
Jun 10 Javascript
jQuery实现购物车计算价格功能的方法
Mar 25 Javascript
原生javascript实现解析XML文档与字符串
Mar 01 Javascript
jQuery 翻页组件yunm.pager.js实现div局部刷新的思路
Aug 11 Javascript
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
Jun 26 jQuery
React Native之ListView实现九宫格效果的示例
Aug 02 Javascript
jQuery实现左右滑动的toggle方法
Mar 03 jQuery
在vue-cli的组件模板里使用font-awesome的两种方法
Sep 28 Javascript
vue集成kindeditor富文本的实现示例代码
Jun 07 Javascript
layui实现多图片上传并限制上传的图片数量
Sep 26 Javascript
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
怎样在UNIX系统下安装php3
2006/10/09 PHP
非常好用的两个PHP函数 serialize()和unserialize()
2012/02/04 PHP
PHP实现多级分类生成树的方法示例
2017/02/07 PHP
Codeigniter里的无刷新上传的实现代码
2019/04/14 PHP
简明json介绍
2008/09/28 Javascript
Javascript学习笔记6 prototype的提出
2010/01/11 Javascript
使用jquery实现select添加实现后台权限添加的效果
2011/05/28 Javascript
基于jquery的滚动鼠标放大缩小图片效果
2011/10/27 Javascript
javascript正则表达式参数/g与/i及/gi的使用指南
2014/08/27 Javascript
jQuery使用empty()方法删除元素及其所有子元素的方法
2015/03/26 Javascript
JavaScript获取页面中第一个锚定文本的方法
2015/04/03 Javascript
js实现日历的简单算法
2017/01/24 Javascript
Vue Cli与BootStrap结合实现表格分页功能
2017/08/18 Javascript
JS使用对象的defineProperty进行变量监控操作示例
2019/02/02 Javascript
JavaScript 继承 封装 多态实现及原理详解
2019/07/29 Javascript
零基础写python爬虫之爬虫的定义及URL构成
2014/11/04 Python
Python获取文件所在目录和文件名的方法
2017/01/12 Python
基于Django的ModelForm组件(详解)
2017/12/07 Python
关于python2 csv写入空白行的问题
2018/06/22 Python
Puppeteer使用示例详解
2019/06/20 Python
Python实现疫情通定时自动填写功能(附代码)
2020/05/27 Python
基于python实现判断字符串是否数字算法
2020/07/10 Python
Python eval函数介绍及用法
2020/11/09 Python
python UDF 实现对csv批量md5加密操作
2021/01/01 Python
英国一家专门出售品牌鞋子的网站:Allsole
2016/08/07 全球购物
如何在C# winform中异步调用web services
2015/09/21 面试题
Linux如何命名文件--使用文件名时应注意
2014/05/29 面试题
什么是设计模式
2012/06/17 面试题
保安员岗位职责
2013/11/17 职场文书
顶岗实习接收函
2014/01/09 职场文书
2015高考寄语集锦
2015/02/27 职场文书
运动会广播稿300字
2015/08/19 职场文书
车辆挂靠协议书
2016/03/23 职场文书
网络新闻该怎么写?这些写作技巧你都知道吗?
2019/08/26 职场文书
mysql知识点整理
2021/04/05 MySQL
Python使用Web框架Flask开发项目
2022/06/01 Python