简介找我请到 掘金 或者 Github自己也维护不过来那么多站点,对不住大家了。???? 更新平台多偶尔会漏掉,如果觉得文章还行点个 star 防走失。???? 一天 30 秒 ⏱ 一段代码 ✍️ 一个场景 ???? ????昨天一个同学在 URL 大爆炸 问了我一个问题:这是什么写法 (data[key] = value, data) 。平时在写文章的时候会把这些技巧稍微提示一下,认为大家都知道这些技巧,引起了小二的自我反省。希望大家可以一起成长,都不掉队。可能很多人都了解这些方法了,如果懂的同学就温故知新,不懂的同学咱们迎头追上。由于是个人常用技巧可能并不是最好的,如果有知道的同学也可以提出来一起成长。短路运算只有当第一个运算数的值无法确定逻辑运算的结果时,会按照顺序对剩下运算数进行求值。一起回忆初中常背的一句口诀:一真即真,一假即假。一真即真一真即真 指的是 || 或运算符,当一个值为真并停止对后面的判断。默认值function test(name) { name = name || ‘Bar’ ; console.log(name)}// 输出 Barconsole.log(test());当然也可以用 ES6 的 spread 语法来完成默认值,关于更多函数参数技巧可以查看 函数骚操作。不支持 ES6 时等需要默认值操作时,||一个值得使用的小技巧。简化条件语句在开发是时候,偶尔会遇到只有一行代码的条件语句:if(!name) { initName()}不知道同学会不会和我一样会觉得这样写不好看,这里可以利用 || 来简化代码:name || initName()一假即假一假即假 指的是 && 或运算符,当一个值为假时则会停止判断,为真时则会一直判断下去。默认值在取一些对象属性的时候,对象属性有可能为 null 或者 undefind 则会出现错误:const data = { name: ‘xiaoer’, age: 18, company: null}// 抛出错误: Uncaught TypeError: Cannot read property ’name’ of nullconsole.log(data.company.name)在这里 && 搭配 || 使用可以写出更实用的默认值操作:const data = { name: ‘xiaoer’, age: 18, company: null}const name = data.company && data.company.name || ’no name’;简化条件语句在开发是时候,偶尔会遇到只有一行代码的条件语句:// 假设后端返回的用户数据为 dataconst data = { name: ‘xiaoer’, age: 18, company: null}if (data.company && data.company.name) { initCompany();}&& 和 || 一样也可以用来简化条件语句:data.company && data.company.name && initCompany();逗号运算符for 循环在使用 for 循环的时候,可能不止需要迭代一个参数,可以利用逗号表达式:脚本let i = 0, j = 0, times = 5;for (let i = 0, j = 0; i < times; i++, j++, j++){ console.log(i, j);}输出i:0, j:0i:1, j:2i:2, j:4i:3, j:6i:4, j:8语句赋值有时候会需要一次声明多个变量:const a = 0, b = 1, c = 2;// 输出 a, b, cconsole.log(a, b, c);// 下面操作都会报错// 证明确实都是 const 常量a = 2;b = 1;c = 1;简化语句在写一些简短的函数时常常写成下面这样:const ins = (x) => { x++; return x;}[{count: 1}].map((x) => { x.count++; return x;})如果需要进行的操作很多倒是需要写得详细方便他人阅读,而且开发并不是一个人。如果是这种一点点操作的时候,可以利用逗号运算符来简化:const ins = (x) => (x++, x)[{count: 1}].map((x) => (x.count++, x));一起成长如果您感觉有收获可以点赞关注激励我,也欢迎到 Github 加个 star。本文原稿来自 PushMeTop