[解決済み】「エラー TS2533: オブジェクトは 'null' または 'undefined' の可能性があります」を抑制する方法とは？

質問

私は type :

type tSelectProtected = {
  handleSelector?: string,
  data?: tSelectDataItem[],

  wrapperEle?: HTMLElement,
  inputEle?: HTMLElement,
  listEle?: HTMLElement,
  resultEle?: HTMLElement,

  maxVisibleListItems?: number
}

モジュール単位のグローバル変数を宣言しています。

var $protected : tSelectProtected = {};

で適切な値を割り当てています。 function1() スコープを使用します。

$protected.listEle = document.createElement('DIV');

後に function2() スコープに、電話する。

$protected.listEle.classList.add('visible');

TypeScriptエラーが発生します。

error TS2533: Object is possibly 'null' or 'undefined'

を使って明示的にチェックできることは知っています。 if ($protected.listEle) {$protected.listEle} しかし、これはほとんどの場合、非常に扱いにくいようです。

TSコンパイラのチェックを無効にすることなく、この状況に対処する方法、あるいは対処すべき方法を教えてください。

解決方法は？

この機能は "strict null checks" と呼ばれています。 --strictNullChecks コンパイラーフラグが設定されていません。

しかし null があります。 説明されている として 10億ドルの過ち」（The Billion Dollar Mistake そのため、TypeScriptのような言語が修正を導入しているのは喜ばしいことです。私は、この機能を有効にしておくことを強くお勧めします。

これを修正する方法の1つは、値が決して null または undefined を初期化するなどの工夫が必要です。

interface SelectProtected {
    readonly wrapperElement: HTMLDivElement;
    readonly inputElement: HTMLInputElement;
}

const selectProtected: SelectProtected = {
    wrapperElement: document.createElement("div"),
    inputElement: document.createElement("input")
};

参照 Ryan Cavanaughの回答 という選択肢もあります。