在保留对象的同时取消函数调用中的分配 [英] Destructuring assignment in function call while preserving the object

问题描述

是否可以执行以下操作?

Is there a way to do something like the following?

f = (o:{a:x}) {
    console.log(o);
    console.log(x);
}
f({a:0});
//Should Print:
//{a:0}
//0

要获得与this相同的结果.

To get the same result as the this.

f = function(o) {
    var {a:x} = o;
    console.log(o);
    console.log(x);
}
f({a:0});
//Prints
//{a:0}
//0

我想在函数参数内解构对象，同时还将对象传递给函数，以便可以修改对象.

I would like to deconstruct the object inside the function parameters while also passing the object to the function so that the object can be modified.

推荐答案

TL; DR

对象-丢失属性:

let f = ({ a: x, ...o }) => {
    console.log(o);
    console.log(x);
};
f({ a: 0, b: 1, c: 2 });
// x is: 0
// o is: { b: 1, c: 2 }

对象-保留属性:

let f = (o) => {
    let { a: x } = o;
    console.log(o);
    console.log(x);
};
f({ a: 0, b: 1, c: 2 });
// x is: 0
// o is: { a: 0, b: 1, c: 2 }

数组-丢失元素:

let f = ([x, ...a]) => {
    console.log(a);
    console.log(x);
};
f([0, 1, 2]);
// x is: 0
// a is: [1, 2]

数组-保留元素:

let f = (a) => {
    let [x] = a;
    console.log(a);
    console.log(x);
};
f([0, 1, 2 ]);
// x is: 0
// a is: [0, 1, 2]

请注意，上面保留属性的示例将相同的对象()放在调用函数时使用的o(或a中的数组)中，而不是副本.要使用浅表副本，您可以使用以下示例:

Note that the examples above that preserve properties put the same object in o (or array in a) that was used when calling the function, not a copy. To use a shallow copy you can use the examples below:

let f = ({ ...o }) => {
    let { a: x } = o;
    console.log(o);
    console.log(x);
};
f({ a: 0, b: 1, c: 2 });
// x is: 0
// o is: { a: 0, b: 1, c: 2 }

数组-保留元素，创建一个新数组:

let f = ([...a]) => {
    let [x] = a;
    console.log(a);
    console.log(x);
};
f([0, 1, 2]);
// x is: 0
// a is: [1, 2]

说明

如果要保留o中原始对象的所有属性，则需要在函数主体中进行显式的分解步骤:let { a: x } = o;，但是如果要仅保留那些未放置的属性到x中，则您可以按如下所述使用解构(将来在受支持的情况下).有关详情，请参见下面的示例.

Explanation

If you want to preserve all of the properties of the original object in o then you need the explicit destructuring step in the body of your function: let { a: x } = o; but if you want to preserve only those properties that were not put into x then you may be able to use the destructuring as described below (in the future when it's supported). See Examples below for details.

请注意，我最初以为您要像对数组进行解构时那样进行解构-但这可能不是您想要的-感谢Karen Grigoryan在评论中指出了这一点.

Note that I originally assumed that you want destructuring as you would get when destructuring arrays - but maybe that's not what you want - thanks to Karen Grigoryan for pointing it out in the comments.

在逻辑上应该起作用的语法不是这样的:

A syntax that should logically work would be not this:

let f = (o: { a: x }) => {
    console.log(o);
    console.log(x);
};

但这:

let f = ({ a: x, ...o }) => {
    console.log(o);
    console.log(x);
};

(但是(如果)它可以在今天的任何平台上甚至在编译器中都可以使用，我(肯定)会感到惊讶.这将需要对rest运算符的支持，以进行对象解构，并结合从作为函数参数传递的对象中解压缩字段.从理论上讲，没有理由它应该不起作用.实际上，它可能不起作用.)

(But I would be (positively) surprised if that worked natively on any platform today or even in transpilers. This would need support for rest operator in object destructuring combined with unpacking fields from objects passed as function parameters. Theoretically there's no reason it shouldn't work. In practice it likely doesn't.)

请注意，当({ a: x, ...o }) => ...作为f({ a: 0, b: 1 })调用时，只会将{ b: 1 }放入o中，并且会将0放入x中-就像([x, ...a]) => ...当作为f([0, 1])调用时一样，只会放入{ b: 1 } c13>放在a中，并将0放在x中.

Note that ({ a: x, ...o }) => ... when invoked as f({ a: 0, b: 1 }) would put only { b: 1 } in o and would put 0 in x - just like ([x, ...a]) => ... when invoked as f([0, 1]) would put only [1] in a and would put 0 in x.

这意味着对对象和数组使用带有rest参数的结构化分解不会将整个数组或对象保留在rest变量中，而只会保留未明确捕获的数据.

This means that using destructuring with rest parameters - for objects and arrays alike - would not preserve the entire array or object in the rest variable but only that data that was not explicitly captured otherwise.

这意味着无论您要对数组或对象进行解构，如果要保留原始的数组或对象，都需要在函数主体中放置显式的解构步骤，而不是依赖于参数语法.

This means that no matter if you're destructuring arrays or objects, you need to put the explicit destructuring step in the body of your functions instead of relying on the parameter syntax if you want to have the original array or object intact.

请参阅:

在MDN上的
• Rest_in_Object_Destructuring
>

• Rest_in_Object_Destructuring on MDN

这篇关于在保留对象的同时取消函数调用中的分配的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！