目次

目次

ES2019で追加されたあれこれを使ってみる

鈴木
鈴木
最終更新日2019/10/17 投稿日2019/10/17

New ES2019 JavaScript features every developer should be excited about

https://blog.logrocket.com/new-es2019-javascript-features-every-developer-should-be-excited-about/ ってことで、ES2019がうまあじだそうです。

https://node.green/#ES2019 LTSではまだっぽそうですがカレントだといけそうなんで使ってみましょう。

string trimming

trimLeftがtrimStartに、trimRightがtrimEndという名前でも使えるそうです。

上記のブログでは

let message = "     Welcome to LogRocket      ";
message.trimStart(); // "Welcome to LogRocket      "
message.trimEnd(); // "Welcome to LogRocket";

と書いてあって「え、破壊的メソッドなの?これはアカンやつやん」て思ったんですが実際に試したところ

> let message = "     Welcome to LogRocket      ";
undefined
> message.trimStart();
'Welcome to LogRocket      '
> message.trimEnd();
'     Welcome to LogRocket'

となったんで変わらず非破壊的メソッドのようす。

more intuitive to users

ってことなんですが、右とか左とかって直観的じゃないんでしょうか?reduceRightとか・・・ https://www.scala-lang.org/api/2.12.0/scala/util/Either.html

Object.fromEntries

Object.entriesの逆版です。 Object.entriesはkvなオブジェクトを2個ずつの配列にするものでした。

obj =
  k1:"v1"
  k2:"v2"

Object.entries obj
# [ [ 'k1', 'v1' ], [ 'k2', 'v2' ] ]

このentriesな配列をオブジェクトに戻します。

Object.fromEntries( Object.entries(obj)  )
# { k1: 'v1', k2: 'v2' }

こういうのは地味に便利ですね。

Array.prototype.{flat, flatMap}

flattenがやっと使えるようになったようです。

[1,2,3,[4,5,6],7,8,[9,0]].flat()
# [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 0 ]

つかってね。

flatMapは配列を返却するとそれらをflattenしてまとめるようです。

 ['my name is Gbols', ' ', 'and i am great developer'].flatMap (i)-> [1,2]
# [ 1, 2, 1, 2, 1, 2 ]

配列に配列を入れるとまとめないようです

['my name is Gbols', ' ', 'and i am great developer'].flatMap (i)-> [1,[2]]
# [ 1, [ 2 ], 1, [ 2 ], 1, [ 2 ] ]
['my name is Gbols', ' ', 'and i am great developer'].flatMap (i)-> i.split(" ")
# [ 'my', 'name', 'is', 'Gbols', '', '', 'and', 'i', 'am', 'great', 'developer]

こういう単語だけ抽出するみたいな構文は強力ですね。

Optional chaining

coffeeにあったやつです。?をつけることによってReferenceErrorを回避しnull/undefinedチェックをしなくてもよくなります。

The pipeline operator

|> という演算子を用いてshみたいに関数をつなげられるようです。shっぽく書けるのでよさそうですね。

const capitalize = (input) =>  input[0].toUpperCase() + input.substring(1);
const removeSpaces = (input) => input.trim();
const repeat = (input) => `${input}, ${input}`;
const withoutpipe = repeat(capitalize(removeSpaces('    i am gbols    ')));
console.log(withoutpipe); // I am gbols, I am gbols
But with the pipeline operator, readability can be greatly improved:

const withpipe = '    i am gbols    '
                |> removeSpaces
                |> capitalize
                |> repeat;
console.log(withpipe); // // I am gbols, I am gbols

というサンプル実行してみたんですが、

SyntaxError: Unexpected token ‘|’

と出ましてまだ実装されてないようです・・・

coffeeとかruby由来の便利そうなものが追加されていきそうな雰囲気です。

鈴木

和服とvapeとСистемаと醗酵とたまごふわふわとカッティングシェイプスとジャージークラブとjuke/fwkに傾倒する人です

目次