讲师中心 微信公众号
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机游戏
最近更新
首页 > web前端 > js教程 > 正文

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

php中文网
发布： 2016-05-16 16:05:03
原创
1339人浏览过

如果你还是新手, 而且读完所有这些技巧的详解和每种技巧是如果工作的以后运用它们, 你会写出更加简练高效的JavaScript程序.

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

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

例子1. || (或)
设置默认值, 通常用

复制代码 代码如下:

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

用这代替:

立即学习“Java免费学习笔记（深入）”；

复制代码 代码如下:

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;
 }
}
登录后复制

用这代替:

立即学习“Java免费学习笔记（深入）”；

复制代码 代码如下:

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

解析:

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

例子3.

Dbsite企业网站管理系统1.5.0
Dbsite企业网站管理系统1.5.0

Dbsite企业网站管理系统V1.5.0 秉承"大道至简 邦达天下"的设计理念,以灵巧、简单的架构模式构建本管理系统。可根据需求可配置多种类型数据库（当前压缩包支持Access）.系统是对多年企业网站设计经验的总结。特别适合于中小型企业网站建设使用。压缩包内包含通用企业网站模板一套，可以用来了解系统标签和设计网站使用。QQ技术交流群：115197646 系统特点：1.数据与页

Dbsite企业网站管理系统1.5.0 0
查看详情 Dbsite企业网站管理系统1.5.0

不要这样做:

if (userName) {
 logIn(userName);
} else {
 signUp();
}
登录后复制

用这代替:

立即学习“Java免费学习笔记（深入）”；

复制代码 代码如下:

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

解析:

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

例子4.
不要这样做:

var userID;

if (userName && userName.loggedIn) {
 userID = userName.id;
} else {
 userID = null;
}
登录后复制

用这代替:

立即学习“Java免费学习笔记（深入）”；

复制代码 代码如下:

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

解析:

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

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

大家都在看：

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习？java怎么入门？java在哪学？java怎么学才快？不用担心，这里为大家提供了java速学教程(入门到精通)，有需要的小伙伴保存下载就能学习啦！

下载
来源：php中文网
收藏 点赞
上一篇：js实现简单的左右两边固定广告效果实例_javascript技巧 下一篇：javascript实现简单的鼠标拖动效果实例_javascript技巧
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
javascript闭包如何理解_闭包在实际开发中有什么用途 闭包是函数记住并访问其定义时词法环境的能力，核心在于函数作为值、词法作用域与引用保持；可实现私有变量、解决循环异步bug、柯里化等。
2025-12-20 10:09:26
128
javascript中的Cookie是什么_如何安全地使用它 Cookie是HTTP协议的一部分，由服务器通过Set-Cookie下发、浏览器自动存取，最大约4KB；JavaScript仅能通过document.cookie操作非HttpOnlyCookie，本质为字符串操作，需注意编码、路径、域名、Secure及安全配置。
2025-12-20 10:06:07
717
javascript如何检测数据类型_ typeof怎么用 typeof无法准确区分null、数组、日期等对象类型，需配合Object.prototype.toString.call()或Array.isArray等方法；其返回值包括"number"、"string"、"boolean"、"undefined"、"function"、"symbol"、"bigint"及统一的"object"。
2025-12-20 10:01:02
785
javascript如何实现继承_ES6的class与原型继承有什么区别？ ES6的class是原型继承的语法糖，本质未改变继承机制，仍依赖原型链；通过extends和super实现继承，而ES5需手动操作prototype和constructor；两者底层结构一致，但class写法更清晰、可读性更高。
2025-12-20 09:50:39
845
JavaScript如何创建Web Workers？ JavaScript中创建WebWorkers需通过Worker构造函数加载独立JS文件，主线程与Worker通过postMessage/onmessage通信，不可访问DOM或共享变量；Worker脚本须为外部文件，支持模块化（type:‘module’），但受限于同源策略、无DOM访问、需HTTP环境等。
2025-12-20 09:45:38
176
javascript数组有哪些常用方法_如何实现数组去重和排序？ JavaScript数组常用方法分不改变原数组（如map、filter、slice等）和改变原数组（如push、splice、sort等）两类；去重推荐Set+扩展运算符，排序数字必须用比较函数。
2025-12-20 09:31:02
209
javascript如何实现移动端适配_touch事件与click事件有何不同？ 移动端适配核心是响应式布局与触控优化，需设viewport、用flex/rem/vw、辅以媒体查询；touch事件无延迟、支持多点坐标，click有300ms延迟、语义明确；按场景选择：跳转用click加touch-action，手势操作用touch，防误触需结合touchstart/touchend判断。
2025-12-20 09:01:02
363
什么是javascript迭代器与生成器_它们如何简化异步操作？ JavaScript迭代器和生成器本身不直接处理异步操作，但提供可暂停、可恢复的底层机制，配合async/await或手动调度可简化异步流程；迭代器是含next()方法的对象，返回{value,done}，实现可遍历协议。
2025-12-20 08:45:43
598
javascript如何实现3D图形_Three.js怎样在网页中创建场景 Three.js实现3D场景需三要素：WebGLRenderer渲染器、THREE.Scene场景、PerspectiveCamera相机；再添加几何体、材质、网格构成物体，配合环境光与方向光，并用requestAnimationFrame驱动动画及响应窗口缩放。
2025-12-20 08:22:03
896
javascript如何操作cookie_如何设置安全的HttpOnly标志 JavaScript无法读取HttpOnlyCookie，因其设计目的就是禁止客户端脚本访问以防范XSS；JS仅能通过document.cookie操作非HttpOnly、同域、未过期且满足Secure/SameSite等条件的Cookie。
2025-12-20 08:16:40
747
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部