技術探し

JavaScriptを中心に記事を書いていきます :;(∩´﹏`∩);:

babelへOptional Chainingが追加される

Optional Chaining

github.com

// before
const fooInput = myForm.querySelector('input[name=foo]');
const fooValue = fooInput ? fooInput.value : undefined;

// after
const fooValue = myForm.querySelector('input[name=foo]')?.value;

const obj = {
  foo: {
    bar: {
      baz: 42
    }
  }
};

obj?.foo?.bar?.baz; // 42
obj?.qux?.baz; // undefined
obj?.foo.bar.qux?.(); // undefined

function test() {
   return 42;
}

test?.(); // 42  
exists?.(); // undefined

class Test {
}

new Test?.(); // test instance
new exists?.(); // undefined

?.演算子の左の式の評価がundefined または nullのときに右の式が評価されず、undefinedを返します。

現在のステータスはstage-1です。

Babylon

babylonへOptional Chainingの追加と?.トークンタイプが追加されました。 babylonとは、Babelのために作られたJSのパーサで、acornがベースで作られています。 github.com

Babel

github.com 現在レビュー中です。
またこのPRのマージ先は 7.0.0 なので少し待たないといけないかもです。(現在 alpha.12)
このPRでできるbabel-plugin-syntax-optional-chaining というパッケージが後ほど babel-preset-stage-1 へ入ると思います。