Optional Chaining 及 Nullish Coalescing 可以大大提升 Source Code 可讀性,冇呢兩個 Features 要寫 Equivalent 嘅 Implementation 其實好難。

interface Foo {
  bar?: Bar
}

interface Bar {
  baz(): string
}

function getFooOrUndefined() : Foo | undefined {
    return undefined
}

const foo: Foo | undefined = getFooOrUndefined()

const omg = foo?.bar?.baz() ?? 'omg'

阿 Gap 將上述 Typescript Compile 變做 Javascript 比大家作一個參考:

"use strict";
var _a, _b;
function getFooOrUndefined() {
    return undefined;
}

const foo = getFooOrUndefined();

const omg = (_b = (_a = foo === null || foo === void 0 ? void 0 : foo.bar) === null || _a === void 0 ? void 0 : _a.baz()) !== null && _b !== void 0 ? _b : 'omg';
 

至於 Javascript 方面,用 Babel 其實都有類近方案可以採用,阿 Gap 上次喺 Show me the code Event 都有力推 Optional Chaining Plugin,Javascript Project 用緊 Babel 嘅朋友仔可以自己加 Plugins

React MVVM + Optional Chaining 例子