8wDlpd.png
8wDFp9.png
8wDEOx.png
8wDMfH.png
8wDKte.png

如何推断对象的类型并使用 TypeScript 中泛型提供的类型来扩展它?

rerson 2月前

33 0

我正在尝试在 TypeScript 中创建一个函数,该函数以对象作为参数并推断其类型,然后将推断出的类型与通过泛型提供的另一种类型相结合。结果应该是...

我正在尝试在 TypeScript 中创建一个函数,该函数以对象为参数并推断其类型,然后将推断的类型与通过泛型提供的另一种类型相结合。结果应该是一个同时具有推断类型和泛型类型的属性的对象。

这是我想要实现的目标:

function addType<E extends object>(obj: any): // inferred object type + E {
  // Implementation
}

const x = addType<{ extraProp: number }>({ someProp: 1 });

// The type of x should be:
// {
//   someProp: number;
//   extraProp: number;
// }

目标是让 TypeScript 推断 obj 参数的类型(在本例中为 { someProp: number } ),然后将其与泛型类型合并 { extraProp: number } ,以便得到的类型为:

{
  someProp: number;
  extraProp: number;
}

但是,我希望通过仅提供一个类型参数(而不是两个)来实现这一点 { extraProp: number } 。我希望函数 obj 自动推断参数的类型。

我尝试过使用交叉类型、条件类型和其他方法,但我一直遇到 TypeScript 需要两个类型参数或无法正确推断类型的问题。

有没有办法在 TypeScript 中实现这一点,而无需手动指定推断类型?

帖子版权声明 1、本帖标题:如何推断对象的类型并使用 TypeScript 中泛型提供的类型来扩展它?
    本站网址:http://xjnalaquan.com/
2、本网站的资源部分来源于网络,如有侵权,请联系站长进行删除处理。
3、会员发帖仅代表会员个人观点,并不代表本站赞同其观点和对其真实性负责。
4、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
5、站长邮箱:yeweds@126.com 除非注明,本帖由rerson在本站《typescript》版块原创发布, 转载请注明出处!
最新回复 (0)
  • 用例是一个商店,其中部分状态在 PHP 服务器上定义,然后序列化到客户端,因此需要添加在服务器上初始化的状态的类型。最好的 DX 是,如果人们可以推断出在客户端声明的部分的类型,并且只键入在 PHP 中初始化的部分。

  • Taz 2月前 0 只看Ta
    引用 3

    感觉你可能将类型(编译时)与对象/值(运行时)混合在一起。如果你的函数只接受一个泛型参数,那么它必须是你想要推断的对象的一个​​。你没有为额外属性传递第二个参数。这意味着在函数内部,额外属性必须是硬编码的。如果是这种情况,那么你不需要对额外属性使用类型:

    function addType<T extends object>(obj: T) {
      return {
        ...obj,
        extraProp: 1
      }
    }
    
    const x = addType({ someProp: 1 });
    console.log(
      x.extraProp,  // OK
      x.someProp // OK
    );
    

    如果您想在运行时合并对象,您可以使用以下命令:

    function mergeFactory<T extends object> (extra: T) {
      return <T extends object> (obj: T) => {
        return {
        ...obj,
        ...extra
      }
      }
    }
    
    // Create a new function
    const addType = mergeFactory({ extraProp: 1 });
    
    
    // Use the new function
    const x = addType({ someProp: 1 });
    
    
    console.log(
      x.extraProp,  // OK
      x.someProp // OK
    );
    

    游乐场演示

    要合并类型,您可以使用 &

    type Extra = { extraProp: number };
    type Base = { someProp: number };
    
    type Merge = Extra & Base;
    
    // You can also use generics but is an overkill
    type GenericMerge<T1, T2> = T1 & T2;
    type Merge2 = GenericMerge<Extra, Base>;
    
  • (obj:T): T&E => obj 作为 T&E; } const x = addType<{ extraProp:number }>()({ someProp:1 });是的,我已经找到了柯里化函数的解决方案。不幸的是,它对我来说不起作用,因为 addType 函数不能是柯里化函数。 ts function addType() { 返回

  • 此外,对额外类型进行硬编码对我来说不起作用,因为这些类型是由开发人员定义的。最后,最后一个选项对我来说也不起作用,因为我想要的是让开发人员不必明确声明传递给函数的对象的类型。无论如何,谢谢!

  • 我认为您需要提供更多细节。显示 addType 的实现,还有谁实现了 addType?我只能看到 addType 以两种可能的方式工作:其中一个对象是硬编码的,或者两个对象都是参数。

  • 用例是一个商店,其中部分状态在 PHP 服务器上定义,然后序列化到客户端,因此需要添加在服务器上初始化的状态的类型。最好的 DX 是,如果人们可以推断出在客户端声明的部分的类型,并且只键入在 PHP 中初始化的部分。

  • DVL 2月前 0 只看Ta
    引用 8

    我不完全理解为什么你提到的高阶函数柯里化不起作用。据我所知,这似乎是一个很好的解决方案。对于 ts 它应该有效,还是你只是不想使用 hof?

返回
作者最近主题: