Object destructuring for function calls
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
7
Is there a way to destructure a JS object in-place, instead of assigning the destructured variables to a scope?
Instead of doing this:
const { a, b, c } = obj;
someFunction(a, b, c);
I'd like to do this:
someFunction({a, b, c} from obj);
Or something functionally equivalent.
I'd like to do this in situations with these two stipulations:
I don't want to put the variable names into the enclosing scope.
I don't want to pass the whole object
obj, therefore making the spread operator not an option.
The only option I'm left with is to use
someFunction(obj.a, obj.b, obj.c);
Which is fine in this case, but can lower readability when obj is instead a long identifier.
Is something like this possible? I tried using assignment in an expression as a workaround, but my IDE complained that it could not find names a, b, and c:
someFunction({a, b, c} = obj);
javascript typescript function object ecmascript-6
edited Apr 21 at 3:19
Jack Bashford
18.8k51950
asked Apr 21 at 3:13
AnthonyMonterrosaAnthonyMonterrosa
908
add a comment |
7
Is there a way to destructure a JS object in-place, instead of assigning the destructured variables to a scope?
Instead of doing this:
const { a, b, c } = obj;
someFunction(a, b, c);
I'd like to do this:
someFunction({a, b, c} from obj);
Or something functionally equivalent.
I'd like to do this in situations with these two stipulations:
I don't want to put the variable names into the enclosing scope.
I don't want to pass the whole object
obj, therefore making the spread operator not an option.
The only option I'm left with is to use
someFunction(obj.a, obj.b, obj.c);
Which is fine in this case, but can lower readability when obj is instead a long identifier.
Is something like this possible? I tried using assignment in an expression as a workaround, but my IDE complained that it could not find names a, b, and c:
someFunction({a, b, c} = obj);
javascript typescript function object ecmascript-6
edited Apr 21 at 3:19
Jack Bashford
18.8k51950
asked Apr 21 at 3:13
AnthonyMonterrosaAnthonyMonterrosa
908
1
if you are targeting es6 environments you can define your function with a destructure parameter, egfunction f({a,b,c}){ /*...*/ }or would you not want that since you dont want to pass the whole object
– Patrick Evans
Apr 21 at 3:22
add a comment |
7
7
7
3
Is there a way to destructure a JS object in-place, instead of assigning the destructured variables to a scope?
Instead of doing this:
const { a, b, c } = obj;
someFunction(a, b, c);
I'd like to do this:
someFunction({a, b, c} from obj);
Or something functionally equivalent.
I'd like to do this in situations with these two stipulations:
I don't want to put the variable names into the enclosing scope.
I don't want to pass the whole object
obj, therefore making the spread operator not an option.
The only option I'm left with is to use
someFunction(obj.a, obj.b, obj.c);
Which is fine in this case, but can lower readability when obj is instead a long identifier.
Is something like this possible? I tried using assignment in an expression as a workaround, but my IDE complained that it could not find names a, b, and c:
someFunction({a, b, c} = obj);
javascript typescript function object ecmascript-6
edited Apr 21 at 3:19
Jack Bashford
18.8k51950
asked Apr 21 at 3:13
AnthonyMonterrosaAnthonyMonterrosa
908
Is there a way to destructure a JS object in-place, instead of assigning the destructured variables to a scope?
Instead of doing this:
const { a, b, c } = obj;
someFunction(a, b, c);
I'd like to do this:
someFunction({a, b, c} from obj);
Or something functionally equivalent.
I'd like to do this in situations with these two stipulations:
I don't want to put the variable names into the enclosing scope.
I don't want to pass the whole object
obj, therefore making the spread operator not an option.
The only option I'm left with is to use
someFunction(obj.a, obj.b, obj.c);
Which is fine in this case, but can lower readability when obj is instead a long identifier.
Is something like this possible? I tried using assignment in an expression as a workaround, but my IDE complained that it could not find names a, b, and c:
someFunction({a, b, c} = obj);
javascript typescript function object ecmascript-6
javascript typescript function object ecmascript-6
edited Apr 21 at 3:19
Jack Bashford
18.8k51950
asked Apr 21 at 3:13
AnthonyMonterrosaAnthonyMonterrosa
908
edited Apr 21 at 3:19
Jack Bashford
18.8k51950
asked Apr 21 at 3:13
AnthonyMonterrosaAnthonyMonterrosa
908
edited Apr 21 at 3:19
Jack Bashford
18.8k51950
edited Apr 21 at 3:19
Jack Bashford
18.8k51950
edited Apr 21 at 3:19
Jack Bashford
18.8k51950
18.8k51950
asked Apr 21 at 3:13
AnthonyMonterrosaAnthonyMonterrosa
908
asked Apr 21 at 3:13
AnthonyMonterrosaAnthonyMonterrosa
908
asked Apr 21 at 3:13
AnthonyMonterrosaAnthonyMonterrosa
908
908
1
if you are targeting es6 environments you can define your function with a destructure parameter, egfunction f({a,b,c}){ /*...*/ }or would you not want that since you dont want to pass the whole object
– Patrick Evans
Apr 21 at 3:22
add a comment |
1
if you are targeting es6 environments you can define your function with a destructure parameter, egfunction f({a,b,c}){ /*...*/ }or would you not want that since you dont want to pass the whole object
– Patrick Evans
Apr 21 at 3:22
1
1
if you are targeting es6 environments you can define your function with a destructure parameter, eg
function f({a,b,c}){ /*...*/ } or would you not want that since you dont want to pass the whole object– Patrick Evans
Apr 21 at 3:22
if you are targeting es6 environments you can define your function with a destructure parameter, eg
function f({a,b,c}){ /*...*/ } or would you not want that since you dont want to pass the whole object– Patrick Evans
Apr 21 at 3:22
add a comment |
3 Answers
3
active
oldest
votes
6
One option is to use .map to extract the value of each property you want, and spread it into the argument list:
someFunction(
...['a', 'b', 'c'].map(prop => obj[prop])
);
Destructuring requires the creation of intermediate variables, unfortunately, which you don't want.
answered Apr 21 at 3:15
CertainPerformanceCertainPerformance
102k166393
It is unfortunate that the intermediate is required, as it's just a needless performance penalty in some situations (like mine). As for your proposition, I like that it scales better thanobj.property, but it's still quite verbose :/ enough so that I'm sure I couldn't throw it into production code without it failing code review.
– AnthonyMonterrosa
Apr 21 at 3:19
4
Performance is rarely something to worry about - code readability matters more in 99% of situations, and if you want to keep the code DRY and want to be able to use the pattern for any number of properties, I'm pretty sure this is the best pattern you'll be able to find. If this fails code review because it's too verbose, I think that's an indicator that there's an issue with code review, rather than an issue with the code here
– CertainPerformance
Apr 21 at 3:22
I agree with all of your statements, especially the last one (but sadly my opinion does not outweigh tradition). Maybe I should give it a go and see what happens.
– AnthonyMonterrosa
Apr 21 at 3:35
add a comment |
3
An IIFE should work:
((({ a, b, c }) => someFunction(a, b, c))(obj);
answered Apr 21 at 3:16
Jack BashfordJack Bashford
18.8k51950
I like that this works, but I dislike the performance penalty of making a function whenever I need to callsomeFunction. Also, akin to the other answer, this is unusual-enough looking that I don't think it'd pass code review :/.
– AnthonyMonterrosa
Apr 21 at 3:20
add a comment |
1
This how I'd do it:
function foo( { x, y } ) {
console.log( x, y );
}
foo( { y: 1, x: 2 } ); // 2 1As for the OP's specific request to not pass the whole object (or declare variables in the global scope). Destructuring the object to block-scoped variables would be the best way IMHO.
const obj = { x: 1, y: 2 }
function foo( x, y ) {
console.log( x, y );
}
{ let { x, y } = obj;
foo( x, y ); // 1 2
}
console.log(x) // "ReferenceError: x is not definedanswered Apr 21 at 3:31
Khalid AliKhalid Ali
74611
New contributor
Khalid Ali is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Can you explain how this resolves my issue? I don't see a strong relation.
– AnthonyMonterrosa
Apr 21 at 3:36
1
You pass an object as an argument and destruct it as function parameters. I know that you've said that you don't want to pass the whole object as argument, still this's my recommendation.
– Khalid Ali
Apr 21 at 3:46
1
Right, but this means I'd have to be the one writing the function. Great for my own code, but there are many situations where I don't have control over the function's parameters e.g. libraries, or most cost when coding for a company.
– AnthonyMonterrosa
Apr 21 at 5:07
1
@@AnthonyMonterrosa if it's such a big issue, I would use this style as a wrapper function to your library call, egfunction wrapLib({x, y}) { return library.expensiveCall(x,y)}. If the situation calls for it, the result can be cached. Alternatively, the TC39 are always looking for unique improvements to JS.
– jayands
Apr 21 at 11:51
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55779556%2fobject-destructuring-for-function-calls%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
3 Answers
3
active
oldest
votes
3 Answers
3
active
oldest
votes
active
oldest
votes
active
oldest
votes
6
One option is to use .map to extract the value of each property you want, and spread it into the argument list:
someFunction(
...['a', 'b', 'c'].map(prop => obj[prop])
);
Destructuring requires the creation of intermediate variables, unfortunately, which you don't want.
answered Apr 21 at 3:15
CertainPerformanceCertainPerformance
102k166393
It is unfortunate that the intermediate is required, as it's just a needless performance penalty in some situations (like mine). As for your proposition, I like that it scales better thanobj.property, but it's still quite verbose :/ enough so that I'm sure I couldn't throw it into production code without it failing code review.
– AnthonyMonterrosa
Apr 21 at 3:19
4
Performance is rarely something to worry about - code readability matters more in 99% of situations, and if you want to keep the code DRY and want to be able to use the pattern for any number of properties, I'm pretty sure this is the best pattern you'll be able to find. If this fails code review because it's too verbose, I think that's an indicator that there's an issue with code review, rather than an issue with the code here
– CertainPerformance
Apr 21 at 3:22
I agree with all of your statements, especially the last one (but sadly my opinion does not outweigh tradition). Maybe I should give it a go and see what happens.
– AnthonyMonterrosa
Apr 21 at 3:35
add a comment |
6
One option is to use .map to extract the value of each property you want, and spread it into the argument list:
someFunction(
...['a', 'b', 'c'].map(prop => obj[prop])
);
Destructuring requires the creation of intermediate variables, unfortunately, which you don't want.
answered Apr 21 at 3:15
CertainPerformanceCertainPerformance
102k166393
It is unfortunate that the intermediate is required, as it's just a needless performance penalty in some situations (like mine). As for your proposition, I like that it scales better thanobj.property, but it's still quite verbose :/ enough so that I'm sure I couldn't throw it into production code without it failing code review.
– AnthonyMonterrosa
Apr 21 at 3:19
4
Performance is rarely something to worry about - code readability matters more in 99% of situations, and if you want to keep the code DRY and want to be able to use the pattern for any number of properties, I'm pretty sure this is the best pattern you'll be able to find. If this fails code review because it's too verbose, I think that's an indicator that there's an issue with code review, rather than an issue with the code here
– CertainPerformance
Apr 21 at 3:22
I agree with all of your statements, especially the last one (but sadly my opinion does not outweigh tradition). Maybe I should give it a go and see what happens.
– AnthonyMonterrosa
Apr 21 at 3:35
add a comment |
6
6
6
One option is to use .map to extract the value of each property you want, and spread it into the argument list:
someFunction(
...['a', 'b', 'c'].map(prop => obj[prop])
);
Destructuring requires the creation of intermediate variables, unfortunately, which you don't want.
answered Apr 21 at 3:15
CertainPerformanceCertainPerformance
102k166393
One option is to use .map to extract the value of each property you want, and spread it into the argument list:
someFunction(
...['a', 'b', 'c'].map(prop => obj[prop])
);
Destructuring requires the creation of intermediate variables, unfortunately, which you don't want.
answered Apr 21 at 3:15
CertainPerformanceCertainPerformance
102k166393
answered Apr 21 at 3:15
CertainPerformanceCertainPerformance
102k166393
answered Apr 21 at 3:15
CertainPerformanceCertainPerformance
102k166393
answered Apr 21 at 3:15
CertainPerformanceCertainPerformance
102k166393
102k166393
It is unfortunate that the intermediate is required, as it's just a needless performance penalty in some situations (like mine). As for your proposition, I like that it scales better thanobj.property, but it's still quite verbose :/ enough so that I'm sure I couldn't throw it into production code without it failing code review.
– AnthonyMonterrosa
Apr 21 at 3:19
4
Performance is rarely something to worry about - code readability matters more in 99% of situations, and if you want to keep the code DRY and want to be able to use the pattern for any number of properties, I'm pretty sure this is the best pattern you'll be able to find. If this fails code review because it's too verbose, I think that's an indicator that there's an issue with code review, rather than an issue with the code here
– CertainPerformance
Apr 21 at 3:22
I agree with all of your statements, especially the last one (but sadly my opinion does not outweigh tradition). Maybe I should give it a go and see what happens.
– AnthonyMonterrosa
Apr 21 at 3:35
add a comment |
It is unfortunate that the intermediate is required, as it's just a needless performance penalty in some situations (like mine). As for your proposition, I like that it scales better thanobj.property, but it's still quite verbose :/ enough so that I'm sure I couldn't throw it into production code without it failing code review.
– AnthonyMonterrosa
Apr 21 at 3:19
4
Performance is rarely something to worry about - code readability matters more in 99% of situations, and if you want to keep the code DRY and want to be able to use the pattern for any number of properties, I'm pretty sure this is the best pattern you'll be able to find. If this fails code review because it's too verbose, I think that's an indicator that there's an issue with code review, rather than an issue with the code here
– CertainPerformance
Apr 21 at 3:22
I agree with all of your statements, especially the last one (but sadly my opinion does not outweigh tradition). Maybe I should give it a go and see what happens.
– AnthonyMonterrosa
Apr 21 at 3:35
It is unfortunate that the intermediate is required, as it's just a needless performance penalty in some situations (like mine). As for your proposition, I like that it scales better than
obj.property, but it's still quite verbose :/ enough so that I'm sure I couldn't throw it into production code without it failing code review.– AnthonyMonterrosa
Apr 21 at 3:19
It is unfortunate that the intermediate is required, as it's just a needless performance penalty in some situations (like mine). As for your proposition, I like that it scales better than
obj.property, but it's still quite verbose :/ enough so that I'm sure I couldn't throw it into production code without it failing code review.– AnthonyMonterrosa
Apr 21 at 3:19
4
4
Performance is rarely something to worry about - code readability matters more in 99% of situations, and if you want to keep the code DRY and want to be able to use the pattern for any number of properties, I'm pretty sure this is the best pattern you'll be able to find. If this fails code review because it's too verbose, I think that's an indicator that there's an issue with code review, rather than an issue with the code here
– CertainPerformance
Apr 21 at 3:22
Performance is rarely something to worry about - code readability matters more in 99% of situations, and if you want to keep the code DRY and want to be able to use the pattern for any number of properties, I'm pretty sure this is the best pattern you'll be able to find. If this fails code review because it's too verbose, I think that's an indicator that there's an issue with code review, rather than an issue with the code here
– CertainPerformance
Apr 21 at 3:22
I agree with all of your statements, especially the last one (but sadly my opinion does not outweigh tradition). Maybe I should give it a go and see what happens.
– AnthonyMonterrosa
Apr 21 at 3:35
I agree with all of your statements, especially the last one (but sadly my opinion does not outweigh tradition). Maybe I should give it a go and see what happens.
– AnthonyMonterrosa
Apr 21 at 3:35
add a comment |
3
An IIFE should work:
((({ a, b, c }) => someFunction(a, b, c))(obj);
answered Apr 21 at 3:16
Jack BashfordJack Bashford
18.8k51950
I like that this works, but I dislike the performance penalty of making a function whenever I need to callsomeFunction. Also, akin to the other answer, this is unusual-enough looking that I don't think it'd pass code review :/.
– AnthonyMonterrosa
Apr 21 at 3:20
add a comment |
3
An IIFE should work:
((({ a, b, c }) => someFunction(a, b, c))(obj);
answered Apr 21 at 3:16
Jack BashfordJack Bashford
18.8k51950
I like that this works, but I dislike the performance penalty of making a function whenever I need to callsomeFunction. Also, akin to the other answer, this is unusual-enough looking that I don't think it'd pass code review :/.
– AnthonyMonterrosa
Apr 21 at 3:20
add a comment |
3
3
3
An IIFE should work:
((({ a, b, c }) => someFunction(a, b, c))(obj);
answered Apr 21 at 3:16
Jack BashfordJack Bashford
18.8k51950
An IIFE should work:
((({ a, b, c }) => someFunction(a, b, c))(obj);
answered Apr 21 at 3:16
Jack BashfordJack Bashford
18.8k51950
answered Apr 21 at 3:16
Jack BashfordJack Bashford
18.8k51950
answered Apr 21 at 3:16
Jack BashfordJack Bashford
18.8k51950
answered Apr 21 at 3:16
Jack BashfordJack Bashford
18.8k51950
18.8k51950
I like that this works, but I dislike the performance penalty of making a function whenever I need to callsomeFunction. Also, akin to the other answer, this is unusual-enough looking that I don't think it'd pass code review :/.
– AnthonyMonterrosa
Apr 21 at 3:20
add a comment |
I like that this works, but I dislike the performance penalty of making a function whenever I need to callsomeFunction. Also, akin to the other answer, this is unusual-enough looking that I don't think it'd pass code review :/.
– AnthonyMonterrosa
Apr 21 at 3:20
I like that this works, but I dislike the performance penalty of making a function whenever I need to call
someFunction. Also, akin to the other answer, this is unusual-enough looking that I don't think it'd pass code review :/.– AnthonyMonterrosa
Apr 21 at 3:20
I like that this works, but I dislike the performance penalty of making a function whenever I need to call
someFunction. Also, akin to the other answer, this is unusual-enough looking that I don't think it'd pass code review :/.– AnthonyMonterrosa
Apr 21 at 3:20
add a comment |
1
This how I'd do it:
function foo( { x, y } ) {
console.log( x, y );
}
foo( { y: 1, x: 2 } ); // 2 1As for the OP's specific request to not pass the whole object (or declare variables in the global scope). Destructuring the object to block-scoped variables would be the best way IMHO.
const obj = { x: 1, y: 2 }
function foo( x, y ) {
console.log( x, y );
}
{ let { x, y } = obj;
foo( x, y ); // 1 2
}
console.log(x) // "ReferenceError: x is not definedanswered Apr 21 at 3:31
Khalid AliKhalid Ali
74611
New contributor
Khalid Ali is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Can you explain how this resolves my issue? I don't see a strong relation.
– AnthonyMonterrosa
Apr 21 at 3:36
1
You pass an object as an argument and destruct it as function parameters. I know that you've said that you don't want to pass the whole object as argument, still this's my recommendation.
– Khalid Ali
Apr 21 at 3:46
1
Right, but this means I'd have to be the one writing the function. Great for my own code, but there are many situations where I don't have control over the function's parameters e.g. libraries, or most cost when coding for a company.
– AnthonyMonterrosa
Apr 21 at 5:07
1
@@AnthonyMonterrosa if it's such a big issue, I would use this style as a wrapper function to your library call, egfunction wrapLib({x, y}) { return library.expensiveCall(x,y)}. If the situation calls for it, the result can be cached. Alternatively, the TC39 are always looking for unique improvements to JS.
– jayands
Apr 21 at 11:51
add a comment |
1
This how I'd do it:
function foo( { x, y } ) {
console.log( x, y );
}
foo( { y: 1, x: 2 } ); // 2 1As for the OP's specific request to not pass the whole object (or declare variables in the global scope). Destructuring the object to block-scoped variables would be the best way IMHO.
const obj = { x: 1, y: 2 }
function foo( x, y ) {
console.log( x, y );
}
{ let { x, y } = obj;
foo( x, y ); // 1 2
}
console.log(x) // "ReferenceError: x is not definedanswered Apr 21 at 3:31
Khalid AliKhalid Ali
74611
New contributor
Khalid Ali is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Can you explain how this resolves my issue? I don't see a strong relation.
– AnthonyMonterrosa
Apr 21 at 3:36
1
You pass an object as an argument and destruct it as function parameters. I know that you've said that you don't want to pass the whole object as argument, still this's my recommendation.
– Khalid Ali
Apr 21 at 3:46
1
Right, but this means I'd have to be the one writing the function. Great for my own code, but there are many situations where I don't have control over the function's parameters e.g. libraries, or most cost when coding for a company.
– AnthonyMonterrosa
Apr 21 at 5:07
1
@@AnthonyMonterrosa if it's such a big issue, I would use this style as a wrapper function to your library call, egfunction wrapLib({x, y}) { return library.expensiveCall(x,y)}. If the situation calls for it, the result can be cached. Alternatively, the TC39 are always looking for unique improvements to JS.
– jayands
Apr 21 at 11:51
add a comment |
1
1
1
This how I'd do it:
function foo( { x, y } ) {
console.log( x, y );
}
foo( { y: 1, x: 2 } ); // 2 1As for the OP's specific request to not pass the whole object (or declare variables in the global scope). Destructuring the object to block-scoped variables would be the best way IMHO.
const obj = { x: 1, y: 2 }
function foo( x, y ) {
console.log( x, y );
}
{ let { x, y } = obj;
foo( x, y ); // 1 2
}
console.log(x) // "ReferenceError: x is not definedanswered Apr 21 at 3:31
Khalid AliKhalid Ali
74611
New contributor
Khalid Ali is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
This how I'd do it:
function foo( { x, y } ) {
console.log( x, y );
}
foo( { y: 1, x: 2 } ); // 2 1As for the OP's specific request to not pass the whole object (or declare variables in the global scope). Destructuring the object to block-scoped variables would be the best way IMHO.
const obj = { x: 1, y: 2 }
function foo( x, y ) {
console.log( x, y );
}
{ let { x, y } = obj;
foo( x, y ); // 1 2
}
console.log(x) // "ReferenceError: x is not definedfunction foo( { x, y } ) {
console.log( x, y );
}
foo( { y: 1, x: 2 } ); // 2 1function foo( { x, y } ) {
console.log( x, y );
}
foo( { y: 1, x: 2 } ); // 2 1const obj = { x: 1, y: 2 }
function foo( x, y ) {
console.log( x, y );
}
{ let { x, y } = obj;
foo( x, y ); // 1 2
}
console.log(x) // "ReferenceError: x is not definedconst obj = { x: 1, y: 2 }
function foo( x, y ) {
console.log( x, y );
}
{ let { x, y } = obj;
foo( x, y ); // 1 2
}
console.log(x) // "ReferenceError: x is not definedanswered Apr 21 at 3:31
Khalid AliKhalid Ali
74611
New contributor
Khalid Ali is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
edited Apr 21 at 16:12
answered Apr 21 at 3:31
Khalid AliKhalid Ali
74611
New contributor
Khalid Ali is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
answered Apr 21 at 3:31
Khalid AliKhalid Ali
74611
answered Apr 21 at 3:31
Khalid AliKhalid Ali
74611
74611
New contributor
Khalid Ali is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
New contributor
Khalid Ali is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Khalid Ali is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Can you explain how this resolves my issue? I don't see a strong relation.
– AnthonyMonterrosa
Apr 21 at 3:36
1
You pass an object as an argument and destruct it as function parameters. I know that you've said that you don't want to pass the whole object as argument, still this's my recommendation.
– Khalid Ali
Apr 21 at 3:46
1
Right, but this means I'd have to be the one writing the function. Great for my own code, but there are many situations where I don't have control over the function's parameters e.g. libraries, or most cost when coding for a company.
– AnthonyMonterrosa
Apr 21 at 5:07
1
@@AnthonyMonterrosa if it's such a big issue, I would use this style as a wrapper function to your library call, egfunction wrapLib({x, y}) { return library.expensiveCall(x,y)}. If the situation calls for it, the result can be cached. Alternatively, the TC39 are always looking for unique improvements to JS.
– jayands
Apr 21 at 11:51
add a comment |
Can you explain how this resolves my issue? I don't see a strong relation.
– AnthonyMonterrosa
Apr 21 at 3:36
1
You pass an object as an argument and destruct it as function parameters. I know that you've said that you don't want to pass the whole object as argument, still this's my recommendation.
– Khalid Ali
Apr 21 at 3:46
1
Right, but this means I'd have to be the one writing the function. Great for my own code, but there are many situations where I don't have control over the function's parameters e.g. libraries, or most cost when coding for a company.
– AnthonyMonterrosa
Apr 21 at 5:07
1
@@AnthonyMonterrosa if it's such a big issue, I would use this style as a wrapper function to your library call, egfunction wrapLib({x, y}) { return library.expensiveCall(x,y)}. If the situation calls for it, the result can be cached. Alternatively, the TC39 are always looking for unique improvements to JS.
– jayands
Apr 21 at 11:51
Can you explain how this resolves my issue? I don't see a strong relation.
– AnthonyMonterrosa
Apr 21 at 3:36
Can you explain how this resolves my issue? I don't see a strong relation.
– AnthonyMonterrosa
Apr 21 at 3:36
1
1
You pass an object as an argument and destruct it as function parameters. I know that you've said that you don't want to pass the whole object as argument, still this's my recommendation.
– Khalid Ali
Apr 21 at 3:46
You pass an object as an argument and destruct it as function parameters. I know that you've said that you don't want to pass the whole object as argument, still this's my recommendation.
– Khalid Ali
Apr 21 at 3:46
1
1
Right, but this means I'd have to be the one writing the function. Great for my own code, but there are many situations where I don't have control over the function's parameters e.g. libraries, or most cost when coding for a company.
– AnthonyMonterrosa
Apr 21 at 5:07
Right, but this means I'd have to be the one writing the function. Great for my own code, but there are many situations where I don't have control over the function's parameters e.g. libraries, or most cost when coding for a company.
– AnthonyMonterrosa
Apr 21 at 5:07
1
1
@@AnthonyMonterrosa if it's such a big issue, I would use this style as a wrapper function to your library call, eg
function wrapLib({x, y}) { return library.expensiveCall(x,y)}. If the situation calls for it, the result can be cached. Alternatively, the TC39 are always looking for unique improvements to JS.– jayands
Apr 21 at 11:51
@@AnthonyMonterrosa if it's such a big issue, I would use this style as a wrapper function to your library call, eg
function wrapLib({x, y}) { return library.expensiveCall(x,y)}. If the situation calls for it, the result can be cached. Alternatively, the TC39 are always looking for unique improvements to JS.– jayands
Apr 21 at 11:51
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55779556%2fobject-destructuring-for-function-calls%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
if you are targeting es6 environments you can define your function with a destructure parameter, eg
function f({a,b,c}){ /*...*/ }or would you not want that since you dont want to pass the whole object– Patrick Evans
Apr 21 at 3:22