原文连接: 12 Simple (Yet Powerful) JavaScript Tips

我将会介绍和解析12个简单但是强大的JavaScript技巧. 这些技巧所有的JavaScript程序员都可以马上使用, 你不需要成为JavaScript高手才能理解这些.如果你还是新手, 而且读完所有这些技巧的详解和每种技巧是如果工作的以后运用它们, 你会写出更加简练高效的JavaScript程序.

确实, JavaScript高手已经运用这些技巧写出了很多强大, 高效的JavaScript程序. 但是你可以这样.

强大的 && 和 || 表达式

你可能在JavaScript库和JavaScript框架中已经见过它们了, 那么我们先由几个基本的例子开始:

例子1. || (或)

设置默认值, 通常用

function documentTitle(theTitle) {
if (!theTitle) {
theTitle = "Untitled Document";
}
}

用这代替:

function documentTitle(theTitle) {
theTitle = theTitle || "Untitled Document";
}

解析:

  • 首先, 阅读以下的"提示"框复习JavaScript是如何判断布尔值的
  • || 操作符首先从左开始判断表达式的真假, 如果为真, 马上返回左边表达式返回的值; 如果左边表达式被判断为假, 则继续判断右边的表达式, 并返回右边表达式的值
  • 如果theTitle被判断为假, 会返回右边表达式的值. 换句话说, 如果theTitle变量被判断为真, 则返回theTitle的值.
! 提示:
JavaScript判断为假的值: null, false, 0, undefined, NaN 和 ""(空字符串).
记住像Infinity(无限大)这种 NaN 类的值是被判断为真不是假. 然而, NaN被判断为假.
除了以上这些, 其他值全部被判断为真.

例子2. &&(并)

不要这么做:

function isAdult(age) {
if (age && age > 17) {
return true;
} else {
return false;
}
}

用这代替:

function isAdult(age) {
return age && age > 17;
}

解析:

  • && 操作符从左开始判断表达式, 如果左边的表达式被判断为假, 这马上返回false, 不管右边的表达式是否为真.
  • 如果左边的表达式为真, 则继续判断右边的表达式, 然后返回右边表达式结果

这变得越来越有趣了

例子3.

不要这样做:

if (userName) {
logIn(userName);
} else {
signUp();
}

用这代替:

userName && logIn(userName) || signUp();

解析:

  • 如果userName为真, 调用logIn函数并传递userName变量
  • 如果userName为假, 调用signUp函数不传递任何变量

例子4.

不要这样做:

var userID;

if (userName && userName.loggedIn) {
userID = userName.id;
} else {
userID = null;
}

用这代替:

var userID = userName && userName.loggedIn && userName.id;

解析:

  • 如果userName为真, 则调用user.loggedIn, 并检查user.loggedIn是否为真; 如果返回真, 则返回第三个表达式的返回值
  • 如果userName为空, 返回null

