TypeScript修改对象属性报错：只读属性无法赋值的原因求助

问题背景 #

我在使用TypeScript时遇到无法修改对象属性值的问题，相关类型定义、函数代码及报错信息如下：

类型定义代码 #

export enum FOO_TYPES {
    red = "red",
    green = "green"
}

export type FooTypes = {
    [key in keyof typeof FOO_TYPES]: boolean
}

enum SOME_OTHER_ENUM {
    a = "abc",
    d = "def", 
    e = "ghi"
}

export interface SomeMoreData {
    id: number,
    key: SOME_OTHER_ENUM,
    priceA: number,
    priceB: number,
    red: boolean,
    green: boolean,
}

type ProjectProps = {
    [key in SOME_OTHER_ENUM]?: {
        project: SomeMoreData ,
        amountPriceAPriceB: {
            sumPriceA: number;
            sumPriceB: number;
        }
    }
}

interface GroupedProjectProps {
    [FOO_TYPES.red]: ProjectProps,
    [FOO_TYPES.green]: ProjectProps
};

编写的函数代码 #

const someFunc = (projects: GroupedProjectProps) => {
    const availableTypes: FooTypes = {
        red: false,
        green: false
    };

    (Object.keys(projects) as Array<keyof typeof FOO_TYPES >).map(type => {
        if (Object.keys(projects[type]).length > 0)  availableTypes[type] = true
    })
}

报错信息 #

Cannot assign to 'red' because it is a read-only property.
Cannot assign to 'green' because it is a read-only property.

原因及解决方案 #

原因 #

FooTypes是基于keyof typeof FOO_TYPES生成的映射类型，而typeof FOO_TYPES对应枚举的类型，TypeScript默认会将枚举的键视为只读属性，因此生成的FooTypes类型属性也被标记为只读，导致无法赋值。

解决方案 #

有两种可行的解决方式：

1. 从类型定义移除只读标记
   修改FooTypes的定义，添加-readonly修饰符，强制让属性变为可写：

   export type FooTypes = {
       -readonly [key in keyof typeof FOO_TYPES]: boolean
   }
   

2. 赋值时用类型断言绕开检查
   在赋值语句中对目标属性做类型断言，告知TypeScript该属性可写：

   (availableTypes[type] as boolean) = true
   

推荐第一种方案，它从类型层面解决问题，更符合TypeScript的类型安全设计原则。

内容的提问来源于stack exchange，提问作者four-eyes