JavaScript逻辑运算符相关总结

 更新时间:2020年09月04日 08:23:37   作者:Clloz  
这篇文章主要介绍了JavaScript逻辑运算符的相关资料,帮助大家更好的理解和学习JavaScript,感兴趣的朋友可以了解下

前言

关于 JavaScript 中的逻辑运算符,我们经常使用却可能不知道它的一些机制和用法。

机制

首先我们需要知道几种逻辑运算符的优先级是不同的(关于完整的运算符优先级,看运算符优先级),逻辑非>逻辑与>逻辑或>条件运算符(三目运算符)。运算顺序条件运算符是从右向左,而逻辑与和逻辑或都是从左向右。

//表达式的优先级导致结果不同
false && true || true   // 结果为 true
false && (true || true)   // 结果为 false

逻辑运算表达式返回的是字表达式的值,而不是一个 Boolean,只不过很多时候我们使用逻辑表达式的地方帮我们强制转换了,比如 if 语句等。

逻辑运算符通常用于布尔型(逻辑)值。这种情况下,它们返回一个布尔值。然而, && 和 || 运算符会返回一个指定操作数的值,因此,这些运算符也用于非布尔值。这时,它们也就会返回一个非布尔型值。

逻辑与 expression1 && expression2 的机制是,如果 expression1 能够转换为 true 那么返回 expression2 ,否则返回 expression1

逻辑或 expression1 || expression2 的机制是,如果 expression1 能够转化为 true 那么返回 expression1,否则返回 expression2

逻辑非 !expression ,若 expression 能够转化为 true 则返回 false,否则返回 true

expression 可能是任何一种类型, 不一定是布尔值。

会被转化为 false 的表达式有:

  • null
  • NaN
  • 0
  • 空字符串("" or '' or“` “ “`)
  • undefined

需要特别注意的是 undefined,有些表达式返回的是 undefined ,比如没有设置 return 的函数执行的返回值就是 undefined

尽管 && || 运算符能够使用非布尔值的操作数, 但它们依然可以被看作是布尔操作符,因为它们的返回值总是能够被转换为布尔值。如果要显式地将它们的返回值(或者表达式)转换为布尔值,请使用双重非运算符(即!!)或者 Boolean 构造函数。

双重非运算符 !! 可以将任意值强制转换为布尔值,在需要条件判断的地方经常使用。

短路计算

逻辑运算的机制还存在短路计算:

  • (some falsy expression1) && (expression2) 短路计算的结果为假。
  • (some truthy expression1) || (expression2) 短路计算的结果为真。

短路意味着上述表达式中的 expression2 部分不会被执行,因此 expression2 的任何副作用都不会生效(举个例子,如果 expression 是一次函数调用,这次调用就不会发生)。造成这种现象的原因是,整个表达式的值在第一个操作数被计算后已经确定了。

用法

利用 javascript 中逻辑运算符支持任意类型和短路计算的特性我们可以将逻辑运算符运用到一些特殊的地方。

逻辑与

逻辑与可以用来获得第一个假值,比如 expr1 && expr2 && expr3,当其中存在假值的时候会被返回。也可以类推至前面的表达式都为真的时候执行最后一个表达式来简化判断逻辑的代码,比如 x > 0 && a(),这可以代替 if 语句。

逻辑或

逻辑或可以用来设置默认值,比如你的函数需要用户输入一个参数,如果用户没有输入则给定一个默认值。this.a = param || {}

以上就是JavaScript逻辑运算符相关总结的详细内容,更多关于JavaScript逻辑运算符的资料请关注脚本之家其它相关文章!

相关文章

  • 深入探讨JavaScript中Class的语法与使用

    深入探讨JavaScript中Class的语法与使用

    这篇文章将带大家深入探讨 class 在 JavaScript 中的作用、语法和使用方法,并与 ES5 构造函数进行对比,希望可以帮助大家更好地理解和应用类的概念
    2023-06-06
  • 前端JavaScript页面插入图片的7种方法及避坑指南

    前端JavaScript页面插入图片的7种方法及避坑指南

    文章详细探讨了前端页面插入图片时需要考虑的各个方面,包括加载顺序、响应式适配、懒加载、格式选择、缓存策略、SEO和性能评分等,通过分享作者的实际经验,文章提供了优化图片加载和渲染的实用方法和技巧,需要的朋友可以参考下
    2025-12-12
  • javascript常用方法、属性集合及NodeList 和 HTMLCollection 的浏览器差异

    javascript常用方法、属性集合及NodeList 和 HTMLCollection 的浏览器差异

    对于 HTMLCollection集合对象 必须要说一说的是 namedItem方法. 看看规范的解释.
    2010-12-12
  • Javascript中的every()与some()的区别和应用小结

    Javascript中的every()与some()的区别和应用小结

    every跟some不同点在于,every要判断数组中是否每个元素都满足条件,只有都满足条件才返回true,只要有一个不满足就返回false,这篇文章主要介绍了Javascript中的every()与some()的区别和应用,需要的朋友可以参考下
    2023-05-05
  • js中substring和substr的定义和用法

    js中substring和substr的定义和用法

    这篇文章主要介绍了js中substring和substr的定义和用法,需要的朋友可以参考下
    2014-05-05
  • JavaScript 中传递参数的方式示例详解

    JavaScript 中传递参数的方式示例详解

    JavaScript中参数传递方式包括按值传递、按引用传递、参数解构传递、Rest参数传递、回调函数传递、闭包传递、模板字符串传递和高阶函数传递,每种方式都有其特点和适用场景,选择合适的传递方式可以提高代码的可读性、可维护性和灵活性,感兴趣的朋友一起看看吧
    2025-01-01
  • mapboxgl区划标签避让不遮盖实现的代码详解

    mapboxgl区划标签避让不遮盖实现的代码详解

    Mapbox是一个可以免费创建并定制个性化地图的网站。这篇文章主要介绍了mapboxgl区划标签避让不遮盖实现方法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-07-07
  • JavaScript实现合并(归并)排序算法示例解析

    JavaScript实现合并(归并)排序算法示例解析

    这篇文章主要为大家介绍了JavaScript实现合并(归并)排序算法示例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-08-08
  • js检测输入内容全为空格的方法

    js检测输入内容全为空格的方法

    这篇文章主要介绍了js检测输入内容全为空格的方法,,需要的朋友可以参考下
    2014-05-05
  • 详解webpack多页面配置记录

    详解webpack多页面配置记录

    本篇文章主要介绍了详解webpack多页面配置记录,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-01-01

最新评论