分享ES6的7个实用技巧

Hack #1 交换元素

利用 数组解构来实现值的互换

let a = 'world', b = 'hello'
[a, b] = [b, a]
console.log(a) // -> hello
console.log(b) // -> world

Hack #2 调试

我们经常使用 console.log()来进行调试，试试 console.table()也无妨。

const a = 5, b = 6, c = 7
console.log({ a, b, c });
console.table({a, b, c, m: {name: 'xixi', age: 27}});

Hack #3 单条语句

ES6时代，操作数组的语句将会更加的紧凑

// 寻找数组中的最大值
const max = (arr) => Math.max(...arr);
max([123, 321, 32]) // outputs: 321
// 计算数组的总和
const sum = (arr) => arr.reduce((a, b) => (a + b), 0)
sum([1, 2, 3, 4]) // output: 10

Hack #4 数组拼接

展开运算符可以取代 concat的地位了

const one = ['a', 'b', 'c']
const two = ['d', 'e', 'f']
const three = ['g', 'h', 'i']
const result = [...one, ...two, ...three]

Hack #5 制作副本

我们可以很容易的实现数组和对象的 浅拷贝

const obj = { ...oldObj }
const arr = [ ...oldArr ]

Hack #6 命名参数👍👍👍

解构使得函数声明和函数的调用更加可读

// 我们尝尝使用的写法
const getStuffNotBad = (id, force, verbose) => {
 ...do stuff
}
// 当我们调用函数时， 明天再看，尼玛 150是啥，true是啥
getStuffNotBad(150, true, true)
// 看完本文你啥都可以忘记, 希望够记住下面的就可以了
const getStuffAwesome = ({id, name, force, verbose}) => {
 ...do stuff
}
// 完美
getStuffAwesome({ id: 150, force: true, verbose: true })

Hack #7 Async/Await结合数组解构

数组解构非常赞!结合 Promise.all和 解构和 await会使代码变得更加的简洁

const [user, account] = await Promise.all([
 fetch('/user'),
 fetch('/account')
])

总结

以上所述是小编给大家介绍的分享ES6的7个实用技巧，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

您可能感兴趣的文章:

  • ES6/JavaScript使用技巧分享
赞 (0)

