小编neg*_*yxo的帖子

函数参数的打字稿通用约束

编辑: 将接口中的“测试”修复为“约束”

我无法理解通用约束在 Typescript 中的工作原理。我正在使用 React/Redux,您可以在其中找到与此类似的构造:

interface SomeConstraint { constraint: any }
type SomeType<T> = <A extends SomeConstraint>(item: T, action: A) => void;
Run Code Online (Sandbox Code Playgroud)

正如您所看到的,这是一个带有通用参数和一些约束的函数定义。现在,当我想使用它时,我可以编写以下内容:

interface Test { constraint: string }
const some : SomeType<string> = (s: string, c: Test ) => {}
Run Code Online (Sandbox Code Playgroud)

这很好用,但是当我想扩展测试接口时(我们称之为 TestWithData):

interface TestWithData  { constraint: string, payload: any }
const some : SomeType<string> = (s: string, c: TestWithData ) => {}
Run Code Online (Sandbox Code Playgroud)

我收到编译时错误:

错误 TS2322:类型 '(s: string, c: TestWithData) => void' 不可分配给类型 'SomeType'。参数“c”和“action”的类型不兼容。类型“A”不可分配给类型“TestWithData”。类型“SomeConstraint”不可分配给类型“TestWithData”。“SomeConstraint”类型中缺少属性“test”。

我缺少什么?


已编辑

正如我所说,我在 redux 类型中发现了这个(类似的)构造。你可以找到这个定义(redux“3.7.2”): …

typescript

6
推荐指数
1
解决办法
2万
查看次数

Visual Studio 2017 和 webpack 打字稿错误

使用 webpack 构建时,Visual Studio 有没有办法知道打字稿错误?目前,对于 .NET Core 2.0 和 Angular 2 的最新 SPA 模板,webpack 用于构建 typescript 文件,这很好用,除了现在所有编译时错误(typescript 错误)都显示在浏览器中,与标准构建流程形成鲜明对比,其中编译时错误显示在“错误列表”窗口中 - 恕我直言,这要好得多,因为我不需要手动定位构建错误,我需要做的就是双击。

编辑

由于有些人认为这个问题很有用,让我更新这个问题并实际给出答案。目前(截至 2018 年 3 月 6 日)Visual Studio 有点过时恕我直言(用于 SPA 应用程序)。现在使用 Visual Studio Code 更有意义,并且有一个终端窗口可用于检查构建错误(打开 webpack-devServer 和热构建/自动保存功能)。

visual-studio webpack angular

5
推荐指数
0
解决办法
133
查看次数

打字稿中的抽象函数返回类型

似乎用 typescript 定义一个具有泛型返回类型的抽象函数是不可能的(我使用的是 ts 3.2.4)或者我遗漏了一些东西。

例如:

abstract class Foo {
    abstract func<T>() : T;
}

class Bazz extends Foo {
    func() { return 1; }
}
Run Code Online (Sandbox Code Playgroud)

会报错:

TS2416:“Bazz”类型中的属性“func”不能分配给基本类型“Foo”中的相同属性。类型 '() => number' 不能分配给类型 '() => T'。“数字”类型不能分配给“T”类型。

那么,是否可以定义一个具有泛型返回类型的抽象函数?

编辑:

因此,事实证明,按预期使用未知工作,它可以用作抽象函数中的返回类型。但是,让我们考虑一下:

abstract class Foo{
    getFuncResult() {
        return this.func();
    }
    abstract func() : unknown;
}

class Bazz extends Foo {
    func() { return 1; }
}

let foo: Foo = new Bazz();
foo.func(); // unknown

let bazz = new Bazz() 
bazz.func() // number
bazz.getFuncResult() …
Run Code Online (Sandbox Code Playgroud)

typescript

4
推荐指数
1
解决办法
2677
查看次数

标签 统计

typescript ×2

angular ×1

visual-studio ×1

webpack ×1