ドキュメント
for
とmap
コード例
cartItems
に商品の税込み価格(includeTax
)を追加する.
-
before
const cartItems = [
{
name: '掃除機',
price: 10000
},
{
name: '電子レンジ',
price: 8000
},
{
name: '冷蔵庫',
price: 30000
}
]
-
after
税込価格であるincludeTax
を追加する
const cartItems = [
{
name: '掃除機',
price: 10000,
includeTax: 11000
},
{
name: '電子レンジ',
price: 8000,
includeTax: 8800
},
{
name: '冷蔵庫',
price: 30000,
includeTax: 33000
}
]
for
とmap
比較
-
for
const cartItems = [...] // 長いので省略
for(let index = 0; index < cartItems.length; index++){
const taxRate = 10
const tax = cartItems[index].price * (taxRate/100)
cartItems[index].includeTax = cartItems[index].price + tax
}
-
for
のイケてない点
for
では、下記のようにindex
を指定する必要があります.
助長になりますし、可読性も良いとは思えません.
const tax = cartItems[index].price * (taxRate/100)
cartItems[index].includeTax = cartItems[index].price + tax
-
map
const cartItems = [...] // 長いので省略
cartItems.map((item)=>{
const taxRate = 10
const tax = item.price * (taxRate/100)
return item.includeTax = item.price + tax
})
-
for
と比べてイケている点
それに比べてmap
はどうでしょうか?
map
では下記のように複数の要素を順番に取り出します.
cartItems.map((item)=>{...}
順番に取り出したオブジェクトはitem
という変数に渡され下記のように各パラメーターにアクセスできます.※名前は自由に決められます.
for
のようにindex
を指定する必要はありません.
const tax = item.price * (taxRate/100)
item.includeTax = item.price + tax
可読性もfor
よりかなりよいかと個人的には感じます.
ケースバイケースですが、積極的にmap
を使っていきましょう!
最後に
2022年4月から新潟県佐渡島でwebエンジニアとして働いています!
普段は、幹事が得するグルメ予約サイトリザくるの開発しています!
お店によりますが還元される金額の単位は万〜
です!
開発や、個人学習していくなかで「おっ」と思ったことを記事として発信しています.
Top comments (0)