ES6/TS：函数调用中的对象解构答案

【问题标题】：ES6/TS: Object destructuring in function callES6/TS：函数调用中的对象解构
【发布时间】：2019-04-14 12:43:12
【问题描述】：

在函数调用中实现对象解构的 ES6+/TS 简写是什么？

让我们假设一个 Javascript 函数被广泛使用并且不能改变它的签名

const foo = (b, a) => console.log(b, a);
foo(66,55);                  // 66, 55

还有一个用于为调用参数提供值的对象

const o = {a: 55, b: 66 };
foo(o.b, o.a);               // 66, 55       <-- can we find a short-hand ?

一些调用没有命中目标

    foo(...Object.values(o)) // 55, 66 (no, JS object keys are unordered by definition)
    foo(...o);               // TypeError (short, but not valid, illustration only)
    foo(({b, a} = o));       // {a: 55, b: 66} undefined (no error, but we want 66, 55)

【问题讨论】：

您无法将对象属性与位置参数匹配，因为对象顺序未定义。
你不能那样做。 Javascript 不支持命名参数。
@deceze，真的，我已经标记了。在这些情况下，您是否有与“传统” (foo(o.b, o.a) 不同的方法？
不，你正在做的就是它的完成方式。
foo(...["b", "a"].map(p => o[p])) 会这样做。但除非您的参数列表很大，或者属性是动态选择的，否则foo(o.b, o.a) 是简单且首选的方式。

标签： javascript typescript ecmascript-6

【解决方案1】：

如果您无法更改函数的签名，那么你必须以正确的顺序调用每个参数。

这对于对象解构来说是不可能的，因为地图没有任何顺序。

你可以用 apply 做类似的事情：

foo.apply(null, Object.values(o));

但不能保证值的顺序。

function foo(a,b){return a*b-a}
foo(3,1) // => 0
foo(1,3) // => 2
var o1 = {a:3,b:1}
foo.apply(null,Object.values(o1)) // => 2
var o2 = {b:3, a:1}
foo.apply(null,Object.values(o2)) // => 0

所以没有任何机智的方法可以做到这一点。

【讨论】：