「JavaScript」操作数隐式类型转换

JavaScript是一个对类型非常容忍的语言,在我们编写代码的过程中,会看到许多代码直接对不同类型的操作数进行操作。有的时候这会给我们的代码的编写带来很大的方便,而有些时候这些不加检查的类型比较也会给我们的代码带来一些隐患。在调试的时候,我们如果对JavaScript自动执行的类型转换有比较清楚的了解的话,很不容易发现问题的所在点。

PS: 对象→基本类型的转换规则请参考《JavaScript高级编程指南》


一、减号、乘号、除号、取模...

减号、乘号、除号、取模等操作符是比较单纯的操作符。
这些操作符会尝试将他们的操作数转换为数字(使用Number()),如果操作数没法转换为数字的话,他们的结果就是NaN

NaN与任何数进行这些操作,结果都是NaN

    // Demo1.html
    var obj = {
        valueOf: function() {
            return 18;
        }
    };
    var obj2 = {
        valueOf: function() {
            return 19;
        }
    };

    console.log(
            1 - "2", // -1
            "32" - "22", // 10
            obj % 4, // 2
            obj * obj2, // 342
            "99b" * 10 // NaN
    );

二、大于、小于、大于等于、小于等于

同(一),但是对于两个操作数均是字符串的时候&无法转换时的返回值会有不同。
当两个操作数均是字符串的时候,它会执行大家熟悉的字符串比较,即从左到右依次比较每一个字符的ASCII码,若出现符合操作符的情况,则返回true,否则返回false
无法将操作数转换为数字的情况下总是返回false

Boolean(NaN) == false

    // Demo2.html
    var obj = {
        valueOf: function() {
            return 18;
        }
    };

    console.log(
            1 <= "2", // true
            "1" <= "a", // true
            obj >= "17" // true
    );

三、==、!=

这两个运算符在大部分上面都是与(一)相同的,不同的是:

  • 字符串 op 字符串:不会进行类型转换,直接比较。
  • 对象 op 对象:引用都指向同一个对象才为true
    // Demo3.html
    var obj = {
        valueOf: function() {
            return 18;
        }
    };
    var obj2 = {
        valueOf: function() {
            return 19;
        }
    };

    console.log(
            obj == obj2, // false
            "XD" == "XD", // true
            obj == 18, // true
            obj2 == "19" // true
    );

温馨提示:null == undefined // true

四、加号(+)

当没有特别指定的时候参考(一),比如对象+对象等,但有如下几种例外情况:

  • 字符串 + 字符串:进行字符串拼接操作。
  • 字符串 + 其他:将其他转换为字符串,并进行拼接操作。
    // Demo4.html
        var obj = {
        toString: function() {
            return "18s";
        },
        valueOf: undefined
    };
    var obj2 = {
        toString: function() {
            return "19b";
        },
        valueOf: function() {
            return 19;
        }
    };

    console.log(
            obj + obj2, // "18s19"
            obj2 + obj2 // 38
    );

注意上面obj + obj2的结果不是"18s19b"。因为操作数中没有字符串,所以参考(一)的转换规则。

DEMO

[重要提示]请不要忘记推荐收藏 (╯‵□′)╯︵ ┴─┴

git clone https://github.com/JasonKid/fezone.git

搜索 操作数隐式类型转换

阅读 2.7k

推荐阅读
Jasonの前端地界
用户专栏

作者在前端学习路上的知识总结。

43 人关注
14 篇文章
专栏主页