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. 带着好奇心去探索IDEA

    带着好奇心去探索IDEA 工欲善其事必先利其器 软件是提高工作效率的工具.所以了解工具的特性,操作方式,能更好地使用它.一般使用掌握逻辑: 第一步:了解菜单栏-工具栏-其他窗口: 第二步:实战,真正利 ...

  2. 手把手教你使用 Prometheus 监控 JVM

    概述 当你的 Java 业务容器化上 K8S 后,如果对其进行监控呢?Prometheus 社区开发了 JMX Exporter 来导出 JVM 的监控指标,以便使用 Prometheus 来采集监控 ...

  3. DM9000网卡驱动分析(转)

    s3c6410自带的DM9000网卡驱动也是基于platform设备模型. 其定义的设备资源在arch/arm/mach-s3c64xx/mach-smdk6410中.有网卡的resource res ...

  4. springboot2.2.2企业级项目整合redis与redis 工具类大全

    1.springboot2.2.2整合redis教程很多,为此编写了比较完整的redis工具类,符合企业级开发使用的工具类 2.springboot与redis maven相关的依赖 <depe ...

  5. Presto在滴滴的探索与实践

    ​桔妹导读:Presto在滴滴内部发展三年,已经成为滴滴内部Ad-Hoc和Hive SQL加速的首选引擎.目前服务6K+用户,每天读取2PB ~ 3PB HDFS数据,处理30万亿~35万亿条记录,为 ...

  6. Jmeter之接口依赖

    一.应用场景 1.现在有两个接口,一个是登录,一个查询,但查询接口必须要依赖登录接口的token,那么通过正则表达式提取器提取登录接口的响应结果 2.现在有两个接口,A接口返回列表数据,另一个查询接口 ...

  7. 为什么大部分的程序员学编程,都会选择从C语言开始?

    软件行业经过几十年的发展,编程语言的种类已经越来越多了,而且很多新的编程语言已经在这个领域从开始的默默无闻到如今风风火火,整个编程语言朝着集成化方向发展,这样会导致很多的初学者选择上不像以前那么单一了 ...

  8. go ioutial 读取写入文件

    package main import ( "fmt" "io/ioutil" "os" ) func main() { // 读取文件 / ...

  9. centos 安装docker方法2

    1 更新yum yum -y update 2 执行命令 linux 安装dockersudo wget -qO- https://get.docker.com | sh解释如下sudo 使用root ...

  10. 【Azure Redis 缓存 Azure Cache For Redis】Redis性能问题,发现Server Load非常的高,导致正常连接/操作不成功

    问题描述 在正常使用Azure Redis的服务中,突然发现Redis 的CPU达到了100%, 正常的使用中发现性能问题严重.从Redis的门户图表中,观察到CPU, Connection,Lent ...