函数参数内的括号 ES5 兼容性

Question

我是运行下面在 IE11 中没有转译器的脚本。然而，它 returns 一个 "expected identifier" 错误。

var result = Object.values(response.data.reduce(function(r, { boxm, model_no, model_name, qty, type }, index, array) {
      r[boxm] = r[boxm] || { boxm: boxm, lines: [] }
      r[boxm].lines.push({ model_no: model_no.toString(), model_name: model_name, qty: qty, type: type })
      return r
}, {}))

我猜一定是reduce函数中的这部分{ boxm, model_no, model_name, qty, type }。

有人知道如何将其转换为 ES5 友好语法吗？

Answer 1

不支持的部分肯定是解构，还有Object.values.

要确定您可以使用什么或不能使用什么，有一个网站：

https://caniuse.com/#search=Object.values

var obj = response.data.reduce(function(r, data, index, array) {
  r[data.boxm] = r[data.boxm] || {
    boxm: data.boxm,
    lines: [],
  };

  r[data.boxm].lines.push({
    model_no: data.model_no.toString(),
    model_name: data.model_name,
    qty: data.qty,
    type: data.type,
  });

  return r;
}, {});

var result = Object.keys(obj).map(function(x) {
  return obj[x];
});

Answer 2

这叫做解构，它是 ECMAScript 6 语法。 Object.values 和动态属性名称也不被支持。这是完整的 ES5 版本：

//Note that I'm creating Object.values here to make the rest of the code simpler
Object.prototype.values = function(obj) {
    return Object.keys(obj).map(function(key) {
        return obj[key];
    });
};

var result = Object.values(response.data.reduce(function(r, curr, index, array) {
    if (!r[curr.boxm]) {
        r[curr.boxm] = {
            boxm: curr.boxm,
            lines: []
        }
    }
    r[curr.boxm].lines.push({
        model_no: curr.model_no.toString(),
        model_name: curr.model_name,
        qty: curr.qty,
        type: curr.type
    });
    return r;
}, {}));

函数参数内的括号 ES5 兼容性

Brackets inside function argument ES5 compatibility

javascript

ecmascript-5

ecmascript-6