为什么 {} + {} 仅在客户端是 NaN?为什么不在 Node.js 中?

IT技术 javascript node.js eval google-chrome-devtools web-developer-toolbar
2021-01-14 21:18:12

While[] + []是一个空字符串,[] + {}is"[object Object]"{} + []is 0为什么是{} + {}NaN?

> {} + {}
  NaN

我的问题是,为什么不({} + {}).toString()"[object Object][object Object]"NaN.toString()"NaN"这部分已经在这里回答

我的问题是为什么这只发生在客户端?在服务器端 ( Node.js ){} + {}"[object Object][object Object]".

> {} + {}
'[object Object][object Object]'

总结

在客户端:

 [] + []              // Returns ""
 [] + {}              // Returns "[object Object]"
 {} + []              // Returns 0
 {} + {}              // Returns NaN

 NaN.toString()       // Returns "NaN"
 ({} + {}).toString() // Returns "[object Object][object Object]"
 var a = {} + {};     // 'a' will be "[object Object][object Object]"

在 Node.js 中:

 [] + []   // Returns "" (like on the client)
 [] + {}   // Returns "[object Object]" (like on the client)
 {} + []   // Returns "[object Object]" (not like on the client)
 {} + {}   // Returns "[object Object][object Object]" (not like on the client)
1个回答

更新说明:这已在 Chrome 49 中修复

非常有趣的问题!让我们深入了解。

根本原因

差异的根源在于 Node.js 评估这些语句的方式与 Chrome 开发工具的方式。

Node.js 做什么

Node.js为此使用replmodule。

来自 Node.js REPL 源代码

self.eval(
    '(' + evalCmd + ')',
    self.context,
    'repl',
    function (e, ret) {
        if (e && !isSyntaxError(e))
            return finish(e);
        if (typeof ret === 'function' && /^[\r\n\s]*function/.test(evalCmd) || e) {
            // Now as statement without parens.
            self.eval(evalCmd, self.context, 'repl', finish);
        }
        else {
            finish(null, ret);
        }
    }
);

这就像({}+{})在 Chrome 开发人员工具中运行一样,它也"[object Object][object Object]"按您的预期生成。

chrome 开发者工具的作用

另一方面,Chrome 开发人员工具执行以下操作

try {
    if (injectCommandLineAPI && inspectedWindow.console) {
        inspectedWindow.console._commandLineAPI = new CommandLineAPI(this._commandLineAPIImpl, isEvalOnCallFrame ? object : null);
        expression = "with ((window && window.console && window.console._commandLineAPI) || {}) {\n" + expression + "\n}";
    }
    var result = evalFunction.call(object, expression);
    if (objectGroup === "console")
        this._lastResult = result;
    return result;
}
finally {
    if (injectCommandLineAPI && inspectedWindow.console)
        delete inspectedWindow.console._commandLineAPI;
}

所以基本上,它call使用表达式对对象执行 a 表达式为:

with ((window && window.console && window.console._commandLineAPI) || {}) {
    {}+{};// <-- This is your code
}

因此,正如您所看到的,表达式是直接计算的,没有包装括号。

为什么 Node.js 的行为不同

Node.js 的源代码证明了这一点:

// This catches '{a : 1}' properly.

Node 并不总是这样。这是改变它的实际提交Ryan 对更改留下了以下评论:“改进 REPL 命令的评估方式”,并举例说明了差异。


犀牛

更新 - OP 对Rhino 的行为方式感兴趣(以及为什么它的行为类似于 Chrome 开发工具而不是 nodejs)。

Rhino 使用完全不同的 JS 引擎,这与 Chrome 开发者工具和 Node.js 的 REPL 都使用 V8 不同。

这是在 Rhino shell 中使用 Rhino 评估 JavaScript 命令时发生的基本管道。

基本上:

Script script = cx.compileString(scriptText, "<command>", 1, null);
if (script != null) {
    script.exec(cx, getShellScope()); // <- just an eval
}

在这三个中,Rhino 的外壳是最接近实际的外壳,eval无需任何包装。Rhino 的eval()语句最接近实际语句,您可以期望它的行为与预期完全一样eval

更新 - Chrome 中的控制台 API 已经更新了一点,所以虽然这里的总体思路是正确的,但发布的代码对于最新版本的 Chrome 来说并不准确。chromium.googlesource.com/chromium/blink.git/+/master/Source/...
2021-03-25 21:18:12
(不是真正的答案的一部分,但值得一提的是 nodejs在使用 REPL 时默认使用vm module进行评估,而不仅仅是 JavaScript eval
2021-04-04 21:18:12
例如,你能解释一下为什么rhino在终端(不仅是 Chrome 控制台)中做同样的事情吗?
2021-04-08 21:18:12
@Samuel 只需要阅读源代码 - 我发誓!在 Chrome 中,如果您输入 'debugger;' ,你得到了整个管道——它会直接把你扔到“with”上面,上面只有一个函数 to evaluateOn在 node 中,所有内容都记录得很好——他们有一个专门的 REPL module,在 git 上的所有历史记录都很好而且很舒服,之前在我自己的程序中使用过 REPL,我知道在哪里看:) 我很高兴你喜欢它并找到了它很有帮助,但我要归功于我对这些代码库(开发工具和 nodejs)的熟悉,而不是我的智慧。直奔源头往往是最容易的。
2021-04-10 21:18:12
如果可能的话,+10!哇,伙计,……你真的没有生命,或者你真的比我聪明,知道这样的事情。请告诉我,您搜索了一点才能找到这个答案:)
2021-04-11 21:18:12