How to suppress "error TS2533: Object is possibly 'null' or 'undefined'"?

Question

I have a type:

type tSelectProtected = {   handleSelector?: string,   data?: tSelectDataItem[],    wrapperEle?: HTMLElement,   inputEle?: HTMLElement,   listEle?: HTMLElement,   resultEle?: HTMLElement,    maxVisibleListItems?: number } 

I declare a global module-wise variable:

var $protected : tSelectProtected = {}; 

I'm assigning proper value in function1() scope:

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

Later in function2() scope, I'm calling:

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

I'm getting TypeScript error:

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

I know that I can do explicit check using if ($protected.listEle) {$protected.listEle} to calm down compiler but this seems to be very unhandy for most non trivial cases.

How this situation can or should be handled without disabling TS compiler checks?

Answer 1

If you know from external means that an expression is not null or undefined, you can use the non-null assertion operator ! to coerce away those types:

// Error, some.expr may be null or undefined let x = some.expr.thing; // OK let y = some.expr!.thing;