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 数组排序函数
Aug 20 Javascript
document.all的一个比较完整的总结及案例
Jan 31 Javascript
jQuery随便控制任意div隐藏的方法
Jun 28 Javascript
几种延迟加载JS代码的方法加快网页的访问速度
Oct 12 Javascript
javascript对中文按照拼音排序代码
Aug 20 Javascript
JavaScript中的继承方式详解
Feb 11 Javascript
jQuery实现选项联动轮播效果【附实例】
Apr 19 Javascript
JavaScript实现通过select标签跳转网页的方法
Sep 29 Javascript
从零开始学习Node.js系列教程一:http get和post用法分析
Apr 13 Javascript
Vue2.0生命周期的理解
Aug 20 Javascript
JS中使用new Option()实现时间联动效果
Dec 10 Javascript
Electron 打包问题:electron-builder 下载各种依赖出错(推荐)
Jul 09 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中变量及部分适用方法
2008/03/27 PHP
PHP编程函数安全篇
2013/01/08 PHP
PHP面向对象之后期静态绑定功能介绍
2015/05/18 PHP
[原创]PHP实现SQL语句格式化功能的方法
2017/07/28 PHP
JavaScript Undefined,Null类型和NaN值区别
2008/10/22 Javascript
js 数组操作代码集锦
2009/04/28 Javascript
鼠标焦点离开文本框时验证的js代码
2013/07/19 Javascript
jquery 删除字符串最后一个字符的方法解析
2014/02/11 Javascript
纯Javascript实现ping功能的方法
2015/03/20 Javascript
使用AngularJS 应用访问 Android 手机的图片库
2015/03/24 Javascript
javascript每日必学之基础入门
2016/02/16 Javascript
jquery动态切换背景图片的简单实现方法
2016/05/14 Javascript
BootStrap glyphicon图标无法显示的解决方法
2016/09/06 Javascript
VueJS 集成 Medium Editor的示例代码 (自定义编辑器按钮)
2017/08/24 Javascript
详解Vue如何支持JSX语法
2017/11/10 Javascript
vue.js+element-ui动态配置菜单的实例
2018/09/07 Javascript
node.js爬取中关村的在线电瓶车信息
2018/11/13 Javascript
解决layer弹出层自适应页面大小的问题
2019/09/16 Javascript
Python爬虫之正则表达式基本用法实例分析
2018/08/08 Python
python实现指定字符串补全空格、前面填充0的方法
2018/11/16 Python
PyCharm第一次安装及使用教程
2020/01/08 Python
浅谈OpenCV中的新函数connectedComponentsWithStats用法
2020/07/05 Python
Python实现淘宝秒杀功能的示例代码
2021/01/19 Python
利用CSS3的transition属性实现滑动效果
2015/08/05 HTML / CSS
意大利奢侈品网站:Italist
2016/08/23 全球购物
欧洲最大的预定车位市场:JustPark
2020/01/06 全球购物
机械工程师求职自我评价
2013/09/23 职场文书
高三英语教学反思
2014/01/13 职场文书
研修第一天随笔感言
2014/02/15 职场文书
国贸专业的职业规划书
2014/03/15 职场文书
车队司机个人自我鉴定
2014/04/17 职场文书
合唱兴趣小组活动总结
2014/07/10 职场文书
高校群众路线教育实践活动剖析材料
2014/10/10 职场文书
关于React Native使用axios进行网络请求的方法
2021/08/02 Javascript
Mysql 数据库中的 redo log 和 binlog 写入策略
2022/04/26 MySQL
MySQL sql模式设置引起的问题
2022/05/15 MySQL