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 相关文章推荐
Javascript Math对象
Aug 13 Javascript
jQuery html() in Firefox (uses .innerHTML) ignores DOM changes
Mar 05 Javascript
JS阻止用户多次提交示例代码
Mar 26 Javascript
元素未显示设置width/height时IE中使用currentStyle获取为auto
May 04 Javascript
浅谈JavaScript Array对象
Dec 29 Javascript
javascript正则表达式基础知识入门
Apr 20 Javascript
JavaScript中停止执行setInterval和setTimeout事件的方法
May 14 Javascript
jquery Easyui Datagrid实现批量操作(编辑,删除,添加)
Feb 20 Javascript
JS中SetTimeout和SetInterval使用初探
Mar 23 Javascript
VUE2 前端实现 静态二级省市联动选择select的示例
Feb 09 Javascript
js实现查询商品案例
Jul 22 Javascript
vue-列表下详情的展开与折叠案例
Jul 28 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
浅谈PHP与C#的值类型指向区别的详解
2013/05/21 PHP
PHP异常Parse error: syntax error, unexpected T_VAR错误解决方法
2014/05/06 PHP
PHP中echo,print_r与var_dump区别分析
2014/09/29 PHP
ThinkPHP模板中数组循环实例
2014/10/30 PHP
windows7下php开发环境搭建图文教程
2015/01/06 PHP
简单谈谈favicon
2015/06/10 PHP
微信公众平台开发之天气预报功能
2015/08/31 PHP
php中Ioc(控制反转)和Di(依赖注入)
2017/05/07 PHP
几行代码轻松搞定jquery实现flash8类似的连接效果
2007/05/03 Javascript
js中escape对应的C#解码函数 UrlDecode
2012/12/16 Javascript
原生js获取元素样式的简单方法
2016/08/06 Javascript
JS原生带小白点轮播图实例讲解
2017/07/22 Javascript
Bootstrap table使用方法记录
2017/08/23 Javascript
JS运动特效之链式运动分析
2018/01/24 Javascript
浅谈vue中.vue文件解析流程
2018/04/24 Javascript
js实现二级菜单点击显示当前内容效果
2018/04/28 Javascript
cnpm加速Angular项目创建的方法
2018/09/07 Javascript
vue2过滤器模糊查询方法
2018/09/16 Javascript
微信小程序实现多选删除列表数据功能示例
2019/01/15 Javascript
Vue 理解之白话 getter/setter详解
2019/04/16 Javascript
使用layui的layer组件做弹出层的例子
2019/09/27 Javascript
Vuex模块化应用实践示例
2020/02/03 Javascript
vue.config.js中配置Vue的路径别名的方法
2020/02/11 Javascript
浅谈Python 字符串格式化输出(format/printf)
2016/07/21 Python
python:socket传输大文件示例
2017/01/18 Python
Tensorflow实现酸奶销量预测分析
2019/07/19 Python
Python 解析简单的XML数据
2020/07/24 Python
浅谈Python 钉钉报警必备知识系统讲解
2020/08/17 Python
如何通过python检查文件是否被占用
2020/12/18 Python
2014年计算机专业个人自我评价
2014/01/19 职场文书
服务行业演讲稿
2014/09/02 职场文书
社区环境卫生倡议书
2015/04/29 职场文书
干部外出学习心得体会
2016/01/18 职场文书
奥特曼十大神器:奥特手镯在榜,第一是贝利亚的神器
2022/03/18 日漫
一次线上mongo慢查询问题排查处理记录
2022/03/18 MongoDB
SQL中去除重复数据的几种方法汇总(窗口函数对数据去重)
2023/05/08 MySQL