在 TypeScript 中将只读属性更改为可变属性

作者

在 TypeScript 中将只读属性更改为可变属性

Change a readonly property to mutable in TypeScript

您可以使用映射修饰符将 TypeScript 中的只读属性更改为可变属性，例如-readonly [Key in keyof Type]: Type[Key]. readonly您可以通过在关键字前加上减号来删除 readonly 修饰符-。

索引.ts
// 👇️ With Classes 👇️
class Employee {
  constructor(public readonly name: string) {
    this.name = name;
  }
}

// 👇️ create utility type
type Mutable<Type> = {
  -readonly [Key in keyof Type]: Type[Key];
};

const emp: Mutable<Employee> = new Employee('James');

emp.name = 'Alice';

console.log(emp.name); // 👉️ 'Alice'

// --------------------------------------------

// 👇️ With Objects 👇️
interface Person {
  readonly country: string;
}

const obj: Mutable<Person> = {
  country: 'Germany',
};

obj.country = 'Austria';

console.log(obj); // 👉️ {country: 'Austria'}

我们创建了一个Mutable实用程序类型，它使用
映射修饰符
使类或对象中的属性可变。

映射修饰符通过在它们前面加上 plus+或 minus来删除或添加-。如果您没有显式添加前缀，则+假定为。

该类型基本上readonly从类型的属性中删除属性。

索引.ts
type Mutable<Type> = {
  -readonly [Key in keyof Type]: Type[Key];
};

type Address = {
  readonly country: string;
  readonly city: string;
};

// 👇️ type MutableAddress = {
//     country: string;
//     city: string;
// }
type MutableAddress = Mutable<Address>;

您还可以使用
类型断言
将对象类型转换为可变类型。

索引.ts
// 👇️ With Classes 👇️
class Employee {
  constructor(public readonly name: string) {
    this.name = name;
  }
}

type Mutable<Type> = {
  -readonly [Key in keyof Type]: Type[Key];
};

// 👇️ using type assertion
const emp = new Employee('James') as Mutable<Employee>;

emp.name = 'Alice';

console.log(emp.name); // 👉️ 'Alice'

// --------------------------------------------

// 👇️ With Objects 👇️
interface Person {
  readonly country: string;
}

// 👇️ using type assertion
const obj = {
  country: 'Germany',
} as Mutable<Person>;

obj.country = 'Austria';

console.log(obj); // 👉️ {country: 'Austria'}

as unknown as Mutable<MyType>如果您的类型不同，您可能还必须这样做。

如果您不喜欢其中任何一种方法，也可以像any
更改其属性之前一样强制转换对象，这将抑制类型检查错误。

索引.ts
class Employee {
  constructor(public readonly name: string) {
    this.name = name;
    this.country = country;
  }
}

const emp1 = new Employee('James');

// ⛔️ Error:  Cannot assign to 'name' because
// it is a read-only property.ts(2540)
emp1.name = 'Alice';

// ✅ Works without errors
(emp1 as any).name = 'Alice';
console.log(emp1.name); // 👉️ "Alice"

我更喜欢谨慎地使用 type
any
类型，因为它有效地关闭了类型检查，但是当你需要一个快速而肮脏的解决方案时，它就可以完成工作。

–