我们应该在转换通用 json 响应时使用“any”吗

Question

我不确定在打字稿项目中为函数创建输入/输出中任何类型的函数是否好，以及如何在“严格类型检查”和“灵活性”之间取得平衡。

现在我正在尝试创建一个辅助函数来删除 graphQL 响应中的边和节点，以便在视图组件中更轻松地处理，举个例子：

// Input A
{
    "students": {
        "edges": [
            {
                "node": {
                    "name": "Peter",
                    "age": 12
                }
            },
            {
                "node": {
                    "name": "Mike",
                    "age": 12
                }
            }
        ]
    }
}

// Input B
{
    "teachers": {
        "edges": [
            {
                "node": {
                    "name": "Mary",
                    "age": 40
                }
            },
            {
                "node": {
                    "name": "John",
                    "age": 35
                }
            }
        ]
    }
}

我建议的辅助函数：

const simpleConnectionsHandler = (obj: any): any => {
// Some logic to remove edges and nodes
...
}

期待我能从函数中得到什么（输出）：

// Output A
{
    "students": [
        { "name": "Peter", "age": 12 },
        { "name": "Mike", "age": 12 }
    ]
}

// Output B
{
    "teachers": [
        { "name": "Mary", "age": 40 },
        { "name": "John", "age": 35 }
    ]
}

在我的视图组件中，我将采用这样的简化版响应：

const studentList: studentsSimplified = simpleConnectionsHandler(inputA); 
const teacherList: teachersSimplified = simpleConnectionsHandler(inputB);

我这样做的原因是，我想防止为响应json声明两种版本的类型，一种是带有边和节点的响应，一种是没有边和节点的响应。

我想知道接受输入为“any”并返回“any”作为输出是否好，当我在调用方返回结果时，我转换回响应的简化版本。

Answer 1

这就是泛型的用途。

const simpleConnectionsHandler = <T>(obj: any): T => {
// Some logic to remove edges and nodes
...
}

const studentList: studentsSimplified = simpleConnectionsHandler<studentsSimplified>(responseA); 
const teacherList: teachersSimplified = simpleConnectionsHandler<teachersSimplified>(responseB);

注意：您可以像这样隐含变量类型：

const studentList = simpleConnectionsHandler<studentsSimplified>(responseA); 
const teacherList = simpleConnectionsHandler<teachersSimplified>(responseB);

Answer 2

这似乎不是泛型的工作，因为您的所有类型都已明确定义。

我建议自己定义节点类型，然后将图形格式描述如下：

type MyNode = { name: string, age: number };
type graph = {
    [x: string]: {
        edges: Array<{
            node: MyNode
        }>
    }
};

function name(params: graph): { [x: string]: MyNode[] } {
    return {...}
}

用您拥有的任何已知密钥替换通用 [x: string]。

正如您在此代码片段中看到的，我已经描述了包含所有预期字段的整个输入，因此不仅仅是任何 js 对象都可以进入。

我已经定义了一种类型 MyNode，它可以用来组成图的其余部分，以及组成返回类型。

如果你甚至想限制[x: string] 可以变成什么，你可以在这里查看：
Typescript: How to use a generic parameter as object key

并实际编写一个通用函数来保证结果具有相同的键。

例如：

type knownKeys = 'teacher' | 'student';
type MyNode = { name: string, age: number };
type graph<T extends knownKeys> = {
    [x in T]: {
        edges: Array<{
            node: MyNode
        }>
    }
};

function myFunction<T extends knownKeys>(params: graph<T>): { [x in T]: MyNode[] } {
    return {}
}

// use
const a = myFunction<'teacher'>({
    teacher: {
        edges: [
            { node: { name: 'hi', age: 42, } },
        ],
    }
});