我如何使用TypeScript泛型函数，可以返回对象或数组?

Question

类似于对象类型为'unknown'Typescript泛型，但问题中没有指定返回类型。

我有一些现有的工作JS代码，使用经典的JSON.parse(JSON.stringify())技术来克隆对象。

当我第一次将它转换为TS时，我使用Record<string, unknown>指定它将返回一个具有字符串键和未知值的对象。

const deepClone = (
object: Record<string, unknown> 
): Record<string, unknown> => {
return JSON.parse(JSON.stringify(object));
};

这很好。但后来我意识到这个函数需要接受和返回数组，所以我添加了:

const deepClone = (
object: Record<string, unknown> | Array<unknown>
): Record<string, unknown> | Array<unknown> => {
return JSON.parse(JSON.stringify(object));
};

但是这个没有通过测试:

describe(`deepClone`, () => {
it(`Deep clones object`, () => {
const names = ["frank"];
const original = { names };
const clone = deepClone(original);
names.push("nancy");
expect(clone.names).toEqual(["frank"]);
});
});

Property 'names' does not exist on type 'unknown[]'.

我明白了错误-数组不能有属性'names'，尽管对象可以。

调用泛型!遵循泛型文档

const deepClone = <Type>(
object: Record<string, unknown> | Array<unknown>
): Type => {
return JSON.parse(JSON.stringify(object));
};

但是使用

仍然失败

error TS2571: Object is of type 'unknown'.

我如何使用TypeScript泛型函数，可以返回对象或数组?

Answer 1

也许我错过了一些东西，但我认为这只是定义一个泛型T和使用T函数参数以及返回值的问题:

const deepClone = <T extends Record<string, unknown> | Array<unknown>>
(object: T): T => {

return JSON.parse(JSON.stringify(object));
};
const object = deepClone({a: 1});
const array = deepClone(['a', 1]);