JS/TS中如何将Role数组映射转换为Option类型数组？

预先定义的类型、接口和测试数据如下：

• Option类型配置

type Option = {
  value: any,
  label: any
}

• Role接口定义

export interface Role {
  id: number
  name: string
}

• Role类型测试数组
  原代码中数组定义存在语法错误，类型标注后应使用等号赋值而非冒号，修正后写法：

const roles: Role[] = [
  {id:1,name:'name1'},
  {id:2,name:'name2'},
  {id:3,name:'name3'}
]

需求是将Role[]结构的数组转换为Option[]结构，对应Java中的实现逻辑为：

roles.stream().map(role->new Option(role.id,role.name)).collect(collectors.toList());

在JavaScript/TypeScript中可以直接调用数组原生的map方法完成转换，不需要额外的收集步骤，map执行后会直接返回字段映射完成的新数组，写法更简洁：

const options: Option[] = roles.map(role => ({
  value: role.id,
  label: role.name
}))

如果运行环境不支持ES6箭头函数语法，也可以使用普通函数写法：

var options = roles.map(function (role) {
  return {
    value: role.id,
    label: role.name
  }
})

最终得到的options变量就是符合Option[]类型要求的结果，和Java代码执行后的输出结构完全一致。

内容的提问来源于stack exchange，提问作者Navigator