一、Boolean 是什么?

bool 是表示 true 或 false 的基础数据类型。Boolean 是表示 true 或 false 的对象数据类型,可以把其他类型转换为 Boolean 类型。

1、bool 与 Boolean 区别
  • bool 是基础类型,Boolean 是对象类型;
  • bool 使用场景:所有需要做 true 或 false 判断的地方,优先使用 bool 类型;
  • Boolean 使用场景:无法直接判断 true 或 false 的类型,可转换为 Boolean 类型后,再做 true 或 false 判断。
  • 结论:不要在应该使用基本类型布尔值的地方使用 Boolean 对象。

二、怎么用?

两种使用 Boolean 的方式:一种是使用 Boolean() 函数直接转换;一种是使用 new 新建 Boolean 对象。使用建议:优先使用 Boolean() 函数。


1、Boolean()

用 Boolean() 可以转换其他类型为 Boolean类型。

<!DOCTYPE html>
<html lang='zh-CN'>

<head>
    <meta charset="utf-8">
    <title>Boolean</title>
    <script>
        console.log("以下类型转换为Boolean时,初始值都是false:");
        console.log(Boolean(0) === false);
        console.log(Boolean(-0) === false);
        console.log(Boolean(null) === false);
        console.log(Boolean(false) === false);
        console.log(Boolean(NaN) === false);
        console.log(Boolean(undefined) === false);
        console.log(Boolean("") === false);

        console.log("任何对象、数组、字符串转换为Boolean时,初始值都是true:");
        var obj = {};
        console.log(Boolean(obj) === true);
        console.log(Boolean([]) === true);
        console.log(Boolean("false") === true);
    </script>
</head>

<body>
    <h1>Symbol : 打开 Console 看结果!</h1>
</body>

</html>

2、new

使用 new 新建 Boolean 对象,不同于基础类型,有些坑要避开。

<!DOCTYPE html>
<html lang='zh-CN'>

<head>
    <meta charset="utf-8">
    <title>Boolean</title>
    <script>
        console.log("用 new 来创建 Boolean 对象")
        var btrue = new Boolean("abc");

        console.log("以下类型转换为Boolean时,初始值都是false:");
        console.log(new Boolean(0) == false);
        console.log(new Boolean(-0) == false);
        console.log(new Boolean(null) == false);
        console.log(new Boolean(false) == false);
        console.log(new Boolean(NaN) == false);
        console.log(new Boolean(undefined) == false);
        console.log(new Boolean("") == false);

        console.log("任何对象、数组、字符串转换为Boolean时,初始值都是true:");
        var obj = {};
        console.log(new Boolean(obj) == true);
        console.log(new Boolean([]) == true);
        console.log(new Boolean("false") == true);

        console.log("Boolean 对象,正确使用方式:")
        console.log("!!btrue : ", !!btrue);
        console.log("btrue == true : ", btrue == true);

        console.log("错误判断方式:")
        // 原因:此方式是判断 btrue 对象是否为null
        console.log("btrue : ", btrue);
        console.log("!btrue : ", !btrue);
        // 原因:对象类型 无法与 基础类型 恒等
        console.log("btrue === false : ", btrue === true);

    </script>
</head>

<body>
    <h1>Symbol : 打开 Console 看结果!</h1>
</body>

</html>

3、区别

在使用上面两种方法时,注意下面的坑。

<!DOCTYPE html>
<html lang='zh-CN'>

<head>
    <meta charset="utf-8">
    <title>Boolean</title>
    <script>
        // 转换函数 与 new 的使用区别:
        if (Boolean(false)) {
        } else {
            // 这里的代码会被执行
            console.log("这里的代码会被执行");
        }

        var x = new Boolean(false);
        if (x) {
            // 这里的代码会被执行
            console.log("这里的代码会被执行");
        } else {
        }
    </script>
</head>

<body>
    <h1>Symbol : 打开 Console 看结果!</h1>
</body>

</html>

4、其他方法
  • Boolean.toString()
const flag1 = new Boolean(true);
console.log(flag1.toString());
// expected output: "true"

const flag2 = new Boolean(1);
console.log(flag2.toString());
// expected output: "true"
  • Boolean.valueOf()
const x = new Boolean();
console.log(x.valueOf());
// expected output: false

const y = new Boolean('Mozilla');
console.log(y.valueOf());
// expected output: true

三、参考文档

Learn_anything
7 声望0 粉丝

收集互联网优质资源!