Programming Self-Study Notebook

勉強したことを忘れないように!　思い出せるように!!

JavaScriptの追加機能メモ（ES2022（ES13））

JavaScript


久しぶりにJavaScriptでの開発を行うことになったので、過去のアップデートを拾ってみました。

ちなみに以下も記載しています。気になる方は目次だけでも眺めてみてください。

トップレベルならawaitを使うのにasyncが不要

  • コードのトップレベルならば、わざわざasyncで関数を作らずにawait句を直接かけます。
await new Promise((resolve) => {
  setTimeout(() => {
    alert("1秒経ちました");
    resolve();
  }, 1000);
});

クラスにプライベートなメンバが宣言可能に

  • クラスのメンバの前に#をつけることでprivateにできる。
    • プライベートなメンバ：クラスの外からアクセスできない。
    • 従来のフィールドやメソッドはすべてパブリックだった。
class Counter {
  #count = 0;
  countUp() { this.#count++; }
  count() { return this.#count; }
}
var counter = new Counter();
counter.countUp();
console.log(counter.count());
console.log(counter.#count);        // SyntaxErrorになる

クラスに静的メンバが宣言可能に

  • static句で静的メンバが使えるようになった。
    • 静的メンバとは、クラスをインスタンス化せずとも利用できるメンバのこと。
class Monkey{
  static category = "animal"
}

console.log(Monkey.category);  // animal

at演算子で配列の後ろからのアクセスが簡単に

  • 配列や文字列で従来のブラケット[]アクセスの他に、at演算子でアクセスが可能となった。
const hoge = ["one", "two", "three"]
console.log(hoge.at(1)) // "two"
console.log(hoge.at(-1)) // "three"
console.log(hoge.at(-2)) // "two"
//従来はhoge[hoge.length - 1]としてアクセスしてた

hasOwnPropertyを改良したhasOwn

  • あるオブジェクトがあるプロパティを持つかどうか判定するために、Obejct.property.hasOwnPropertyという記述はとても長いため、そのショートハンドとして、Object.hasOwnが利用化できるようになった。
const myObject = {
  name: "鈴木",
}

console.log(Object.hasOwn(myObject, "name"));
// true

その他

  • in演算子によるブランドチェック
  • causeプロパティによるエラーのチェーン
  • 正規表現にdフラグの追加