意外と Object.assign が使える2
- カテゴリ:
- JavaScript
- コメント数:
- Comments: 0
◆ reduce で代入+ return してたところが式 1 つになる
◆ return 入らずのアロー関数にできる
◆ return 入らずのアロー関数にできる
前回は DOM 関係でしたが reduce をアロー関数で書くときにも役立ちます
reduce でオブジェクトに追加していくときは previousValue に値を追加して 追加後の previousValue を返す必要があります
例えばオブジェクトから _ で始まるキーを除去したオブジェクトがほしいとき
のように代入と return が別れます
「,」も演算子なのでこうもかけます
Object.assign だと
できるだけアロー関数は return かかずに直接式を 1 つにしたいのでありがたい関数ですね
reduce でオブジェクトに追加していくときは previousValue に値を追加して 追加後の previousValue を返す必要があります
例えばオブジェクトから _ で始まるキーを除去したオブジェクトがほしいとき
const obj = {
_a: 1,
a: 20,
_b: 2,
b: 100,
_c: 3,
_d: 4,
e: 500,
_f: 5,
f: 800,
}
Object.keys(obj).filter(e => !e.startsWith("_"))
.reduce((acc, e) => {
acc[e] = obj[e]
return acc
}, {})
_a: 1,
a: 20,
_b: 2,
b: 100,
_c: 3,
_d: 4,
e: 500,
_f: 5,
f: 800,
}
Object.keys(obj).filter(e => !e.startsWith("_"))
.reduce((acc, e) => {
acc[e] = obj[e]
return acc
}, {})
Object {a: 20, b: 100, e: 500, f: 800}
のように代入と return が別れます
「,」も演算子なのでこうもかけます
Object.keys(obj).filter(e => !e.startsWith("_"))
.reduce((acc, e) => (acc[e] = obj[e], acc), {})
ただし 結合の優先順位の都合で 「()」 が必要になりますし ちょっと見づらいです.reduce((acc, e) => (acc[e] = obj[e], acc), {})
Object.assign だと
Object.keys(obj).filter(e => !e.startsWith("_"))
.reduce((acc, e) => Object.assign(acc, {[e]: obj[e]}), {})
長くはなりますが 見やすいかと思います.reduce((acc, e) => Object.assign(acc, {[e]: obj[e]}), {})
できるだけアロー関数は return かかずに直接式を 1 つにしたいのでありがたい関数ですね