You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

能否将指定TypeScript类型定义转换为对象字面量?

可以实现TypeScript类型到指定对象字面量的转换

当然可以实现这种转换,下面提供几种实用方案:

1. 手动同步(适合简单固定场景)

如果类型结构不常变化,直接根据TypeScript类型定义写出对应的对象字面量即可,这是最直接的方式:

type OutlinedButtonProps = {
  fill: 'outlined';
  color?: 'primary' | 'danger' | 'neutral';
};

const outlinedButtonProps = {
  fill: ['outlined'],
  color: ['primary', 'danger', 'neutral']
};

优点是简单直接,缺点是类型更新时需要手动同步对象内容,容易出现不一致。

2. 类型安全的运行时同步

通过TypeScript的const断言和类型校验,确保对象字面量和类型定义严格匹配,同时避免手动同步的错误:

type OutlinedButtonProps = {
  fill: 'outlined';
  color?: 'primary' | 'danger' | 'neutral';
};

// 定义与类型绑定的常量数组,用const断言锁定类型
const fillOptions = ['outlined'] as const;
const colorOptions = ['primary', 'danger', 'neutral'] as const;

// 构建目标对象
const outlinedButtonProps = {
  fill: fillOptions,
  color: colorOptions
} as const;

// 可选:验证对象与类型的匹配性
type VerifyMatch = typeof outlinedButtonProps extends {
  fill: readonly [OutlinedButtonProps['fill']],
  color: readonly OutlinedButtonProps['color'][]
} ? true : false;
// VerifyMatch 会被推断为true,说明类型完全匹配

这种方式既保证了运行时对象的正确性,又通过类型系统约束了两者的一致性,类型更新时只需修改常量数组即可。

3. 自动代码生成(适合复杂/频繁变化的场景)

如果项目中有大量这类转换需求,或者类型会频繁更新,可以使用TypeScript Compiler API(如ts-morph工具)自动解析类型并生成对应的对象代码。

示例代码(基于ts-morph):

import { Project, TypeGuards } from 'ts-morph';

// 初始化项目并加载类型文件
const project = new Project();
const sourceFile = project.addSourceFileAtPath('./path-to-your-types.ts');

// 获取目标类型别名
const outlinedButtonType = sourceFile.getTypeAlias('OutlinedButtonProps');
if (!outlinedButtonType) throw new Error('类型未找到');

// 解析类型属性并生成对象条目
const objectEntries = outlinedButtonType.getProperties().map(prop => {
  const propName = prop.getName();
  const propType = prop.getType();
  
  // 提取所有字面量类型的文本值
  const literalValues = propType.getLiteralTypes().map(lit => lit.getText());
  
  // 返回属性的对象条目字符串
  return `${propName}: [${literalValues.join(', ')}]`;
});

// 拼接生成最终的对象代码
const generatedCode = `const outlinedButtonProps = {
  ${objectEntries.join(',\n  ')}
};`;

console.log(generatedCode);
// 输出结果就是你需要的对象字面量代码

这种方式可以完全自动化,类型更新后重新运行脚本即可生成最新的对象代码,适合大型项目或需要批量处理的场景。

内容的提问来源于stack exchange,提问作者basickarl

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.14 08:18:16