Précautions lors de l'utilisation en lecture seule dans TypeScript-js tutoriel-php.cn

Précautions lors de l'utilisation en lecture seule dans TypeScript

WBOY

Libérer： 2024-08-11 06:02:01

original

361 Les gens l'ont consulté

Cautions When Using readonly in TypeScript

La base de la propriété en lecture seule

Dans Type Script, vous pouvez rendre l'objet des propriétés d'un objet en lecture seule.

const person: { readonly name: string  } = { name: 'Mike' }

person.name = 21;
// → Cannot assign to 'name' because it is a read-only property.

Copier après la connexion

⚠️① la lecture seule est uniquement au moment de la compilation

Dans le code JavaScript compilé, la déclaration en lecture seule est supprimée, elle ne sera donc pas détectée comme une erreur au moment de l'exécution.

⚠️② la lecture seule n'est pas récursive.

const person: {
  readonly name: string;
  readonly academicBackground: {
    primarySchool: string
  }
} = {
  name: 'Mike',
  academicBackground: {
    primarySchool: 'School A'
  }
}

person.academicBackground.primarySchool = 'School B'
// You can change `person.academicBackground.primarySchool`

Copier après la connexion

Si vous souhaitez le rendre en lecture seule, vous devez également le mettre en lecture seule sur PrimarySchool.

const person: {
  readonly name: string;
  readonly academicBackground: {
    readonly primarySchool: string
  }
} = {
  name: 'Mike',
  academicBackground: {
    primarySchool: 'School A'
  }
}

person.academicBackground.primarySchool = 'School B'
// → Cannot assign to 'primarySchool' because it is a read-only property.

Copier après la connexion

Lecture seule

Lorsque le nombre de propriétés augmente, l'ajout en lecture seule à chacune devient fastidieux et augmente la quantité de code.
Vous pouvez refactoriser en utilisant Readonly.

const obj: {
  readonly a : string;
  readonly b: string;
  readonly c: string;
  readonly d: string;
} = {
  a: 'a',
  b: 'b',
  c: 'c',
  d: 'd'
}

// ↓

const obj: Readonly<{
  a : string;
  b: string;
  c: string;
  d: string;
}> = {
  a: 'a',
  b: 'b',
  c: 'c',
  d: 'd'
}

Copier après la connexion

Joyeux codage☀️

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!