首页 > 解决方案 > 基于Typescript中的参数返回具有键值对的对象

问题描述

我想创建一个循环遍历对象中的键/值对并返回具有相同键的对象的函数,但是每个值现在都变成了一个函数。我想确保打字稿正确掌握返回的对象以进行自动完成。这适用于以下愚蠢的功能:

interface Args {
  [layer: string]: Boolean
}

function sillyFunction<T extends Args>(layers: T): T {
  return layers
}

sillyFunction({ layerName: true }).layerName // this works

但是现在我有以下代码,其中层对象(键/布尔对)用于创建带有键/函数对的新 returnObject。:

interface Args {
  [layer: string]: Boolean
}

interface ReturnedObject {
  [layer: string]: Function
}

function createFunctions<T extends Args>(layers: T): T {
  let returnObj = {} as ReturnedObject;

  for (let layer in layers) {
    returnObj[layer] = (label) => `${layer} ${label}`
  }

  return returnObj;
}

createFunctions({ layerName: true }).layerName // doesnt work

这显然给了我错误'ReturnedObject' is not assignable to type T。我如何确保打字稿'理解'对象内的键仍然相同,但值已成为函数?

标签: typescript

解决方案


您需要使用映射类型转换T为具有相同属性但每个属性的类型不同的新类型。在这种情况下,预定义的类型Record会很好地工作,因为所有的键都将具有相同的类型。另外我会更具体地Function了解函数的类型,Functionany函数签名,它允许使用任何参数进行调用

interface Args {
  [layer: string]: boolean
}

type ReturnedObject<T> =  Record<keyof T, (label: string) => string>

function createFunctions<T extends Args>(layers: T): ReturnedObject<T> {
  let returnObj = {} as ReturnedObject<T>;

  for (let layer in layers) {
    returnObj[layer] = (label) => `${layer} ${label}`
  }

  return returnObj;
}

var l = createFunctions({ layerName: true })
l.layerName("") 

游乐场链接


推荐阅读