美文网首页javascriptjs
浅谈JS中的 [] + {}和{} + []

浅谈JS中的 [] + {}和{} + []

作者: 梅溪湖的张会计 | 来源:发表于2019-06-03 10:12 被阅读200次

    在前几天读到《你不知道的javascript》的类型与文法章节中有看到这两个题目

    1. []+{} /* [object Object] */
    2. {} + [] /* 0 */

    在js中,加法运算的规则很简单,只会触发两种情况:
    1. number + number
    2. string + string
    所以,在JavaScript隐式转换规则中首先会推算两个操作数是不是number类型,如果是则直接运算得出结果。
    如果有一个数为string,则将另一个操作数隐式的转换为string,然后通过字符串拼接得出结果。
    如果为布尔值这种简单的数据类型,那么将会转换为number类型来进行运算得出结果。
    如果操作数为对象或者是数组这种复杂的数据类型,那么就将两个操作数都转换为字符串,进行拼接 。

    在题目中,[] + {} 中,[]会通过隐式转换规则,调用toString方法转换为 "" ,同理{}转换为[object Object], 相加得出字符串拼接结果 [object Object]

    var arr = new Array;
    arr.toString() // ""
    var obj = new Object;
    obj.toString() // [object Object]


    而 {} + [] 就有点疑惑了, 它为什么结果会是0呢?
    在js中{}代表复合语句,在一些js解释器会将开头的 {} 看作一个代码块,而不是一个Object(在es6以前只有函数作用域与全局作用域,还没有块级作用域)而这里的{}只是空符号,不表明任何意思。这里的+[]是一个隐式转换,所以参与运算的只有+[],在这里将[]转换成了number类型,所以得出结果为0。

    {};
     +[] //[].toString() == "";   +" " == 0

    相关文章

      网友评论

        本文标题:浅谈JS中的 [] + {}和{} + []

        本文链接:https://www.haomeiwen.com/subject/xeiqxctx.html