3
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

JavaScriptの短縮アロー関数で2文以上の処理をしたいときに使う裏ワザ

Last updated at Posted at 2018-10-06

ES6に追加されたアロー関数はスッキリ書けて気持ちいですよね
特に一行のときは更に色々省略出来ていいですよね

しかしブロック({})を省略したときは一文しか書けないので2文以上は書けません
便利ですが、Promiseでエラーがあったらコンソールに吐いてnullを返すことをしたい のような
一行でスッキリと書きたい量の処理であってもブロックにしないと2文は書けないのです...
せっかく{}returnを省略できたのになんだかがっかりしますよね1

Promise.reject('some error')
  .catch(err => { console.error(err); return null })

そんなときにmdnの演算子一覧を見ていたら気になるものがありました。カンマ演算子 です
どうやらカンマ演算子を使用すると複数の式を実行し、最後の式を返す性質があるそうです
ためしにコンソールで実行してみると一目瞭然です

> (console.log('log'), null)
  log
< null

これでスッキリ書けますね!めでたしめでたし2

Promise.reject('some error')
  .catch(err => (console.error(err), null))
  1. 人によっては;も省略したいでしょう

  2. 可読性?なにそれおいしいの?

3
5
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?