1.生成指定范围的数字

在某些情况下,我们会创建一个处在两个数之间的数组。假设我们要判断某人的生日是否在某个范围的年份内,那么下面是实现它的一个很简单的方法

1
2
3
4
5
6
let start = 1900, end = 2000;
[...new Array(end + 1).keys()].slice(start);
// [ 1900, 1901, ..., 2000]
// 还有这种方式,但对于很的范围就不太稳定
 
Array.from({ length: end - start + 1 }, (_, i) => start + i);

2.使用值数组作为函数的参数

在某些情况下,我们需要将值收集到数组中,然后将其作为函数的参数传递。 使用 ES6,可以使用扩展运算符(...)并从[arg1, arg2] > (arg1, arg2)中提取数组:

1
2
3
4
5
6
7
const parts = {
 first: [0, 2],
 second: [1, 3],
}
 
["Hello", "World", "JS", "Tricks"].slice(...parts.second)
// ["World", "JS"]

3.将值用作 Math 方法的参数

当我们需要在数组中使用Math.max或Math.min来找到最大或者最小值时,我们可以像下面这样进行操作:

1
2
3
4
5
6
7
8
9
const elementsHeight = [...document.body.children].map(
 el => el.getBoundingClientRect().y
);
Math.max(...elementsHeight);
// 474
 
const numbers = [100, 100, -1000, 2000, -3000, 40000];
Math.min(...numbers);
// -3000

4.合并/展平数组中的数组

Array 有一个很好的方法,称为Array.flat,它是需要一个depth参数,表示数组嵌套的深度,默认值为1。 但是,如果我们不知道深度怎么办,则需要将其全部展平,只需将Infinity作为参数即可

9个JavaScript日常开发小技巧的更多相关文章

  1. ( 译、持续更新 ) JavaScript 上分小技巧(四)

    后续如有内容,本篇将会照常更新并排满15个知识点,以下是其他几篇译文的地址: 第一篇地址:( 译.持续更新 ) JavaScript 上分小技巧(一) 第二篇地址:( 译.持续更新 ) JavaScr ...

  2. ( 译、持续更新 ) JavaScript 上分小技巧(一)

    感谢好友破狼提供的这篇好文章,也感谢写这些知识点的作者们和将他们整理到一起的作者.这是github上的一篇文章,在这里本兽也就只做翻译,由于本兽英语水平和编程能力都不咋地,如有不好的地方也请多理解体谅 ...

  3. ( 译、持续更新 ) JavaScript 上分小技巧(三)

    最近家里杂事较多,自学时间实在少的可怜,所以都在空闲时间看看老外写的内容,学习之外顺便翻译分享~等学习的时间充足些再写写自己的一些学习内容和知识点分析(最近有在接触的:复习(C#,SQL).(学习)T ...

  4. ( 译、持续更新 ) JavaScript 上分小技巧(二)

    考虑到文章过长,不便于阅读,这里分出第二篇,如有后续,每15个知识点分为一篇... 第一篇地址:( 译.持续更新 ) JavaScript 上分小技巧(一) 第三篇地址:( 译.持续更新 ) Java ...

  5. Windows统一平台: 开发小技巧

    Windows统一平台: 开发小技巧 技巧一: 在手机端拓展你应用的显示区域.(WP8.1中也适用) 对于Windows Phone系统的手机, 手机屏幕最上方为系统状态栏(System Tray), ...

  6. flex开发小技巧集锦

    关于flex开发网上有非常多的相关信息介绍,因此我们要想学习关于flex开发的知识信息技能是一件非常简单和方便的事情.而针对于flex开发小编要告诉大家的是一些flex开发小技巧.利用这些小技巧能够有 ...

  7. TP开发小技巧

    TP开发小技巧原文地址http://wp.chenyuanzhao.com/wp/2016/07/23/tp%E5%BC%80%E5%8F%91%E5%B0%8F%E6%8A%80%E5%B7%A7/ ...

  8. 移动Web开发小技巧

    移动Web开发小技巧 添加到主屏后的标题(IOS) name="apple-mobile-web-app-title" content="标题"> 启用  ...

  9. BizTalk开发小技巧

    BizTalk开发小技巧 随笔分类 - Biztalk Biztalk 使用BizTalk实现RosettaNet B2B So Easy 摘要: 使用BizTalk实现RosettaNet B2B ...

随机推荐

  1. 第1天 | 12天搞定Python,告诉你有什么用?

    掌握多一门编程语言,多一种选择,多一份机遇,更何况学的是人见人爱,花见花开的Python语言.它目前可占据编程语言排行榜的第3名,是名副其实的"探花郎",无论用它做什么(网络爬虫. ...

  2. RHSA-2018:1700-重要: procps-ng 安全更新(存在EXP、本地提权)

    [root@localhost ~]# cat /etc/redhat-release CentOS Linux release 7.2.1511 (Core) 修复命令: 使用root账号登陆She ...

  3. javascript 数据类型判断总结

    一 typeof 回顾:js有五种基本数据类型:值类型("number","string","boolean","undefine ...

  4. 如何win7安装tomcat

    首先安装jdk,查看当前jdk版本. >java -version 显示的是1.8.0_131 为此我们安装的tomcat版本是apache-tomcat-9.0.38-windows-x64. ...

  5. 多测师讲解pthon_002字符,列表,元组,字段等

    # # # 索引:# # # 正向索引:  0  1  2  3  4  5  6# # #      l=   a  b  c  d  e  f  g# # # 反向索引: -7 -6 -5 -4 ...

  6. 编程语言那么多,为什么偏偏是C语言成了大学的必修课?

    谁叫你不幸生在中国了?--何祚庥(中国科学院院士) 这是一本给非计算机专业的大学生的C语言的书."我不是学计算机的,为啥要学C语言?"这个问题每年在中华大地都会被问上几百万次. 被 ...

  7. 拦截导弹简单版——线性dp

    题目描述 某国为了防御敌国的导弹袭击,发展出一种导弹拦截系统.但是这种导弹拦截系统有一个缺陷:虽然它的第一发炮弹能够到达任意的高度,但是以后每一发炮弹都不能高于前一发的高度.某天,雷达捕捉到敌国的导弹 ...

  8. docker启动服务---------------redis

    1. docker拉取镜像 docker pull redis 2 建立配置目录和准备配置文件 mkdir -p /usr/local/docker-redis && cd /usr/ ...

  9. 第二章 rsync服务原理

    一.备份 1.什么是备份? 1)把重要的数据或者文件再次复制一份并保存下来 2.为什么要做备份? 1)数据的重要性 2)为了出现故障,恢复数据 3.能不能不备份? 1)重要的数据一定要备份 2)不重要 ...

  10. 3.QOpenGLWidget-通过着色器来渲染渐变三角形

    在上章2.通过QOpenGLWidget绘制三角形,我们学习绘制三角形还是单色的,本章将为三角形每个顶点着色.   1.着色器描述 着色器的开头总是要声明版本,接着是输入和输出变量.uniform和m ...