ECMAScript 2020

JavaScriptバージョン番号

古いJSバージョンは数字で名付けられます:ES5 (2009) と ES6 (2015)。

2016年から、バージョンは年を名前としています:ECMAScript 2016、2017、2018、2019、...

ES2020における新しい機能:

警告

これらの機能は比較的新しいです。

古いブラウザでは、代替コード(Polyfill)が必要になる場合があります。

JavaScript BigInt

JavaScript BigInt変数は、通常のJavaScript数字では表現できない非常に大きな整数の値を保存するために使用されます。

JavaScriptの整数は最大15桁まで正確です。

Integerインスタンス

let x = 999999999999999;
let y = 9999999999999999; // より大きい

自分で試してみる

BigIntインスタンス

let x = 9999999999999999;
let y = 9999999999999999n;

自分で試してみる

BigIntを作成するには、以下の通りになります: n 整数の末尾に付加したり BigInt()を呼び出したり:

let x = 1234567890123456789012345n;
let y = BigInt(1234567890123456789012345);

自分で試してみる

BigIntのJavaScriptタイプは"bigint"です:

let x = BigInt(999999999999999);
let type = typeof x;

自分で試してみる

2020年9月から、すべての現代ブラウザがBigIntをサポートしています:

Chrome Edge Firefox Safari Opera
Chrome 67 Edge 79 Firefox 68 Safari 14 Edge 79
Firefox 68 Firefox 72 Opera 54 2020 年 9 月 2018年5月

JavaScript 字符列メソッド matchAll()

2019年7月

2018年6月

自分で試してみる

ES2020以前は、文字列内のすべての文字列の検出に使用できる文字列メソッドがありませんでした。const iterator = text.matchAll("Cats");パラメータが正規表現の場合、グローバルフラグを設定する必要があります(

g

自分で試してみる

)、さもなければTypeErrorが投げられます。const iterator = text.matchAll(/Cats/g);大文字と小文字を区別しない検索を行いたい場合は、大文字と小文字を区別しないフラグを設定する必要があります(

i

自分で試してみる

):const iterator = text.matchAll(/Cats/gi); ヒント:

ES2021

空値合併演算子(Nullish Coalescing Operator)(?? 演算子)null もしオブジェクトが undefinedもし最初の引数が空値でない場合( )、もしくは ??

演算子は最初の引数を返します。

そうでない場合は、二つ目を返します。
let name = null;
let text = "missing";

自分で試してみる

let result = name ?? text;

Chrome Edge Firefox Safari Opera
Chrome 80 Edge 80 2020年3月から、すべての現代ブラウザがnullish演算子をサポートしています: Safari 13.1 Opera 67
2020年2月 2020年2月 Firefox 72 2020 年 3 月 2020 年 3 月

2020年1月

オプショナルチェイン演算子(オプショナルチェイン演算子)(?. 演算子) undefined もしオブジェクトが null、もしくはオプショナルチェイン演算子返します undefined(エラーメッセージを出さずに)。

const car = {type:"Fiat", model:"500", color:"white"};
let name = car?.name;

自分で試してみる

2020年3月から、すべての現代ブラウザがサポートしています。 ?.= 演算子:

Chrome Edge Firefox Safari Opera
Chrome 80 Edge 80 Firefox 74 Safari 13.1 Opera 67
2020年2月 2020年2月 2020 年 3 月 2020 年 3 月 2020 年 3 月

論理 AND 複合演算子(&&= 演算子)

論理 AND 賦値演算子二つの値の間で使用されます。

もし最初の値が true、次の値を割り当てます。

論理 AND 賦値例

let x = 100;
x &&= 5;

自分で試してみる

2020 年 9 月以降、すべての現代ブラウザがサポートしています &&= 演算子:

Chrome Edge Firefox Safari Opera
Chrome 85 Edge 85 Firefox 79 Safari 14 Opera 71
2020 年 8 月 2020 年 8 月 2020 年 3 月 2020 年 9 月 2020 年 9 月

論理 OR 賦値演算子(||= 演算子)

論理 OR 賦値演算子二つの値の間で使用されます。

もし最初の値が false、次の値を割り当てます。

論理 OR 賦値例

let x = 10;
x ||= 5;

自分で試してみる

2020 年 9 月以降、すべての現代ブラウザがサポートしています ||= 演算子:

Chrome Edge Firefox Safari Opera
Chrome 85 Edge 85 Firefox 79 Safari 14 Opera 71
2020 年 8 月 2020 年 8 月 2020 年 3 月 2020 年 9 月 2020 年 9 月

空値結合複合演算子(??= 演算子)

空値結合複合演算子(Nullish Coalescing Assignment Operator)は二つの値の間で使用されます。

最初の値が undefined または null、次の値を割り当てます。

空値結合複合演算子のインスタンス

let x = 10;
x ??= 5;

自分で試してみる

2020 年 9 月以降、すべての現代ブラウザがサポートしています ??= 演算子:

Chrome Edge Firefox Safari Opera
Chrome 85 Edge 85 Firefox 79 Safari 14 Opera 71
2020 年 8 月 2020 年 8 月 2020 年 3 月 2020 年 9 月 2020 年 9 月