for/foreachからの卒業

Reactのお勉強で眠くなったので、過去に書いたソースコードをリファクタリングしてみる。

forとforeachは可読性が低いという指摘に触発されました。脱初心者したい。
https://qiita.com/diescake/items/70d9b0cbd4e3d5cc6fce

for (let i = 0; i < orders.length; i++) {
	const status = orders[i].dispatch_status;
	if (status == 'dispatched' || status == 'ordered') {
		if (!storedOrders.includes(orders[i].unique_key)) {
			ordersList = [
				...ordersList,
				{
					unique_key: orders[i].unique_key,
					ordered: orders[i].ordered,
					dispatch_status: orders[i].dispatch_status,
					payment: orders[i].payment,
				},
			];
		}
	}
	}

↓

const ordersList = orders
	.filter(
		(order) =>
			order.dispatch_status === 'dispatched' ||
			order.dispatch_status === 'ordered'
	)
	.filter((order) => !storedOrders.includes(order.unique_key))
	.map((order) => ({
		unique_key: order.unique_key,
		ordered: order.ordered,
		dispatch_status: order.dispatch_status,
		payment: order.payment,
	}));

前述の記事の通り、ものすごくわかりやすくなった。
こういうレビューしてもらえる環境って羨ましいな。独学の初心者にはありがたすぎる情報。