javascript - ボタンを無効化する際に '@typescript-eslint/no-non-null-assertion' の目的

このコードブロックでは、.value! と @typescript-eslint/no-non-null-assertion は何をしているのでしょうか？ドキュメントが抽象的すぎて、このボタンの動作の文脈に結びつけることができません。

const submitButton = ref<HTMLButtonElement | null>(null);

  //Disable button
  /* eslint-disable  @typescript-eslint/no-non-null-assertion */
  submitButton.value!.disabled = true;

追伸：プログラミングの世界だけでは、「ノー・ノン・ヌル」と平然と言うことができます。

回答 #1

! は TypeScript の非 null アサーションです。TypeScript に「見たところ value は null かもしれませんが、信じてください、そうではありません」と伝えるものです。これは、TypeScript が知らないことをあなたが知っている場合（この場合、おそらくこのコードが実行される前に ref が設定されることをあなたが知っている）に便利ですが、本質的にこの行で型チェックを無効にするため、意図せずバグを導入する可能性があります。

非 null アサーションはリスクを伴うため、その使用を禁止するリントルールがあります。このリントルールが有効になっている場合、この行は問題としてフラグが立てられます。一般的な修正方法としては、null チェックを行うコードを書くことで、アサーションを不要にする方法があります。ただし、必要に応じて、例えば /* eslint-disable @typescript-eslint/no-non-null-assertion */ のような特別なコメントを使用して、この行に対する eslint のチェックを防ぐことも可能です。

まとめると、これらの行は「ねえ、TypeScript、これをチェックしないで。ねえ、ESLint、これをチェックしないで」と言っているということです。