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 相关文章推荐
Jquery Ajax学习实例6 向WebService发出请求,返回DataSet(XML) 异步调用
Mar 18 Javascript
js和jquery对dom节点的操作(创建/追加)
Apr 21 Javascript
javascript/jquery获取地址栏url参数的方法
Mar 05 Javascript
JavaScript中的console.group()函数详细介绍
Dec 29 Javascript
简介JavaScript中toTimeString()方法的使用
Jun 12 Javascript
BootStrap智能表单实战系列(六)表单编辑页面的数据绑定
Jun 13 Javascript
基于javascript实现的快速排序
Dec 02 Javascript
AngularJS表格添加序号的方法
Mar 03 Javascript
vue调试工具vue-devtools安装及使用方法
Nov 07 Javascript
原生jQuery实现只显示年份下拉框
Dec 24 jQuery
一篇文章看懂JavaScript中的回调
Jan 05 Javascript
代码块高亮可复制显示js插件highlight.js+clipboard.js整合
Feb 15 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
apache+mysql+php+ssl服务器之完全安装攻略
2006/09/05 PHP
消息持续发送的完整例子
2006/10/09 PHP
关于PHP实现异步操作的研究
2013/02/03 PHP
php+highchats生成动态统计图
2014/05/21 PHP
php+xml实现在线英文词典之添加词条的方法
2015/01/23 PHP
PHP中addslashes与mysql_escape_string的区别分析
2016/04/25 PHP
js禁止document element对象选中文本实现代码
2013/03/21 Javascript
JS通过相同的name进行表格求和代码
2013/08/18 Javascript
jQuery学习笔记之总体架构
2014/06/03 Javascript
JavaScript模块化开发之SeaJS
2015/12/13 Javascript
jQuery解析XML 详解及方法总结
2016/09/28 Javascript
vue中渐进过渡效果实现
2016/10/27 Javascript
AngularJS表单基本操作
2017/01/09 Javascript
推荐10款扩展Web表单的JS插件
2017/12/25 Javascript
原生JS实现列表内容自动向上滚动效果
2019/05/22 Javascript
详解webpack打包vue项目之后生成的dist文件该怎么启动运行
2019/09/06 Javascript
js实现鼠标切换图片(无定时器)
2021/01/27 Javascript
python实现多线程采集的2个代码例子
2014/07/07 Python
python+django加载静态网页模板解析
2017/12/12 Python
详解Python数据分析--Pandas知识点
2019/03/23 Python
在python中实现求输出1-3+5-7+9-......101的和
2020/04/02 Python
使用CSS3滤镜的filter:blur属性制作毛玻璃模糊效果的方法
2016/07/08 HTML / CSS
amazeui页面校验功能的实现代码
2020/08/24 HTML / CSS
美国知名的女性服饰品牌:LOFT(洛芙特)
2016/08/05 全球购物
美国独家设计师眼镜在线光学商店:Glasses Gallery
2017/12/28 全球购物
英国电视和家用电器购物网站:rlrdistribution.co.uk
2018/11/20 全球购物
javascript实现用户必须勾选协议实例讲解
2021/03/24 Javascript
公司中秋节活动方案
2014/02/12 职场文书
《二泉映月》教学反思
2014/04/15 职场文书
英语专业自荐书
2014/06/13 职场文书
女性健康知识讲座通知
2015/04/23 职场文书
2016习总书记系列重要讲话心得体会
2016/01/15 职场文书
《钓鱼的启示》教学反思
2016/02/18 职场文书
深入理解margin塌陷和margin合并的解决方案
2021/06/26 HTML / CSS
图文详解nginx日志切割的实现
2022/01/18 Servers
el-form每行显示两列底部按钮居中效果的实现
2022/08/05 HTML / CSS