Typescript数组映射返回对象
我有以下代码Typescript数组映射返回对象,typescript,Typescript,我有以下代码 array.map(val => { return { key1: val.key1, key2: val.key2 }}); 有没有办法把代码简化成这样 array.map(val => { key1: val.key1, key2: val.key2 }); 如果将其放在括号中,编译器会将其视为对象文字而不是代码块: array.map(val => ({ key1: val.key1, key2: val.key2 })); 如
array.map(val => { return {
key1: val.key1,
key2: val.key2
}});
有没有办法把代码简化成这样
array.map(val => {
key1: val.key1,
key2: val.key2
});
如果将其放在括号中,编译器会将其视为对象文字而不是代码块:
array.map(val => ({
key1: val.key1,
key2: val.key2
}));
如果您有对象文字的接口(但不是类型安全的),类型断言也可以工作:
接口IKeys{key1:string;key2:string}
array.map(val=>{
键1:val.key1,
键2:val.key2
});
作为对@Titian Cernicova Dragomir答案的更新,值得一提的是(对于类型断言),在使用React的TSX(JSX)文件时特别有用,相当于
语法:
interface IKeys { key1: string; key2: string }
// notice the parentheses, to avoid confusion with a block scope
array.map(val => ({
key1: val.key1,
key2: val.key2
} as IKeys));
之所以引入它,是因为尖括号语法(
)是为组件/JSX元素保留的。如果使用React JSX编译器,请注意使用样式类型断言,因为它与JSX语法不明确,因此必须使用{…}作为IKeys转换语法。@guru\u florida您能解释更多吗?在=>
之后,{
总是被解释为一个代码块,没有例外。但是在=>
之后,我们可以有任何表达式,包括括号表达式(…)
,在这个新表达式中我们可以有一个对象文本,但是(…)
不会以任何其他方式改变对象表达式的含义。类型断言
提供了类似的功能,它将在=>
之后引入一种新的表达式类型,而不是始终表示代码块的{
。希望这能让它更清楚一点
interface IKeys { key1: string; key2: string }
// notice the parentheses, to avoid confusion with a block scope
array.map(val => ({
key1: val.key1,
key2: val.key2
} as IKeys));