新しいJavaScriptの書き方がされたコードを従来の書き方に直してみたのですが合っていますでしょうか？

Question

以下のリンク先のコードなのですが、書き出しからこんな感じで何やってるか良くわかりづらかったので、従来のJavaScriptのコードに書き直してみたつもりなのですが、書き直したコードは元のコードの本来の動作通りに書き直せていますでしょうか？ >_<

一時的に削除します。。。

Answer 1

ざっと見た感じそれで大丈夫。

isIterable === true ? wrappedComponentProp[VALUE].toJS() : wrappedComponentProp[VALUE];

三項演算子でこれはイケてない。
isXXXはtrue or falseの論理値に決まってるんだから、そのまま三項演算子に投げ込んだ方がかっこいい。
isIterable ? wrappedComponentProp[VALUE].toJS() : wrappedComponentProp[VALUE]

以下は蛇足だけど、自分で書くならこうかな。
この辺は思想もあるから色んな人の正解があると思うけど、私の場合は横を縮める為に少々縦に伸ばすのが好み。
ついでにspace2個が好き。

import React from 'react'
import { Iterable } from 'immutable'

export const toJS = WrappedComponent => wrappedComponentProps => {
  const propsJS = Object
    .entries(wrappedComponentProps)
    .reduce((newProps, it) => {
      let key = it[0];
      let prop = it[1];
      let isIterable = Iterable.isIterable(prop);
      newProps[key] = isIterable ? prop.toJS() : prop;
      return newProps;
    }, {});

  return <WrappedComponent {...propsJS} />
}

因みにObject.entriesが何してるのか気になったので検証してみた。
obj-to-pairsしてたんだね、これは便利。

var hoge = {a: 123, b: 234}
console.log(Object.entries(hoge));
// [["a", 123], ["b", 234]]

Comments

[退会済みユーザー]

>isXXXはtrue or falseの論理値に決まってるんだから、そのまま三項演算子に投げ込んだ方がかっこいい。
なるほど、確かにそうですね！

[退会済みユーザー]

>ざっと見た感じそれで大丈夫。
ありがとうございます！

Answer 2

学習上でのES2015からES5へのコード変換ということで、Babel公式サイトのTry it outページでWeb上で左にES2015コードを入力すると右にES5コードが出力される機能があったので、人間が見る分には少し歪にはなりますが動くコードなので合っているかどうかの参考にはなるかと思います。
Babel Try it out

Comments

[退会済みユーザー]

検証するアイデアのご提案ありがとうございます！