相关推荐

  • ES6/JavaScript使用技巧分享

    在编写JavaScript代码的时候存在的一些方法和技巧,虽然有时候条条大路都通向罗马,但是也许总会有那么一条最短的路径可走.本文将一些都知道却不怎么用的小技巧分享给大家 一些小技巧 1.new Set() 数组的去重,在'潜意识'里面感觉就应该去循环然后对比去重,其实在ES6中新增提供了新的数据结构Set,用他可以轻松去重数组,比如: let arr = [1,1, 2, 2, 3, 3]; let set = new Set(arr); // let newArr = Array.from(

  • 分享ES6的7个实用技巧

    Hack #1 交换元素 利用 数组解构来实现值的互换 let a = 'world', b = 'hello' [a, b] = [b, a] console.log(a) // -> hello console.log(b) // -> world Hack #2 调试 我们经常使用 console.log()来进行调试,试试 console.table()也无妨. const a = 5, b = 6, c = 7 console.log({ a, b, c }); console.ta

  • 分享ES6 20个经常使用技巧

    分享ES6 20个经常使用技巧

    目录 前言: 1.打乱数组顺序 2.删除数字之外的所有字符 3.反转字符串或者单词 4.将十进制转换为二进制文件或十六进制数 5.合并多个对象 6.=== 和 == 的区别 7.解构赋值 8.交换变量的值 9.字符串 9.1判断回文字符串 9.2判断两个字符串是否为互相排列 10.可选链操作符 11.三目运算符 12.从数组中随机选择一个值 13.冻结对象 14.删除数组重复的元素 15.保留指定位小数 16.清空数组 17.从 RGB 转换为 HEX 18.从数组中获取最大值和最小值 19.空

  • 分享介绍Python的9个实用技巧

    分享介绍Python的9个实用技巧

    本文会介绍一些Python大神用的贼溜的技巧,让一探究竟吧!欢迎收藏学习,喜欢点赞支持,欢迎畅聊. 整理字符串输入 整理用户输入的问题在编程过程中很常见.有更好的方法来解决: user_input = "This string has some whitespaces... " character_map = { ord( ) : , ord( ) : , ord( ) : None } user_input.translate(character_map) # This string

  • 分享15 超级好用得 Python 实用技巧

    目录 01 all or any 02 dir 03 列表(list)推导式 04 pprint 05 repr 06 sh 07 Type hints 08 uuid 09 wikipedia 10 xkcd 11 zip 12 emoji 13 howdoi 14 Jedi 15 **kwargs 01 all or any Python 语言如此流行的众多原因之一,是因为它具有很好的可读性和表现力. 人们经常开玩笑说 Python 是可执行的伪代码.当你可以像这样写代码时,就很难反驳. x

  • Python数据处理的三个实用技巧分享

    Python数据处理的三个实用技巧分享

    目录 1 Pandas 移除某列 2 统计标题单词数 3 Genre 频次统计 我使用的 Pandas 版本如下,顺便也导入 Pandas 库. >>> import pandas as pd >>> pd.__version__ '0.25.1' 在开始前先确保解释器和数据集在同一目录下: >>> import os >>> os.chdir('D://source/dataset') # 这是我的数据集所在目录 >>&

  • 关于Python中进度条的六个实用技巧分享

    关于Python中进度条的六个实用技巧分享

    目录 1 简介 2 tqdm中实用的6个特性 2.1 autonotebook自动切换进度条风格 2.2 延迟渲染进度条 2.3 自定义进度条色彩 2.4 自主控制的进度上限 2.5 针对enumerate.zip和map的替代 2.6 设置进度条“用完即逝” 总结 1 简介 费老师我在几年前写过的一篇文章(https://www.jb51.net/article/243348.htm)中,介绍过tqdm这个在当下Python圈子中已然非常流行的进度条库,可以帮助我们为任何具有循环迭代过程的代码

  • Python中隐藏的五种实用技巧分享

    目录 1. ... 对象 2.解压迭代对象 3.展开的艺术 4.下划线 _ 变量 5.多种用途的else 循环 异常处理 1. ... 对象 没错,你没看错,就是 "..." 在Python中 ... 代表着一个名为 Ellipsis 的对象.根据官方说明,它是一个特殊值,通常可以作为空函数的占位符,或是用于Numpy中的切片操作. 如: def my_awesome_function():     ... 等同于: def my_awesome_function():     Ell

  • 10个Elasticsearch查询的实用技巧分享

    目录 前言 示例 1. 匹配多个词语 2. 匹配某个字段中的任意一个词 3. 匹配某个字段中的词语前缀 4. 匹配某个字段中的词语通配符 5. 匹配某个字段中的词语模糊匹配 6. 匹配某个字段中的词语范围 7. 匹配某个字段中的词语存在与否 8. 按照某个字段排序 9. 返回某些字段的部分数据 10. 进行分页操作 前言 Elasticsearch是一个非常流行的搜索引擎,已经成为了许多企业的首选解决方案.然而,我们要想成为一个优秀的程序员,就必须掌握各种查询技巧.本文将向大家介绍10个实用的E

  • JavaScript字符串操作的四个实用技巧

    目录 前言 1. 拆分字符串 2. JSON格式化和解析 3. 多行字符串和嵌入式表达式 4. 验证字符串数组中是否存在子字符串 总结 前言 字符串是编程世界最基本最重要的数据类型之一,JavaScript 也不例外.JavaScript 字符串是不可变的,对于存储可以由字符.数字和 Unicode 组成的文本很便捷.JavaScript 提供了许多内置函数,允许以不同的方式创建和操作字符串.在本文将分享一些优雅的操作 JavaScript 字符串的技巧. 1. 拆分字符串 JavaScript

  • 提高JavaScript执行效率的23个实用技巧

    本文向大家分享23种JavaScript提高执行效率的小技巧.最佳实践等非常实用的内容.当然JavaScript的实用技巧不止这些,还有很多即好玩又能提高程序运行效率的技巧,以后我们会继续分享给大家. 文中所提供的代码片段都已经过最新版的Chrome 30测试,该浏览器使用V8 JavaScript引擎(V8 3.20.17.15). 1.使用逻辑符号&&或者||进行条件判断 var foo = 10; foo == 10 && doSomething(); // 如果 f

随机推荐