javascript - 使用对象破坏时浏览器不一致的意外“未定义”字符串

Question

当我在一些浏览器控制台中尝试一些对象破坏语法时，发生了一些意想不到的事情。首先我进入

action = {
      type: "SET_APPS_UI_REVERT",
      device: 23456,
      managedApps: "12345"
    }

接着

( { type, status, appsInfo, device,managedApps,appName } = action);

最后

status

所以 chrome 和 firefox 都决定给我"undefined"一个字符串，而不是一个未定义的值，而 edge 会给我一个通常的undefined. 但是，当我输入

const { type, status, appsInfo, device,managedApps,appName } = action

接着

status

在边缘，它给了我一个""而不是undefined。

这是某些浏览器不一致的结果吗？或者实际上是一些错误？

截图如下

chrome-66-0-3359-181-no-const.PNG

edge-41-16299-402-0-with-edgehtml-16-16299-no-const.PNG

edge-41-16299-402-0-with-edgehtml-16-16299-with-const.PNG

firefox-60-0-1-no-const.PNG

Answer 1

使用以下语法：

( { type, status, appsInfo, device,managedApps,appName } = action);

您明确地说“action.status对现有变量进行解构status。

如果您还没有status在本地范围内调用变量，那么它将尝试分配action.status给window.status属性。这个属性只接受一个字符串，所以当action没有status属性时，你已经有效地做到了：

window.status = undefined;

由于window.status强制转换为字符串，因此在回读此内容时，您会得到window.status === "undefined";.

即使这对 Firefox 中的状态栏没有任何影响，它仍然会表现出这种行为。

您的第二部分也是预期的行为：

const { type, status, appsInfo, device,managedApps,appName } = action

与以前不同，因为您声明了一个名为status. 这就是浏览器差异所在。在 Chrome 中，当您const status在 devtools 中声明时，devtools 被视为“范围”，您可以在声明后访问它。然而，在 Edge 中，您可以const在开发工具中声明，但您永远无法访问该值。参考。

所以在 Edge 中，你会得到这种行为：

{
    const status = action.status;
    typeof status === "undefined"; // true
}
status; // The value of window.status. const status is out of scope