写JS时不可避免要用到 if 与 逻辑运算符( ||, &&)。

如果你经常阅读Js的第三方组件源码, 会发现有一种写法作为初始化变量的方法经常出现。

var variable = variable || {};

我第一次看到这样的代码时觉得很不可思议,在多数主流语言下(如Java,C#,C/C++)上面得到的结果值毫无疑问会是一个布尔值,且始终为true。

在看看另一句我们自己写时也常使用的

if( variable ){

  somethingToDo();

}

虽然用得顺手,可是你真的知道哪些值可以触发 If 而哪些是不可以的吗?

还有顺带的一提的是比较运算符,不过这里只说说"=="和"==="。

鉴于以上问题,于是上MDN上看了一些相关资料,顺带作下笔记。

首先来看一张表 :

取自MDN
Operator Usage Description
Logical AND (&&) expr1&&expr2 Returns expr1 if it can be converted to false; otherwise, returns expr2. Thus, when used with Boolean values, && returns true if both operands are true; otherwise, returns false.
Logical OR (||) expr1||expr2 Returns expr1 if it can be converted to true; otherwise, returns expr2. Thus, when used with Boolean values, || returns true if either operand is true.
Logical NOT (!) !expr Returns false if its single operand can be converted to true; otherwise, returnstrue.

图就不翻译了,相信不难看懂,可以看出除了非运算符(!),其余两者都可能返回expr。

在MDN注明了,如果expr为非布尔值的话,它们也是会被原封不动地返回的,这与java或者c#的逻辑运算符是不同的。

在看来下什么情况下可以被转为false(MDN值提供了可以被转为false的值,也就是说其余的都是true)

他们包括

  • null;
  • NaN;
  • 0;(这是数字的0)
  • 空字符串("");
  • undefined.

知道了这些之后,刚才的第一段代码就很好理解了。也就是说,在 variable 为以上五种情况时会初始化为{}。

而第二段的 if 也很清楚地知道了它的判断情况。随便附上一句MDN关于if的解释(原文点我)。

The if statement executes a statement if a specified condition is truthy. If the condition is falsy, another statement can be executed.

(如果condition是truhy[这是js定义的一种状态]的,那么statement1会被执行,否则其他statemen会被执行)

示例代码如下:

if (condition)
statement1
[else
statement2]

而关于truthy和falsy的定义在这个逻辑运算符的介绍页面(原文点这)。

If a value can be converted to true, the value is so-called truthy. If a value can be converted to false, the value is so-called falsy.

(如果一个值可以转化为true那么称呼它为truthy,如果一个值可以转为false那么称呼为falsy)。

接下来关于严格等于符[strcit equality](===)和类型转化等于符[type-converting equality](==)。

从名字就看出来了,后者在比较时会执行隐式的类型转化在比较,而前者不会。

MDN列出了几点值得注意的地方(原文点我):

  • 严格比较时两个字符串必须在字符顺序,字符,长度都相等时才会相等。
  • 严格比较时两个数字必须要拥有相同的数值大小。NaN不等于任何值,包括自己。 正负零没有区分。
  • 布尔值严格比较,只有当两者都是true或false时才相同.
  • 两个不重复的对象无论使用===或者==都不可能相等。
  • 当表达式比较的是对象时,只有它们的引用是来自同一个对象时才会为true.
  • null和undefine严格相等比较时,只等于自身,而抽象比较(==)时相等。

以上。

这几点都是我们在写Js时常用的,如果没彻底理解的话,恐怕会出一些不可思议的错误(笑),所以作下笔记,方便大家与自己都可以参考。

Javascript里的if判断与逻辑运算符(||, &&)和比较运算符的特别之处的更多相关文章

  1. javascript里for循环的一些事情

    今天在给一个学妹调她的代码BUG时,她的问题就是在一个for循环里不清楚流程的具体流向,所以导致了页面怎么调都是有问题,嗯确实你如果不清楚语句流向很轻易就会出问题,所以说for循环不会用或者说用的不恰 ...

  2. Javascript里,想把一个整数转换成字符串,字符串长度为2

    Javascript里,想把一个整数转换成字符串,字符串长度为2.  想把一个整数转换成字符串,字符串长度为2,怎么弄?比如 1 => "01"11 => " ...

  3. javascript里的循环语句

    前序:我一直对于for跟for..in存在一种误解,我觉得for都能把事情都做了,为啥还要for...in...这玩意了,有啥用,所以今天就说说JavaScript里的循环语句. 循环 要计算1+2+ ...

  4. javascript和jquery如何判断元素是否存在最佳。

    在传统的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的.例如: document.getElementById(&q ...

  5. JavaScript 里的 'this' 的一般解释

    本文旨在帮助自己和大家理解 JS 里的 this, 翻译.整理并改写自本人关注的一个博主 Dmitri Pavlutin,原文链接如下: https://dmitripavlutin.com/gent ...

  6. JavaScript根据文件名后缀判断是否图片文件

    //JavaScript根据文件名后缀判断是否图片文件 //图片文件的后缀名 var imgExt = new Array(".png",".jpg",&quo ...

  7. JavaScript里的依赖注入

    JavaScript里的依赖注入 我喜欢引用这句话,“程序是对复杂性的管理”.计算机世界是一个巨大的抽象建筑群.我们简单的包装一些东西然后发布新工具,周而复始.现在思考下,你所使用的语言包括的一些内建 ...

  8. 如何才能通俗易懂的解释javascript里面的"闭包"?

    看了知乎上的话题 如何才能通俗易懂的解释javascript里面的‘闭包’?,受到一些启发,因此结合实例将回答中几个精要的答案做一个简单的分析以便加深理解. 1. "闭包就是跨作用域访问变量 ...

  9. 在JavaScript中,如何判断数组是数组?

    如果你没有注意过这个问题,那么这个标题应该会让你感到困惑,判断数据类型这么基础的问题能有什么坑呢? 少年,你不能太天真了,我们朝夕面对的这门语言,可是JavaScript呀,任何你觉得已经习以为常的东 ...

随机推荐

  1. JQUERY选中问题

    单选,复选,下拉列表的全选选中问题 基本思路就是找到元素,操作元素,关于怎么找看jquery简介,主要学习记住具体操作用到的方法   复选框的全选以及设置选中问题:   jquery中提供prop方法 ...

  2. SQL数据库基础知识-巩固篇<一>

    SQL数据库基础知识-巩固篇<一>... =============== 首先展示两款我个人很喜欢的数据库-专用于平时个人SQL技术的练习<特点:体积小,好安装和好卸载,功能完全够用 ...

  3. Java:输入输出流 java.io包的层次结构

    1.什么是IO Java中I/O操作主要是指使用Java进行输入,输出操作. Java所有的I/O机制都是基于数据流进行输入输出,这些数据流表示了字符或者字节数据的流动序列.Java的I/O流提供了读 ...

  4. JavaEE error整理(不断更新)

    该文章用于整理开发中遇到的一些错误,及解决方法,不断整理更新. 1. 缺包异常 异常1:java.lang.NoClassDefFoundError: org/apache/commons/loggi ...

  5. temp-黄河农商行路径

    -------------------------------黄河农村商业银行------------------------------------ --1.--svn 地址:http://10.0 ...

  6. activiti07- Task

    任务 用户任务: 用户任务,用来对那些需要人参与完成的工作进行建模.当流程执行到这样的用户任务时,会在被分配到该任务的用户或用户组的任务列表中创建新的任务. 用户任务中可以包含描述.事实上,任何BPM ...

  7. 手把手教你使用spring cloud+dotnet core搭建微服务架构:服务治理(-)

    背景 公司去年开始使用dotnet core开发项目.公司的总体架构采用的是微服务,那时候由于对微服务的理解并不是太深,加上各种组件的不成熟,只是把项目的各个功能通过业务层面拆分,然后通过nginx代 ...

  8. 笔记本win10安装node的尖酸历程。。。。。。

    在公司的电脑搭建vue环境分分钟搞定,周末闲的无聊给自己的电脑也搭建一个环境,谁知道这么多的问题,记录下这些问题,希望对那些安装node环境有问题的朋友一些帮助. 1.下载安装node 下载地址htt ...

  9. Dynamic web module 版本之间的区别

    Servlet 3十二月2009开发平台标准版6,6可插性,易于开发,异步ser vlet,安全,文件上传Servlet 2.5九月2005开发平台标准版5,5需要平台标准版5,支持注释Servlet ...

  10. 策略模式Strategy

    定义一系列的算法,把他们封装起来,使得算法独立于适用对象. 比如,一个系统有很多的排序算法,但是使用哪个排序算法是客户对象的自有.因此把每一个排序当做一个策略对象,客户调用哪个对象,就使用对应的策略方 ...