you can understand that both state
and action
are structured into a new object, realizing the function of object merging. Note that it is shallow copy
. It has to be said that this feature is super easy to use
.
after reading this example, you should understand
var a = {name: 'a', age: '3'};
var b = {skill: 'swim'};
var c = {...a, ...b};
console.log(c);
// {name: "a", age: "3", skill: "swim"}
the first thing to say is return {.state, .action};
is not deconstruction.
this is called Spread syntax. He has a lot of uses!
Let's start with an example of an array:
function sum(x, y, z) {
return x + y + z;
}
const numbers = [1, 2, 3];
console.log(sum(...numbers));
// expected output: 6
console.log(sum.apply(null, numbers));
// expected output: 6
Let's give another object example:
var obj1 = { foo: 'bar', x: 42 };
var obj2 = { foo: 'baz', y: 13 };
const merge = ( ...objects ) => ( { ...objects } );
var mergedObj = merge ( obj1, obj2);
// Object { 0: { foo: 'bar', x: 42 }, 1: { foo: 'baz', y: 13 } }
var mergedObj = merge ( {}, obj1, obj2);
// Object { 0: {}, 1: { foo: 'bar', x: 42 }, 2: { foo: 'baz', y: 13 } }
what you are talking about is actually an example of this object.
if you still don't understand, you can think of it as Object.assign ({}, state, action);
).