TypeScript如何从顺序匹配接口属性的数组创建对应类型对象

方案1：数组解构直接构造（日常开发首选，代码最简洁） #

你不需要先创建带初始值的空对象再逐个赋值，利用ES的数组解构+对象属性简写，可以一次性完成对象构造，可读性和简洁度都更高：

const singleRow = rows[0];
// 按数组顺序解构出对应值，注意materialnumber是number类型，需要把数组里的字符串转成数字
const [numStr, type, materialclass] = singleRow;
const newBD: Basicdata = {
  materialnumber: Number(numStr),
  type,
  materialclass
};

如果属性少的话，甚至不需要单独写解构变量，直接按索引取值构造对象即可，代码量比你原来的写法少60%以上。 #

方案2：reduce通用转换（适合属性多、需要批量转换的场景） #

TypeScript的interface是编译时类型，运行时会被完全擦除，无法直接读取接口定义的属性顺序，所以你可以先维护一个和接口属性顺序严格一致的键名数组，再用reduce拼装对象，后续如果接口字段有调整，只需要同步修改这个键数组即可：

// 键的顺序必须和Basicdata接口属性、输入数组的顺序完全对应
const BD_FIELDS: (keyof Basicdata)[] = ['materialnumber', 'type', 'materialclass'];

const singleRow = rows[0];
const newBD = BD_FIELDS.reduce((result, field, index) => {
  const rawValue = singleRow[index];
  // 对类型不匹配的字段做转换
  result[field] = field === 'materialnumber' ? Number(rawValue) : rawValue;
  return result;
}, {} as Basicdata);

如果需要把整个rows数组批量转成Basicdata[]类型，直接在外层套map即可：

const bdList: Basicdata[] = rows.map(row => {
  return BD_FIELDS.reduce((result, field, index) => {
    result[field] = field === 'materialnumber' ? Number(row[index]) : row[index];
    return result;
  }, {} as Basicdata);
});

注意点：你给出的示例数组中materialnumber的原始值是字符串类型，但接口定义该字段为number类型，无论使用哪种方案，都需要做显式类型转换，否则会触发TS类型校验错误，运行时也可能出现隐式类型转换导致的bug。

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