noUncheckedIndexedAccess

noUncheckedIndexedAccess là compiler option bắt buộc check undefined khi tham chiếu property của index type hoặc phần tử array.

• Mặc định: false
• Phiên bản thêm vào: 4.1

Giải thích

Evaluate nghiêm ngặt khi truy cập property của object được khai báo bằng index type hoặc array.

📄️ Index signature

Trong TypeScript, có trường hợp muốn chỉ định type của property mà không chỉ định tên field của object. Lúc này có thể sử dụng index signature. Ví dụ, object có tất cả property là type number được type annotation như sau.

ts
type ObjectLiteralLike = {
  en: string;
  fr: string;
  it: string;
  [lang: string]: string;
};
 
type ArrayObjectLike = {
  0: string;
  1: string;
  [num: number]: string;
};
 
function log(s: string): void {
  console.log(s);
}
 
const butterfly: ObjectLiteralLike = {
  en: "Butterfly",
  fr: "Papillon",
  it: "Farfalla",
  es: "Mariposa",
};
 
const phoneticCodes: ArrayObjectLike = {
  0: "alpha",
  1: "bravo",
  2: "charlie",
};

ts
type ObjectLiteralLike = {
  en: string;
  fr: string;
  it: string;
  [lang: string]: string;
};
 
type ArrayObjectLike = {
  0: string;
  1: string;
  [num: number]: string;
};
 
function log(s: string): void {
  console.log(s);
}
 
const butterfly: ObjectLiteralLike = {
  en: "Butterfly",
  fr: "Papillon",
  it: "Farfalla",
  es: "Mariposa",
};
 
const phoneticCodes: ArrayObjectLike = {
  0: "alpha",
  1: "bravo",
  2: "charlie",
};

ObjectLiteralLike, ArrayObjectLike đều được khai báo là type của object có property kiểu string.

ts
const spanish: string = butterfly.es;
const third: string = phoneticCodes[2];
 
console.log(spanish);
console.log(third);

ts
const spanish: string = butterfly.es;
const third: string = phoneticCodes[2];
 
console.log(spanish);
console.log(third);

Khi truy cập property của các object này không đảm bảo type safe hoàn toàn. Khi bật option này sẽ báo lỗi như sau:

ts
const spanish: string = butterfly.es;
Type 'string | undefined' is not assignable to type 'string'.
  Type 'undefined' is not assignable to type 'string'.2322Type 'string | undefined' is not assignable to type 'string'.
  Type 'undefined' is not assignable to type 'string'.
const third: string = phoneticCodes[2];
Type 'string | undefined' is not assignable to type 'string'.
  Type 'undefined' is not assignable to type 'string'.2322Type 'string | undefined' is not assignable to type 'string'.
  Type 'undefined' is not assignable to type 'string'.

ts
const spanish: string = butterfly.es;
Type 'string | undefined' is not assignable to type 'string'.
  Type 'undefined' is not assignable to type 'string'.2322Type 'string | undefined' is not assignable to type 'string'.
  Type 'undefined' is not assignable to type 'string'.
const third: string = phoneticCodes[2];
Type 'string | undefined' is not assignable to type 'string'.
  Type 'undefined' is not assignable to type 'string'.2322Type 'string | undefined' is not assignable to type 'string'.
  Type 'undefined' is not assignable to type 'string'.

Như vậy, property không được định nghĩa rõ ràng sẽ được phân tích là union type với undefined:

ts
const spanish: string | undefined = butterfly.es;
const third: string | undefined = phoneticCodes[2];

ts
const spanish: string | undefined = butterfly.es;
const third: string | undefined = phoneticCodes[2];

Array khi truy cập bằng index notation sẽ được phân tích là union type với undefined, nhưng for-of, array.forEach() không bị ràng buộc này nên nên cân nhắc sử dụng tích cực:

ts
const phoneticCodes: string[] = ["alpha", "bravo", "charlie"];
 
for (const p of phoneticCodes) {
  // ...
}
 
phoneticCodes.forEach((p: string) => {
  // ...
});

ts
const phoneticCodes: string[] = ["alpha", "bravo", "charlie"];
 
for (const p of phoneticCodes) {
  // ...
}
 
phoneticCodes.forEach((p: string) => {
  // ...
});