ECMAScript2019(ES2019)/ES10の新機能
ECMAScript (略してES)は、ECMAInternationalによってECMA-262およびISO/IEC16262で標準化されたスクリプト言語仕様です。 これは、JavaScript言語を標準化して、ブラウザーベンダーからの複数の独立した標準実装を促進するために作成されました。 それは新しい機能で毎年進化します。
ECMAScript仕様の2019年版では、多くの新機能が追加されました。ここでは、これらの新機能のいくつかについて説明します。 私は個人的に、javaScriptが定期的に進化し改善し続ける方法が大好きです。
Array.flat()
Array.flat()
は、サブ配列がフラット化された新しい配列を返します。 引数なしでArray.flat()
を呼び出すと、1レベルの深さしか平坦化されません。 オプションのdepth引数を指定することも、連続して呼び出すこともできます。
例:
let arr = [1, 2, 3, [4, 5, 6, [7, 8, 9, [10, 11, 12]]]]; arr.flat(); // [1, 2, 3, 4, 5, 6, Array(4)]; arr.flat().flat(); // [1, 2, 3, 4, 5, 6, 7, 8, 9, Array(3)]; arr.flat(3); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] // Or, if you're not sure about the depth of the array: arr.flat(Infinity); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
Array.flatMap()
flatMap()
メソッドはES6マップメソッドと同じですが、同時にフラット化されます。 flatMap()
メソッドは、最初にマッピング関数を使用して各要素をマッピングし、次に結果を新しい配列にフラット化します。 flatMap()
は、両方を1つのメソッドにマージする方がわずかに効率的であるため、非常に便利なことがよくあります。
例:
let arr = [1, 2, 3, 4, 5]; arr.map(x => [x, x * 2]); // [Array(2), Array(2), Array(2)] // 0: (2)[1, 2] // 1: (2)[2, 4] // 2: (2)[3, 6] arr.flatMap(v => [v, v * 2]); // [1, 2, 2, 4, 3, 6, 4, 8, 5, 10]
String.trimStart()&String.trimEnd()
String.trimStart()
は、文字列の先頭から空白を削除するために使用できます。
例:
let greeting = " Hello everyone"; console.log(greeting.trimStart()); // "Hello everyone"
let greeting = "Hello world "; console.log(greeting.trimEnd()); // "Hello world"
オプションのキャッチバインディング
オプションのcatchバインディングを使用すると、開発者はcatchブロック内のエラーパラメーターなしでtry/catchを使用できます。
例:
ES2019より前は、次のものを使用します。
try { // some code } catch (err) { // error handling code }
これで、ES2019で次のようにtry/catchを使用できます。
try { // some code } catch { // error handling code }
Object.fromEntries()
オブジェクトを作成するか、キーと値のペアをオブジェクトに変換します。 iterables のみを受け入れます。例:Object.fromEntries(someIterable)
。
例:
let entries = new Map([["name", "john"], ["age", 22]]); console.log(Object.fromEntries(entries)); // { name: 'john', age: 22 }
Symbol.description
読み取り専用のdescriptionプロパティは、Symbolオブジェクトのオプションの説明を返す文字列です。
例:
let mySymbol = `My Symbol`; let symObj = Symbol(mySymbol); console.log(symObj) // Symbol(mySymbol); console.log(String(symObj) === `Symbol(${mySymbol})`); // true console.log(symObj.description); // "My Symbol"