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的函数重名看其初始化方式
Mar 08 Javascript
javascript下数值型比较难点说明
Jun 07 Javascript
基于jQuery实现复选框的全选 全不选 反选功能
Nov 24 Javascript
动态加载jQuery的两种方法实例分析
Jul 17 Javascript
jquery原理以及学习技巧介绍
Nov 11 Javascript
jQuery的Ajax用户认证和注册技术实例教程(附demo源码)
Dec 08 Javascript
js转换对象为xml
Feb 17 Javascript
微信小程序中做用户登录与登录态维护的实现详解
May 17 Javascript
axios post提交formdata的实例
Mar 16 Javascript
详解基于Vue2.0实现的移动端弹窗(Alert, Confirm, Toast)组件
Aug 02 Javascript
vue实现列表拖拽排序的功能
Nov 02 Javascript
在Angular项目使用socket.io实现通信的方法
Jan 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面向对象全攻略 (十五) 多态的应用
2009/09/30 PHP
php自定义错误处理用法实例
2015/03/20 PHP
PHP简单判断iPhone、iPad、Android及PC设备的方法
2016/10/11 PHP
PHP多进程编程之僵尸进程问题的理解
2017/10/15 PHP
PHP自定义错误处理的方法分析
2018/12/19 PHP
php curl发送请求实例方法
2019/08/01 PHP
用javascript实现读取txt文档的脚本
2007/07/20 Javascript
JavaScript CSS 修改学习第四章 透明度设置
2010/02/19 Javascript
用Juery网页选项卡实现代码
2011/06/13 Javascript
js获取指定的cookie的具体实现
2014/02/20 Javascript
jquery退出each循环的写法
2014/02/26 Javascript
node.js中的fs.writeFile方法使用说明
2014/12/14 Javascript
jquery果冻抖动效果实现方法
2015/01/15 Javascript
JavaScript中的slice()方法使用详解
2015/06/06 Javascript
快速学习JavaScript的6个思维技巧
2015/10/13 Javascript
Bootstrap框架实现广告轮播效果
2016/11/28 Javascript
JavaScript异步上传图片文件的实例代码
2017/07/04 Javascript
javascript input输入框模糊提示功能的实现
2017/09/25 Javascript
Vue 中的compile操作方法
2018/02/26 Javascript
vue数组对象排序的实现代码
2018/06/20 Javascript
nodejs的路径问题的解决
2018/06/30 NodeJs
解析Python编程中的包结构
2015/10/25 Python
Python Socket编程详细介绍
2017/03/23 Python
python3利用ctypes传入一个字符串类型的列表方法
2019/02/12 Python
使用python实现ftp的文件读写方法
2019/07/02 Python
django解决订单并发问题【推荐】
2019/07/31 Python
Python描述符descriptor使用原理解析
2020/03/21 Python
如何解决cmd运行python提示不是内部命令
2020/07/01 Python
Web前端绘制0.5像素的几种方法
2017/08/11 HTML / CSS
CSS3 Flexbox中flex-shrink属性的用法示例介绍
2013/12/30 HTML / CSS
印度最大的酒店品牌网络:OYO Rooms
2016/07/24 全球购物
代理协议书范本
2014/04/22 职场文书
竞选学习委员演讲稿
2014/09/01 职场文书
乡镇干部个人整改措施思想汇报
2014/10/10 职场文书
2015年基层党组织公开承诺书
2015/01/21 职场文书
redis限流的实际应用
2021/04/24 Redis