javascript中关于&& 和 || 表达式的小技巧分享


Posted in Javascript onApril 10, 2015

如果你还是新手, 而且读完所有这些技巧的详解和每种技巧是如果工作的以后运用它们, 你会写出更加简练高效的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为假, 调用logIn函数不传递任何变量

例子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

以上所述就是本文给大家分享的第一个javascript小技巧了,希望大家能够喜欢。

Javascript 相关文章推荐
JavaScript 学习笔记(六)
Dec 31 Javascript
jquery与google map api结合使用 控件,监听器
Mar 04 Javascript
jQuery设置聚焦并使光标位置在文字最后的实现方法
Aug 02 Javascript
vuejs开发组件分享之H5图片上传、压缩及拍照旋转的问题处理
Mar 06 Javascript
JS去掉字符串前后空格、阻止表单提交的实现代码
Jun 08 Javascript
jQuery中 DOM节点操作方法大全
Oct 12 jQuery
bootstrap treeview 扩展addNode方法动态添加子节点的方法
Nov 21 Javascript
vue实现2048小游戏功能思路详解
May 09 Javascript
vue-router重定向和路由别名的使用讲解
Jan 19 Javascript
jQuery模拟html下拉多选框的原生实现方法示例
May 30 jQuery
工作中常用js功能汇总
Nov 07 Javascript
React如何使用axios请求数据并把数据渲染到组件
Aug 05 Javascript
js简单的点击返回顶部效果实现方法
Apr 10 #Javascript
浅谈JavaScript正则表达式分组匹配
Apr 10 #Javascript
JavaScript实现基于Cookie的存储类实例
Apr 10 #Javascript
JavaScript 变量、作用域及内存
Apr 08 #Javascript
JavaScript Function函数类型介绍
Apr 08 #Javascript
JavaScript 模块化编程(笔记)
Apr 08 #Javascript
JavaScript DOM事件(笔记)
Apr 08 #Javascript
You might like
php foreach如何跳出两层循环(详解)
2016/11/05 PHP
Laravel 5.4重新登录实现跳转到登录前页面的原理和方法
2017/07/13 PHP
转一个日期输入控件,支持FF
2007/04/27 Javascript
jquery 的 $("#id").html() 无内容的解决方法
2010/06/07 Javascript
js控制的回到页面顶端goTop的代码实现
2013/03/20 Javascript
兼容IE、firefox以及chrome的js获取时间(getFullYear)
2014/07/04 Javascript
javascript中数组的定义及使用实例
2015/01/21 Javascript
简介JavaScript中valueOf()方法的使用
2015/06/05 Javascript
Node.js程序中的本地文件操作用法小结
2016/03/06 Javascript
利用JQuery阻止事件冒泡
2016/12/01 Javascript
JavaScript Date 知识浅析
2017/01/29 Javascript
react-native android状态栏的实现
2018/06/15 Javascript
通过jquery.cookie.js实现记住用户名、密码登录功能
2018/06/20 jQuery
vue增加强缓存和版本号的实现方法
2019/05/01 Javascript
vue 使用v-for进行循环的实例代码详解
2020/02/19 Javascript
easyUI使用分页过滤器对数据进行分页操作实例分析
2020/06/01 Javascript
关于element的表单组件整理笔记
2021/02/05 Javascript
[48:52]DOTA2上海特级锦标赛A组小组赛#2 Secret VS CDEC第一局
2016/02/25 DOTA
[42:06]2019国际邀请赛全明星赛 8.23
2019/09/05 DOTA
python 文件与目录操作
2008/12/24 Python
python相似模块用例
2016/03/04 Python
Python实现自动登录百度空间的方法
2017/06/10 Python
python实现Floyd算法
2018/01/03 Python
python集合是否可变总结
2019/06/20 Python
python可视化篇之流式数据监控的实现
2019/08/07 Python
python 非线性规划方式(scipy.optimize.minimize)
2020/02/11 Python
python opencv 实现读取、显示、写入图像的方法
2020/06/08 Python
英国Boots旗下太阳镜网站:Boots Designer Sunglasses
2018/07/07 全球购物
应届大学生自荐信
2013/12/05 职场文书
致长跑运动员广播稿
2014/01/31 职场文书
小学一年级学生评语
2014/04/22 职场文书
幼儿园辞职信
2015/05/13 职场文书
中学图书馆工作总结
2015/08/11 职场文书
2016年习总书记讲话学习心得体会
2016/01/20 职场文书
观看《杨善洲》宣传教育片心得体会
2016/01/23 职场文书
matplotlib如何设置坐标轴刻度的个数及标签的方法总结
2021/06/11 Python