HTML5技术

[javascript 实践篇]——那些你不知道的“奇淫巧技” - FannieGirl

字号+ 作者:H5之家 来源:H5之家 2017-07-11 09:02 我要评论( )

1. 空(null, undefined)验证 刚开始,我是比较蠢的验证(我还真是这样子验证的) if (variable1 !== null || variable1 !== undefined || variable1 !== '') { let variable2 = variable1; } 大哥教会了我这样子验证,你会惊叹一下的 let variable2 = variabl

1. 空(null, undefined)验证

刚开始,我是比较蠢的验证(我还真是这样子验证的)

if (variable1 !== null || variable1 !== undefined || variable1 !== '') { let variable2 = variable1; }

大哥教会了我这样子验证,你会惊叹一下的

let variable2 = variable1 || '';

如果你不信,在谷歌浏览器开发者面板的控制台下试试!

//值为null的例子 let variable1 = null; let variable2 = variable1 || ''; console.log(variable2); //输出: '' //值为undefined的例子 let variable1 = undefined; let variable2 = variable1 || ''; console.log(variable2); //输出: '' //正常情况 let variable1 = 'hi there'; let variable2 = variable1 || ''; console.log(variable2); //输出: 'hi there'

是不是很棒(可爱脸)

2. 数组

这个经常用到,像我这样子没毛病

let a = ["myString1", "myString2", "myString3"];

3. if true .. else 的优化

其实就是用三元运算

let big; if (x > 10) { big = true; } else { big = false; }

可以变成这样子的啦

let big = x > 10 ? true : false;

是不是简洁了呢,三元运算可以在很多的地方用到,(vue 里面 判断组件的加载,,,是不是跑题了 )

再来一个例子

let big = (x > 10); let x = 3, big = (x > 10) ? "greater 10" : (x < 5) ? "less 5" : "between 5 and 10"; console.log(big); //"less 5" let x = 20, 10, false : x< =10}; console.log(big); //"Object {true

4. 变量声明

变量声明,这样子的 let x; let y;......

不妨这样像我这样子,简单又明了

let x, y, z=3;

5. 赋值语句的简化

刚开始是这样子的

x=x+1; minusCount = minusCount - 1; y=y*10;

摇身一变成

x++; minusCount --; y*=10;

6. 避免使用RegExp对象

正则表达式,是不是要用到

var re = new RegExp("\d+(.)+\d+","igm"), result = re.exec("padding 01234 text text 56789 padding"); console.log(result); //"01234 text text 56789"

简化一下

var result = /d+(.)+d+/igm.exec("padding 01234 text text 56789 padding"); console.log(result); //"01234 text text 56789"

7. If 条件优化

虽然很简单,但还是值得提一下。

if (likeJavaScript)

比起这样字的会不会好一点呢

if (likeJavaScript === true)

 

8.函数调用还可以更短

function x() {console.log('x')};function y() {console.log('y')}; let z = 3; if (z == 3) { x(); } else { y(); }

其实就是函数自调拉

function x() {console.log('x')};function y() {console.log('y')};let z = 3; (z==3?x:y)();

9. 如何优雅的表示大数字

在JavaScript中,有一个简写数字的方法,也许你忽略了。1e7表示10000000。

简化前:

for (let i = 0; i

le7...............................................................................................(调皮啊)

for (let i = 0; i

 

你说四不四奇淫巧技嘛?

尊重我们的原文作者咔

版权声明: 转载时请注明作者Fundebug以及本文地址: https://blog.fundebug.com/2017/07/06/12-tricks-that-js-rocks/

 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • AugularJS从入门到实践(一) - 渡劫的机器猫

    AugularJS从入门到实践(一) - 渡劫的机器猫

    2017-07-10 10:00

  • .NET ORM框架 SqlSuagr4.0 功能详解与实践【开源】 - 孙凯旋

    .NET ORM框架 SqlSuagr4.0 功能详解与实践【开源】 - 孙凯旋

    2017-06-19 17:00

  • css3+javascript旋转的3d盒子 - 当年华褪去生涩

    css3+javascript旋转的3d盒子 - 当年华褪去生涩

    2017-06-15 14:02

  • python编写知乎爬虫实践 - cpselvis

    python编写知乎爬虫实践 - cpselvis

    2017-06-14 15:00

网友点评
y