Microsoft Edge 中的对象传播运算符抛出错误

Question

我有代码：

let a = {a: 'a', b: 'b'};
let b = {c: 'c', d: 'd'};
let c = {...a, ...b};

在chrome/firefox/...它的显示：c = {a: 'a', b: 'b', c: 'c', d: 'd'}，但在microsoft edge 它抛出错误 Expected identifier, string or number.

我尝试使用 cdn.polyfill.io 和 https://babeljs.io/docs/en/babel-polyfill 但没有成功。

我可以对运行我在 microsoft edge 中的 webpack 代码做什么？

Answer 1

它应该在 Edge 中可用，因为 79 不需要任何转换编译器（如 Babel）（但不是 IE，不要混淆它们）。

https://caniuse.com/#feat=mdn-javascript_operators_spread_spread_in_object_literals

那是说在大多数情况下你可以只使用 Object.assign() 代替 -

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

您的代码将是：

let a = {a: 'a', b: 'b'};
let b = {c: 'c', d: 'd'};
let c = Object.assign(a,b)

console.log(c)

Object.assign() 自 Edge 12 起受支持：

https://caniuse.com/#feat=mdn-javascript_builtins_object_assign

Answer 2

{ ...obj } 语法被称为“Object Rest/Spread Properties" and it's a part of ECMAScript 2018 which is not supported by Edge Legacy. You can use Babel 来转译它。

如果只想在非Node.js环境下使用，可以使用babel-standalone。你只需要在你的脚本中加载 babel-standalone 并在脚本标签中写入你想要转换的脚本，类型为 “text/babel” 或 “text/jsx”，Edge Legacy 中的结果将是 {"a":"a","b":"b","c":"c","d":"d"}:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.18.1/babel.min.js"></script>
</head>
<body>
    <script type="text/babel">
        let a = { a: 'a', b: 'b' };
        let b = { c: 'c', d: 'd' };
        let c = { ...a, ...b };
        console.log(JSON.stringify(c));
    </script>
</body>
</html>

Microsoft Edge 中的对象传播运算符抛出错误

Object spread operator throw error in microsoft edge

javascript

object

microsoft-edge

spread-syntax