typescriptで要素取得はできたのですが、Object is possibly 'null'.がでます。

Question

   1    const sortTable  = document.getElementById("sortTable");
   2    let ths:NodeListOf<HTMLTableHeaderCellElement> = sortTable.getElementsByTagName('th');
　 3    let tbody:HTMLTableSectionElement = <HTMLTableSectionElement>sortTable.querySelector('tbody');
   4    let rows = Array.prototype.slice.call(sortTable.querySelectorAll('tbody > tr'));

上記のコードになります。

vscodeを使用しているのですが、
1の中にある、2を取得すると、タイトルでもあるように、

Object is possibly 'null'.

と、はかれます。以下 3と4も同じ現象です。

型定義に問題があるのかと思い、調べたのですが、これに該当することは見つからず
といった状態です。

どなかた、ご教授いただけますでしょうか？
宜しくお願い致します。

Answer 1

2行目で sortTable.getElementsByTagName() をコールしていますが sortTable が null である可能性がありますよ、という意味の警告です。
sortTable に値をセットするための getElementsById() は関数型が "getElementsById(): HTMLElement | null" と定義されているので、事実上この呼び出しが null になることはないと開発者が判っている場合でも TSLINT はこれを見逃してくれません。
この警告を消す一番簡単な方法は以下のようにすることです。

let ths:NodeListOf<HTMLTableHeaderCellElement> = sortTable!.getElementsByTagName('th');

! で修飾することで、sortTable 変数が null でなければ getElementsByTagName() を呼び出し、null なら何もしないという宣言になります。

ご参考になれば。

Comments

[masaru_free]

tkandaさん

ご回答ありがとうございます。

解決できました。