Define an array type in TypeScript
I'm using TypeScript for a project and there's a case where I need to use Promise.all(...), which is returning an array of many items:
Promise.all(
firstRequest,
secondRequest,
...,
nthRequest
)
.then((array : [FirstType, SecondType, ..., NthType]) => {
// do things with response
});
Now, since the type [FirstType, SecondType, ..., NthType] is too long to be defined there, I wanted to define it elsewhere and use it in that point.
So I tried:
export interface ResponseParams {
[0]: FirstType;
[1]: SecondType;
...
[n]: NthType;
}
And:
.then((array : ResponseParams) => {
// do things with response
});
But I receive this error:
Type 'ResponseParams' is not an array type.
How can I externalise the type and make my code cleaner?
Thank you
typescript
asked Nov 15 '18 at 16:50
Cristian TraìnaCristian Traìna
2,77011628
add a comment |
I'm using TypeScript for a project and there's a case where I need to use Promise.all(...), which is returning an array of many items:
Promise.all(
firstRequest,
secondRequest,
...,
nthRequest
)
.then((array : [FirstType, SecondType, ..., NthType]) => {
// do things with response
});
Now, since the type [FirstType, SecondType, ..., NthType] is too long to be defined there, I wanted to define it elsewhere and use it in that point.
So I tried:
export interface ResponseParams {
[0]: FirstType;
[1]: SecondType;
...
[n]: NthType;
}
And:
.then((array : ResponseParams) => {
// do things with response
});
But I receive this error:
Type 'ResponseParams' is not an array type.
How can I externalise the type and make my code cleaner?
Thank you
typescript
asked Nov 15 '18 at 16:50
Cristian TraìnaCristian Traìna
2,77011628
add a comment |
I'm using TypeScript for a project and there's a case where I need to use Promise.all(...), which is returning an array of many items:
Promise.all(
firstRequest,
secondRequest,
...,
nthRequest
)
.then((array : [FirstType, SecondType, ..., NthType]) => {
// do things with response
});
Now, since the type [FirstType, SecondType, ..., NthType] is too long to be defined there, I wanted to define it elsewhere and use it in that point.
So I tried:
export interface ResponseParams {
[0]: FirstType;
[1]: SecondType;
...
[n]: NthType;
}
And:
.then((array : ResponseParams) => {
// do things with response
});
But I receive this error:
Type 'ResponseParams' is not an array type.
How can I externalise the type and make my code cleaner?
Thank you
typescript
asked Nov 15 '18 at 16:50
Cristian TraìnaCristian Traìna
2,77011628
I'm using TypeScript for a project and there's a case where I need to use Promise.all(...), which is returning an array of many items:
Promise.all(
firstRequest,
secondRequest,
...,
nthRequest
)
.then((array : [FirstType, SecondType, ..., NthType]) => {
// do things with response
});
Now, since the type [FirstType, SecondType, ..., NthType] is too long to be defined there, I wanted to define it elsewhere and use it in that point.
So I tried:
export interface ResponseParams {
[0]: FirstType;
[1]: SecondType;
...
[n]: NthType;
}
And:
.then((array : ResponseParams) => {
// do things with response
});
But I receive this error:
Type 'ResponseParams' is not an array type.
How can I externalise the type and make my code cleaner?
Thank you
typescript
typescript
asked Nov 15 '18 at 16:50
Cristian TraìnaCristian Traìna
2,77011628
asked Nov 15 '18 at 16:50
Cristian TraìnaCristian Traìna
2,77011628
asked Nov 15 '18 at 16:50
Cristian TraìnaCristian Traìna
2,77011628
asked Nov 15 '18 at 16:50
Cristian TraìnaCristian Traìna
2,77011628
asked Nov 15 '18 at 16:50
Cristian TraìnaCristian Traìna
2,77011628
2,77011628
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
You can define such a type using a type alias:
type ResponseParams = [FirstType, SecondType, ..., NthType]
But I would point out that the type of array will be inferred without explicit type annotation (at least for up to 10 promises):
declare let firstRequest : Promise<{a: number}>
declare let secondRequest : Promise<{b: number}>
declare let nthRequest : Promise<{c: number}>
Promise.all([
firstRequest,
secondRequest,
nthRequest
])
.then((array) => { // array is of type [{a: number;}, {b: number;}, {c: number;}]
// do things with response
});
answered Nov 15 '18 at 16:54
Titian Cernicova-DragomirTitian Cernicova-Dragomir
69.8k34866
Thank you, I remembered something like this but I didn't find it googling. It can still be useful when thePromiseresolve type isn't defined and you want to keep the code cleaner (at least in my opinion)
– Cristian Traìna
Nov 15 '18 at 16:58
1
@CristianTraìna yeah, sure, it can be useful. I was just making sure you were aware that mostly it would not be necessary to spell out the types :)
– Titian Cernicova-Dragomir
Nov 15 '18 at 16:59
add a comment |
Promise.all accepts a generic T, which gives you full control over the return type. You can thereby define the tuple for each promise that you expect back while still maintaining the types.
I would do it this way using async / await syntax:
interface Foo {
gnarf: string;
}
interface Bar {
poit: string;
}
const createFoo = async (): Promise<Foo> => {
return {
gnarf: "random",
};
};
const createBar = async (): Promise<Bar> => {
return {
poit: "hurz",
};
};
const doStuff = async () => {
const [foo, bar] = await Promise.all<Foo, Bar>([createFoo(), createBar()]);
return `${foo.gnarf} and ${bar.poit}`;
};
doStuff().then(console.log).catch(console.error);
answered Nov 15 '18 at 17:00
k0pernikusk0pernikus
18.6k26112195
This is kinda too much boilerplate, but thank you
– Cristian Traìna
Nov 16 '18 at 19:24
@CristianTraìna Can you explicate why you think this is too much boilerplate?
– k0pernikus
Nov 19 '18 at 12:24
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
});
}
});
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%2f53324279%2fdefine-an-array-type-in-typescript%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
You can define such a type using a type alias:
type ResponseParams = [FirstType, SecondType, ..., NthType]
But I would point out that the type of array will be inferred without explicit type annotation (at least for up to 10 promises):
declare let firstRequest : Promise<{a: number}>
declare let secondRequest : Promise<{b: number}>
declare let nthRequest : Promise<{c: number}>
Promise.all([
firstRequest,
secondRequest,
nthRequest
])
.then((array) => { // array is of type [{a: number;}, {b: number;}, {c: number;}]
// do things with response
});
answered Nov 15 '18 at 16:54
Titian Cernicova-DragomirTitian Cernicova-Dragomir
69.8k34866
Thank you, I remembered something like this but I didn't find it googling. It can still be useful when thePromiseresolve type isn't defined and you want to keep the code cleaner (at least in my opinion)
– Cristian Traìna
Nov 15 '18 at 16:58
1
@CristianTraìna yeah, sure, it can be useful. I was just making sure you were aware that mostly it would not be necessary to spell out the types :)
– Titian Cernicova-Dragomir
Nov 15 '18 at 16:59
add a comment |
You can define such a type using a type alias:
type ResponseParams = [FirstType, SecondType, ..., NthType]
But I would point out that the type of array will be inferred without explicit type annotation (at least for up to 10 promises):
declare let firstRequest : Promise<{a: number}>
declare let secondRequest : Promise<{b: number}>
declare let nthRequest : Promise<{c: number}>
Promise.all([
firstRequest,
secondRequest,
nthRequest
])
.then((array) => { // array is of type [{a: number;}, {b: number;}, {c: number;}]
// do things with response
});
answered Nov 15 '18 at 16:54
Titian Cernicova-DragomirTitian Cernicova-Dragomir
69.8k34866
Thank you, I remembered something like this but I didn't find it googling. It can still be useful when thePromiseresolve type isn't defined and you want to keep the code cleaner (at least in my opinion)
– Cristian Traìna
Nov 15 '18 at 16:58
1
@CristianTraìna yeah, sure, it can be useful. I was just making sure you were aware that mostly it would not be necessary to spell out the types :)
– Titian Cernicova-Dragomir
Nov 15 '18 at 16:59
add a comment |
You can define such a type using a type alias:
type ResponseParams = [FirstType, SecondType, ..., NthType]
But I would point out that the type of array will be inferred without explicit type annotation (at least for up to 10 promises):
declare let firstRequest : Promise<{a: number}>
declare let secondRequest : Promise<{b: number}>
declare let nthRequest : Promise<{c: number}>
Promise.all([
firstRequest,
secondRequest,
nthRequest
])
.then((array) => { // array is of type [{a: number;}, {b: number;}, {c: number;}]
// do things with response
});
answered Nov 15 '18 at 16:54
Titian Cernicova-DragomirTitian Cernicova-Dragomir
69.8k34866
You can define such a type using a type alias:
type ResponseParams = [FirstType, SecondType, ..., NthType]
But I would point out that the type of array will be inferred without explicit type annotation (at least for up to 10 promises):
declare let firstRequest : Promise<{a: number}>
declare let secondRequest : Promise<{b: number}>
declare let nthRequest : Promise<{c: number}>
Promise.all([
firstRequest,
secondRequest,
nthRequest
])
.then((array) => { // array is of type [{a: number;}, {b: number;}, {c: number;}]
// do things with response
});
answered Nov 15 '18 at 16:54
Titian Cernicova-DragomirTitian Cernicova-Dragomir
69.8k34866
answered Nov 15 '18 at 16:54
Titian Cernicova-DragomirTitian Cernicova-Dragomir
69.8k34866
answered Nov 15 '18 at 16:54
Titian Cernicova-DragomirTitian Cernicova-Dragomir
69.8k34866
answered Nov 15 '18 at 16:54
Titian Cernicova-DragomirTitian Cernicova-Dragomir
69.8k34866
69.8k34866
Thank you, I remembered something like this but I didn't find it googling. It can still be useful when thePromiseresolve type isn't defined and you want to keep the code cleaner (at least in my opinion)
– Cristian Traìna
Nov 15 '18 at 16:58
1
@CristianTraìna yeah, sure, it can be useful. I was just making sure you were aware that mostly it would not be necessary to spell out the types :)
– Titian Cernicova-Dragomir
Nov 15 '18 at 16:59
add a comment |
Thank you, I remembered something like this but I didn't find it googling. It can still be useful when thePromiseresolve type isn't defined and you want to keep the code cleaner (at least in my opinion)
– Cristian Traìna
Nov 15 '18 at 16:58
1
@CristianTraìna yeah, sure, it can be useful. I was just making sure you were aware that mostly it would not be necessary to spell out the types :)
– Titian Cernicova-Dragomir
Nov 15 '18 at 16:59
Thank you, I remembered something like this but I didn't find it googling. It can still be useful when the
Promise resolve type isn't defined and you want to keep the code cleaner (at least in my opinion)– Cristian Traìna
Nov 15 '18 at 16:58
Thank you, I remembered something like this but I didn't find it googling. It can still be useful when the
Promise resolve type isn't defined and you want to keep the code cleaner (at least in my opinion)– Cristian Traìna
Nov 15 '18 at 16:58
1
1
@CristianTraìna yeah, sure, it can be useful. I was just making sure you were aware that mostly it would not be necessary to spell out the types :)
– Titian Cernicova-Dragomir
Nov 15 '18 at 16:59
@CristianTraìna yeah, sure, it can be useful. I was just making sure you were aware that mostly it would not be necessary to spell out the types :)
– Titian Cernicova-Dragomir
Nov 15 '18 at 16:59
add a comment |
Promise.all accepts a generic T, which gives you full control over the return type. You can thereby define the tuple for each promise that you expect back while still maintaining the types.
I would do it this way using async / await syntax:
interface Foo {
gnarf: string;
}
interface Bar {
poit: string;
}
const createFoo = async (): Promise<Foo> => {
return {
gnarf: "random",
};
};
const createBar = async (): Promise<Bar> => {
return {
poit: "hurz",
};
};
const doStuff = async () => {
const [foo, bar] = await Promise.all<Foo, Bar>([createFoo(), createBar()]);
return `${foo.gnarf} and ${bar.poit}`;
};
doStuff().then(console.log).catch(console.error);
answered Nov 15 '18 at 17:00
k0pernikusk0pernikus
18.6k26112195
This is kinda too much boilerplate, but thank you
– Cristian Traìna
Nov 16 '18 at 19:24
@CristianTraìna Can you explicate why you think this is too much boilerplate?
– k0pernikus
Nov 19 '18 at 12:24
add a comment |
Promise.all accepts a generic T, which gives you full control over the return type. You can thereby define the tuple for each promise that you expect back while still maintaining the types.
I would do it this way using async / await syntax:
interface Foo {
gnarf: string;
}
interface Bar {
poit: string;
}
const createFoo = async (): Promise<Foo> => {
return {
gnarf: "random",
};
};
const createBar = async (): Promise<Bar> => {
return {
poit: "hurz",
};
};
const doStuff = async () => {
const [foo, bar] = await Promise.all<Foo, Bar>([createFoo(), createBar()]);
return `${foo.gnarf} and ${bar.poit}`;
};
doStuff().then(console.log).catch(console.error);
answered Nov 15 '18 at 17:00
k0pernikusk0pernikus
18.6k26112195
This is kinda too much boilerplate, but thank you
– Cristian Traìna
Nov 16 '18 at 19:24
@CristianTraìna Can you explicate why you think this is too much boilerplate?
– k0pernikus
Nov 19 '18 at 12:24
add a comment |
Promise.all accepts a generic T, which gives you full control over the return type. You can thereby define the tuple for each promise that you expect back while still maintaining the types.
I would do it this way using async / await syntax:
interface Foo {
gnarf: string;
}
interface Bar {
poit: string;
}
const createFoo = async (): Promise<Foo> => {
return {
gnarf: "random",
};
};
const createBar = async (): Promise<Bar> => {
return {
poit: "hurz",
};
};
const doStuff = async () => {
const [foo, bar] = await Promise.all<Foo, Bar>([createFoo(), createBar()]);
return `${foo.gnarf} and ${bar.poit}`;
};
doStuff().then(console.log).catch(console.error);
answered Nov 15 '18 at 17:00
k0pernikusk0pernikus
18.6k26112195
Promise.all accepts a generic T, which gives you full control over the return type. You can thereby define the tuple for each promise that you expect back while still maintaining the types.
I would do it this way using async / await syntax:
interface Foo {
gnarf: string;
}
interface Bar {
poit: string;
}
const createFoo = async (): Promise<Foo> => {
return {
gnarf: "random",
};
};
const createBar = async (): Promise<Bar> => {
return {
poit: "hurz",
};
};
const doStuff = async () => {
const [foo, bar] = await Promise.all<Foo, Bar>([createFoo(), createBar()]);
return `${foo.gnarf} and ${bar.poit}`;
};
doStuff().then(console.log).catch(console.error);
answered Nov 15 '18 at 17:00
k0pernikusk0pernikus
18.6k26112195
answered Nov 15 '18 at 17:00
k0pernikusk0pernikus
18.6k26112195
answered Nov 15 '18 at 17:00
k0pernikusk0pernikus
18.6k26112195
answered Nov 15 '18 at 17:00
k0pernikusk0pernikus
18.6k26112195
18.6k26112195
This is kinda too much boilerplate, but thank you
– Cristian Traìna
Nov 16 '18 at 19:24
@CristianTraìna Can you explicate why you think this is too much boilerplate?
– k0pernikus
Nov 19 '18 at 12:24
add a comment |
This is kinda too much boilerplate, but thank you
– Cristian Traìna
Nov 16 '18 at 19:24
@CristianTraìna Can you explicate why you think this is too much boilerplate?
– k0pernikus
Nov 19 '18 at 12:24
This is kinda too much boilerplate, but thank you
– Cristian Traìna
Nov 16 '18 at 19:24
This is kinda too much boilerplate, but thank you
– Cristian Traìna
Nov 16 '18 at 19:24
@CristianTraìna Can you explicate why you think this is too much boilerplate?
– k0pernikus
Nov 19 '18 at 12:24
@CristianTraìna Can you explicate why you think this is too much boilerplate?
– k0pernikus
Nov 19 '18 at 12:24
add a comment |
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.
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%2f53324279%2fdefine-an-array-type-in-typescript%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
