这篇文章中将给大家分享12个有关于JavaScript的小技巧。这些小技巧可能在你的实际工作中或许能帮助你解决一些问题。
使用!!操作符转换布尔值
有时候我们需要对一个变量查检其是否存在或者检查值是否有一个有效值,如果存在就返回true值。为了做这样的验证,我们可以使用!!操作符来实现是非常的方便与简单。对于变量可以使用!!variable做检测,只要变量的值为:0、null、" "、undefined或者NaN都将返回的是false,反之返回的是true。比如下面的示例:
function Account(cash) { this.cash = cash; this.hasMoney = !!cash;}var account = new Account(100.50);console.log(account.cash); // 100.50console.log(account.hasMoney); // truevar emptyAccount = new Account(0);console.log(emptyAccount.cash); // 0console.log(emptyAccount.hasMoney); // false
在这个示例中,只要account.cash的值大于0,那么account.hasMoney返回的值就是true。
使用+将字符串转换成数字
这个技巧非常有用,其非常简单,可以交字符串数据转换成数字,不过其只适合用于字符串数据,否则将返回NaN,比如下面的示例:
function toNumber(strNumber) { return +strNumber;}console.log(toNumber("1234")); // 1234console.log(toNumber("ACB")); // NaN
这个也适用于Date,在本例中,它将返回的是时间戳数字:
console.log(+new Date()) // 1461288164385
并条件符
如果你有一段这样的代码:
if (conected) { login();}
你也可以将变量简写,并且使用&&和函数连接在一起,比如上面的示例,可以简写成这样:
conected && login();
如果一些属性或函数存在于一个对象中,你也可以这样做检测,如下面的代码所示:
user && user.login();
使用||运算符
在ES6中有默认参数这一特性。为了在老版本的浏览器中模拟这一特性,可以使用||操作符,并且将将默认值当做第二个参数传入。如果第一个参数返回的值为false,那么第二个值将会认为是一个默认值。如下面这个示例:
function User(name, age) { this.name = name || "Oliver Queen"; this.age = age || 27;}var user1 = new User();console.log(user1.name); // Oliver Queenconsole.log(user1.age); // 27var user2 = new User("Barry Allen", 25);console.log(user2.name); // Barry Allenconsole.log(user2.age); // 25
在循环中缓存array.length
这个技巧很简单,这个在处理一个很大的数组循环时,对性能影响将是非常大的。基本上,大家都会写一个这样的同步迭代的数组:
for(var i = 0; i < array.length; i++) { console.log(array[i]);}
新闻热点
疑难解答
图片精选