JavaScript中最常用的10种代码简写技巧总结

 更新时间:2017年06月28日 10:39:54   投稿:daisy  
这篇文章主要总结了JavaScript中最常用的10种代码简写技巧的相关资料,其中包括三元操作符、短路求值简写方式、声明变量简写方法、if存在条件简写方法及JavaScript循环简写方法等等,分别给出了详细的示例代码供大家参考,需要的朋友们下面来一起看看吧。

前言

本文主要给大家整理了一份10个程序员常用的代码简写技术,看懂一种是入门,全懂就是大神,你能知道几个呢?下面话不多说了,来看看详细的介绍:

一、三元操作符

当想写if…else语句时,使用三元操作符来代替。

const x = 20;let answer;if (x > 10) {

简写:

const answer = x > 10 ? 'is greater' : 'is lesser';

也可以嵌套if语句:

const big = x > 10 ? " greater 10" : x

二、短路求值简写方式

当给一个变量分配另一个值时,想确定源始值不是null,undefined或空值。可以写撰写一个多重条件的if语句。

或者可以使用短路求值方法:

const variable2 = variable1 || 'new';

三、声明变量简写方法

let x;let y;let z = 3;

简写方法:

let x, y, z=3;

四、if存在条件简写方法

if (likeJavaScript === true)

简写:

if (likeJavaScript)

只有likeJavaScript是真值时,二者语句才相等

如果判断值不是真值,则可以这样:

let a;if ( a !== true ) {// do something...}

简写:

let a;if ( !a ) {// do something...}

五、JavaScript循环简写方法

for (let i = 0; i < allImgs.length; i++)

简写:

for (let index in allImgs)

也可以使用Array.forEach:

六、短路评价

给一个变量分配的值是通过判断其值是否为null或undefined,则可以:

let dbHost;if (process.env.DB_HOST) {

简写:

const dbHost = process.env.DB_HOST || 'localhost';

七、十进制指数

当需要写数字带有很多零时(如10000000),可以采用指数(1e7)来代替这个数字:

for (let i = 0; i < 10000; i++) {}

简写:

八、对象属性简写

如果属性名与key名相同,则可以采用ES6的方法:

const obj = { x:x, y:y };

简写:

const obj = { x, y };

九、箭头函数简写

传统函数编写方法很容易让人理解和编写,但是当嵌套在另一个函数中,则这些优势就荡然无存。

function sayHello(name) { console.log('Hello', name);

简写:

sayHello = name => console.log('Hello', name);

十、隐式返回值简写

经常使用return语句来返回函数最终结果,一个单独语句的箭头函数能隐式返回其值(函数必须省略

{}为了省略return关键字)为返回多行语句(例如对象字面表达式),则需要使用()包围函数体。

简写:

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对脚本之家的支持。

相关文章

  • Firefox下无法正常显示年份的解决方法

    Firefox下无法正常显示年份的解决方法

    在用Firefox上一些网站会看到这样的显示108年1月26日,而IE显示为2008年1月26日原因是javascrīpt的兼容性问题
    2014-09-09
  • JavaScript利用正则表达式替换字符串中的内容

    JavaScript利用正则表达式替换字符串中的内容

    本文主要介绍了JavaScript利用正则表达式替换字符串中内容的具体实现方法,并做了简要注释,便于理解。具有一定的参考价值,需要的朋友可以看下
    2016-12-12
  • bootstrap table动态加载数据示例代码

    bootstrap table动态加载数据示例代码

    本篇文章主要介绍了bootstrap table动态加载数据示例代码,可以实现点击选择按钮,弹出模态框,加载出关键词列表,有兴趣的可以了解一下。
    2017-03-03
  • JavaScript链式调用原理与实现方法详解

    JavaScript链式调用原理与实现方法详解

    这篇文章主要介绍了JavaScript链式调用,结合实例形式详细分析了JavaScript链式调用基本原理、实现方法与相关操作注意事项,需要的朋友可以参考下
    2020-05-05
  • JavaScript 闭包的使用场景

    JavaScript 闭包的使用场景

    这篇文章主要介绍了JavaScript 闭包的使用场景,帮助大家更好的理解和使用JavaScript,感兴趣的朋友可以了解下
    2020-09-09
  • js添加绑定事件的方法

    js添加绑定事件的方法

    这篇文章主要为大家详细介绍了js添加事件的通用方法,还为大家介绍了js绑定事件的常用方式,感兴趣的小伙伴们可以参考一下
    2016-05-05
  • js神秘的电报密码 哈弗曼编码实现

    js神秘的电报密码 哈弗曼编码实现

    这篇文章主要介绍了js神秘的电报密码 哈弗曼编码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-09-09
  • JavaScript进阶(二)词法作用域与作用域链实例分析

    JavaScript进阶(二)词法作用域与作用域链实例分析

    这篇文章主要介绍了JavaScript词法作用域与作用域链,结合实例形式分析了JavaScript词法作用域与作用域链相关概念、原理与操作注意事项,需要的朋友可以参考下
    2020-05-05
  • 微信小程序去除左上角返回键的实现方法

    微信小程序去除左上角返回键的实现方法

    这篇文章主要介绍了微信小程序去除左上角返回键的实现方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-03-03
  • javascript实现数字配对游戏的实例讲解

    javascript实现数字配对游戏的实例讲解

    下面小编就为大家分享一篇javascript实现数字配对游戏的实例讲解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2017-12-12

最新评论