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


Posted in Javascript onJune 28, 2017

前言

本文主要给大家整理了一份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语句。

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

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

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:

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

六、短路评价

给一个变量分配的值是通过判断其值是否为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++) {}

简写:

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

八、对象属性简写

如果属性名与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关键字)为返回多行语句(例如对象字面表达式),则需要使用()包围函数体。

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

简写:

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

总结

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

Javascript 相关文章推荐
[JS]点出统计器
Oct 11 Javascript
js中eval详解
Mar 30 Javascript
JQuery验证工具类搜集整理
Jan 16 Javascript
js的压缩及jquery压缩探讨(提高页面加载性能/保护劳动成果)
Jan 29 Javascript
JavaScript的setAttribute兼容性问题解决方法
Nov 11 Javascript
多个jquery.datatable共存,checkbox全选异常的快速解决方法
Dec 10 Javascript
原生JavaScript生成GUID的实现示例
Sep 05 Javascript
JS实现左右无缝轮播图代码
May 01 Javascript
JavaScript代码性能优化总结篇
May 15 Javascript
javascript实现图片左右滚动效果【可自动滚动,有左右按钮】
Sep 19 Javascript
vue cli webpack中使用sass的方法
Feb 24 Javascript
layerui代码控制tab选项卡,添加,关闭的实例
Sep 04 Javascript
AngularJS页面带参跳转及参数解析操作示例
Jun 28 #Javascript
AngularJS基于provider实现全局变量的读取和赋值方法
Jun 28 #Javascript
JavaScript循环_动力节点Java学院整理
Jun 28 #Javascript
JavaScript方法_动力节点Java学院整理
Jun 28 #Javascript
微信小程序后台解密用户数据实例详解
Jun 28 #Javascript
JavaScript箭头函数_动力节点Java学院整理
Jun 28 #Javascript
JavaScript之filter_动力节点Java学院整理
Jun 28 #Javascript
You might like
骨王战斗力在公会成员中排不进前五,却当选了会长,原因竟是这样
2020/03/02 日漫
WordPress中编写自定义存储字段的相关PHP函数解析
2015/12/25 PHP
WordPress开发中的get_post_custom()函数使用解析
2016/01/04 PHP
PHP机器学习库php-ml的简单测试和使用方法
2017/07/14 PHP
Javascript的并行运算实现代码
2010/11/19 Javascript
jquery异步请求实例代码
2011/06/21 Javascript
Jquery.addClass始终无效原因分析
2013/09/08 Javascript
获取3个数组不重复的值的具体实现
2013/12/30 Javascript
js在IE与firefox的差异集锦
2014/11/11 Javascript
《JavaScript DOM 编程艺术》读书笔记之JavaScript 简史
2015/01/09 Javascript
js设置document.domain实现跨域的注意点分析
2015/05/21 Javascript
JS获取子窗口中返回的数据实现方法
2016/05/28 Javascript
jQuery自适应轮播图插件Swiper用法示例
2016/08/24 Javascript
利用Node.js编写跨平台的spawn语句详解
2017/02/12 Javascript
Angular4绑定html内容出现警告的处理方法
2017/11/03 Javascript
Vue.js自定义事件的表单输入组件方法
2018/03/08 Javascript
Vue使用NPM方式搭建项目
2018/10/25 Javascript
node.js ws模块搭建websocket服务端的方法示例
2019/04/25 Javascript
详解JavaScript中new操作符的解析和实现
2020/09/04 Javascript
深入理解python try异常处理机制
2016/06/01 Python
django批量导入xml数据
2016/10/16 Python
python解决网站的反爬虫策略总结
2016/10/26 Python
python模块之time模块(实例讲解)
2017/09/13 Python
python隐藏类中属性的3种实现方法
2019/12/19 Python
Python Numpy库常见用法入门教程
2020/01/16 Python
tensorflow指定CPU与GPU运算的方法实现
2020/04/21 Python
matplotlib基础绘图命令之errorbar的使用
2020/08/13 Python
Pycharm同步远程服务器调试的方法步骤
2020/11/04 Python
Python抖音快手代码舞(字符舞)的实现方法
2021/02/07 Python
CSS3弹性伸缩布局之box布局
2016/07/12 HTML / CSS
详解HTML5表单新增属性
2016/12/21 HTML / CSS
Anthropologie英国:美国家喻户晓的休闲服装和家居产品品牌
2018/12/05 全球购物
亿企通软件测试面试题
2012/04/10 面试题
大二学习计划书范文
2014/04/27 职场文书
职场新人知识:如何制定一份合理的工作计划?
2019/09/11 职场文书
vue中的可拖拽宽度div的实现示例
2022/04/08 Vue.js