CODEWITHSUNDEEP
typescripttypescript2.0
Da Yin
Da Yin

Reputation: 453

Does TypeScript have a Null-conditional operator

Is there any operator like ?. in TypeScript that can check if the variable is null or not defined like Kotlin? Like

person?.getName()?.firstName ?: "None"

Upvotes: 45

Views: 31889

Answers (8)

armel sauvy
armel sauvy

Reputation: 75

This will set item to null if there is no e-mail:

let item = user?.email;

Upvotes: -1

bvdb
bvdb

Reputation: 24740

Not only is it supported in typescript (since version 3.7.2). It is also supported in javascript now (since ES2020).

  • In practice that means you can use it in frameworks like Angular (since v9 which supports typescript 3.7).

  • But especially now that it is in the ES2020 spec, we will be seeing it everywhere.

Upvotes: 2

Nicolas Seiller
Nicolas Seiller

Reputation: 624

The actual good answer is in Andreas' comment. Your example would be implemented as below from Typescript 3.7 onwards :

person?.getName()?.firstName ?? "None"

See https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html#nullish-coalescing

Upvotes: 6

wal
wal

Reputation: 17729

Yes, as of Typescript 3.7 you can now do this via optional-chaining

person?.getName()?.firstName

gets transpiled to

let firstName = person === null || person === void 0 ? void 0 : (_person$getName = person.getName()) === null || _person$getName === void 0 ? void 0 : _person$getName.firstName;

Note the check for null. This will work as expected if for example person is defined as

let person:any = null; //no runtime TypeError when calling person?.getName()

However if person is defined as

let person:any = {};//Uncaught TypeError: person.getName is not a function

See also this similar stackoverflow question

Upvotes: 30

Ebuka
Ebuka

Reputation: 634

I used this in my code to check for null

this.firstname = (this.firstname != null) ? this.firstname : this.firstname;

This could do till v3 is out

Upvotes: 4

A.S.
A.S.

Reputation: 126

I've encountered the same situation, and the following worked for me.

First, I defined a separate class with a property that can be null:

export class Foo {
    id: number; //this can be null
}

Then in my main class I set a property foo to this new type:

foo: Foo

After that, I was able to use it like this:

var fooId = (this.foo || ({} as Foo)).id;

This is the closest I could get to have a null propagation in a current version of TypeScript.

Upvotes: 8

ApriOri
ApriOri

Reputation: 2688

Actually this is related to javascript null safety discussion that is mentioned in this answer. I guess they want it to be supported on javascript before they will get to typescript.

Upvotes: 3

Loonquawl
Loonquawl

Reputation: 1076

No, as of now safe navigation operatior is still not implemented in Typescript: https://github.com/Microsoft/TypeScript/issues/16

However according to the latest standardization meeting notes it has been proposed, so maybe v3 :)

https://github.com/tc39/agendas/blob/master/2017/07.md

Upvotes: 18

Related Questions