js中if判断语句执行原因--数据类型转换原理

栏目: JavaScript · 发布时间: 5年前

内容简介:相信我们程序员平时写代码用的最多的逻辑就是if语句了吧,可你知道他的原理是什么吗,其实这跟Boolean()这个方法有关,此方法为自动执行(在需要判定Boolean的语句中中自动执行),这些转换规则对理解if控制语句自动执行相应的Boolean转换非常重要,这是我们平时所写的代码其实执行起来是这样,理解一下

前言:

相信我们 程序员 平时写代码用的最多的逻辑就是if语句了吧,可你知道他的原理是什么吗,其实这跟Boolean()这个方法有关,此方法为自动执行(在需要判定Boolean的语句中中自动执行),这些转换规则对理解if控制语句自动执行相应的Boolean转换非常重要,

这是我们平时所写的代码

var a = "auto"
    if(a){
        console.log("执行")
    }

其实执行起来是这样,理解一下

var a = "auto"
    if(Boolean(a)){
        console.log("执行")
    }

这样其实就好理解了,每个类型的值其实都可以转换为Boolean值,有一定的规则,接下来我们看看具体操作

取证

将需要转换的数据传递给Boolean()函数

  • Boolean: 毋庸置疑true就是true,false就是false,但是new Boolean这里有坑

    var boolean1 = true;  // true;  
      var boolean2 = false; // false; 
      console.log(Boolean(boolean1));
      console.log(Boolean(boolean2));

    // 这里坑来了 Boolean()是返回布尔值,new Boolean()是返回布尔对象(对象里面的值为false,)

    var x = Boolean(false);
      if (x) {
        // 这里的代码不会被执行
      }
      
      var x = new Boolean(false);
      if (x) {
        // 这里的代码会被执行
      }

注意不要将基本类型中的布尔值 true 和 false 与值为 true 和 false 的 Boolean 对象弄混了。不要在应该使用基本类型布尔值的地方使用 Boolean 对象。

var x = Boolean(expression);     // 推荐(Boolean值)
    var x = new Boolean(expression); // 不推荐,Boolean对象里的值不管是true还是false,只要对象有值都会判定为true,if语句中都会执行、
  • String : 只要不是空字符串(没有任何内容),任何非空字符串(包含空格) 都会转换为true
var str1 = "";  // "" --> false
    var str2 = " "; // " " --> true;
    var str3 = "abc"; // " " --> true;
    console.log(Boolean(str1));
    console.log(Boolean(str2));
    console.log(Boolean(str3));
  • Number : 只有0和NaN会转换为false,其他都会转换为true
var num1 = 0;  //false
    var num2 = -1; //true
    var num3 = 1;  //true
    var num4 = NaN; //false
    console.log(Boolean(num1));        
    console.log(Boolean(num2)); 
    console.log(Boolean(num3));
  • null、undefined : 都会转换为false
var n = null;  //false
    var u = undefined;  //false
    console.log(Boolean(n)); 
    console.log(Boolean(u));

总结:

false / "" / NaN / 0 / null / undefined 都会转换为 false

注意 Boolean() 和 new Boolean()的区别

参考:

大部分取经于js高程红宝书26页,3.4.4章节(Boolean类型的介绍)

new Boolean()的坑取经于 MDN中Boolean的描述


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

The Book of CSS3

The Book of CSS3

Peter Gasston / No Starch Press / 2011-5-13 / USD 34.95

CSS3 is the technology behind most of the eye-catching visuals on the Web today, but the official documentation can be dry and hard to follow. Luckily, The Book of CSS3 distills the heady technical la......一起来看看 《The Book of CSS3》 这本书的介绍吧!

HTML 编码/解码
HTML 编码/解码

HTML 编码/解码

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具