(译文)12个简单(但强大)的JavaScript技巧(一)的更多相关文章

  1. (译文)12个简单(但强大)的JavaScript技巧(二)

    原文链接: 12 Simple (Yet Powerful) JavaScript Tips 其他链接: (译文)12个简单(但强大)的JavaScript技巧(一) 强大的立即调用函数表达式 (什么 ...

  2. 让AI简单且强大:深度学习引擎OneFlow技术实践

    本文内容节选自由msup主办的第七届TOP100summit,北京一流科技有限公司首席科学家袁进辉(老师木)分享的<让AI简单且强大:深度学习引擎OneFlow背后的技术实践>实录. 北京 ...

  3. 12个非常有用的JavaScript技巧

    在这篇文章中,我将分享12个非常有用的JavaScript技巧.这些技巧可以帮助你减少并优化代码. 1) 使用!!将变量转换成布尔类型 有时,我们需要检查一些变量是否存在,或者它是否具有有效值,从而将 ...

  4. TYAttributedLabel——简单,强大的iOS属性文本控件

    本文转载至 http://www.mobile-open.com/2015/86578.html TYAttributedLabel 简单,强大的属性文本的控件(无需了解CoreText),支持图文混 ...

  5. Spring 简单而强大的事务管理功能

    开始之前 关于本教程 本教程将深入讲解 Spring 简单而强大的事务管理功能,包括编程式事务和声明式事务.通过对本教程的学习,您将能够理解 Spring 事务管理的本质,并灵活运用之. 先决条件 本 ...

  6. 12款简化 Web 开发的 JavaScript 开发框架

    前端框架简化了开发过程中,像 Bootstrap 和 Foundation 就是前端框架的佼佼者.在这篇文章了,我们编制了一组新鲜的,实用的,可以帮助您建立高质量的 Web 应用程序的 JavaScr ...

  7. Echo.js – 简单易用的 JavaScript 图片延迟加载插件

    Echo.js 是一个独立的延迟加载图片的 JavaScript 插件.Echo.js 不依赖第三方库,压缩后不到1KB大小. 延迟加载是提高网页首屏显示速度的一种很有效的方法,当图片元素进入窗口可视 ...

  8. 一套简单可依赖的Javascript库

    还是[百度]的产品——Tangram不是我偏心,百度不是我亲戚这东西看上去确实不错 Tangram是一套简单可依赖的Javascript库,主要分为Base和Component两部分.Base提供了开 ...

  9. 简单而强大的bitset

    简单而强大的bitset 介绍 有些程序需要处理二进制有序集,标准库提供了bitset 类型,事实上,bitset 是一个二进制容器,容器中每一个元素都是一位二进制码,或为 0,或为 1. 基础 bi ...

随机推荐

  1. 2.3CUDA矩阵乘法

    CPU 矩阵乘法 能相乘的两个矩阵,必须满足一个矩阵的行数和第二个矩阵的列数相同. A(N*P) * B(P*M) = C(N*M). 其中P是行数,N是列数, 从宽高的角度来说,即 A的宽度和B的高 ...

  2. android sdk api结构解析

    一.系统级:android.accounts android.app     1.OS 相关         android.os         android.os.storage         ...

  3. WEB开发总结(持续更新。。。)

    近期开始搞搞web的东西,觉得有必要把遇到的问题总结一下,就在这里当做个笔记本吧. 1.用maven建立的web工程,在运行的时候,右键找不到“Run on server”菜单: 可以在命令提示行中, ...

  4. HDU4862-Jump(最大流量最大费用流)

    题意:有n*m的格子,每一个格子包含一个数字,0-9.你初始的能量为0,你可以玩k次,每一个你可以选择你现在的格子的正下方或者正右方的任意一个格子跳,但必须是之前没有跳过的格子.每玩一次你都可以跳任意 ...

  5. keil中的存储模式

    存储模式 存储模式决定了默认的存储器类型此存储器类型将应用于函数参数局部变量和定义时未包含存储器类型的变量你可以在命令行用SMALL COMPACT和LARGE参数定义存储模式,定义变量时使用存储器类 ...

  6. nyoj 16 矩形嵌套

    矩形嵌套 时间限制:3000 ms  |  内存限制:65535 KB 难度:4   描述 有n个矩形,每个矩形可以用a,b来描述,表示长和宽.矩形X(a,b)可以嵌套在矩形Y(c,d)中当且仅当a& ...

  7. 让UILabel具有链接功能,点击后调用safari打开网址

    UILabel *labelGovUrl = [[UILabel alloc] initWithFrame:CGRectMake(73.0, 330.0, 180.0, 40.0)]; labelGo ...

  8. SQL Server里一些未公开的扩展存储过程

    SQL Server里一些未公开的扩展存储过程 [转帖] 博客天地 www.inbaidu.com SQL Server里一些未公开的扩展存储过程 扩展存储过程(xp)是直接运行在SQL Server ...

  9. javascript---遇到关于this的相关问题(解决this)(持续更新中...)

    1.在原型中使用this <!doctype html> <html lang="en"> <head> <meta charset=&q ...

  10. careercup-中等难度 17.11

    17.11 给定rand5(),实现一个方法rand7().也即,给定一个产生0到4(含)随机数的方法,编写一个产生0到6(含)随机数的方法. 解法: 这个函数要正确实现,则返回0到6之间的值,每个值 ...