【React】オブジェクトリストをループしてコンポーネント化する - Qiita
はじめに プログラミング歴2ヶ月の素人が書いています。（間違っていたらご指摘ください） WesBos.com のオンラインビデオコースでReactを学習しています。 動画は以下から。 https://reactforbeginners.com/ 「Reactでオブジェクトリストをループしてコンポーネントを動的に複数生成する」ための学習メモです。 今回の目的 以下のような商品リストがオブジェクトリストとして存在するとします。 const fishes = { fish1: { name: "Pacific Halibut", image: "/images/hali.jpg", price: 1724, }, fish2: { name: "Lobster", image: "/images/lobster.jpg", price: 3200, }, fish3: { name: "Sea
[React]useStateでオブジェクト(連想配列)や配列の一部を更新する方法
私はいつも、ReactのuseStateでオブジェクト(連想配列)の更新に手を焼いています。 どうやるんだっけ？ ということで、この記事に更新のやり方を残しておきます。 useStateでオブジェクトを更新する方法 オブジェクトの一部だけ変更 const [state, setState] = useState({ id: 1, name: 'foo' }); const updateState = () => { setState((prevState) => ({ ...prevState, name: 'bar' })); // { id: 1, name: 'bar' } }; 前の状態(ここではprevState)を関数として渡して、オブジェクトの一部を書き換えています。 …prevStateはスプレッド構文といって、オブジェクトの要素を展開します。 name: ‘bar’は上書
![[React]useStateでオブジェクト(連想配列)や配列の一部を更新する方法](https://cdn-ak-scissors.b.st-hatena.com/image/square/5f7b670b37ab90694daf805b6f5c4908576a2722/height=288;version=1;width=512/https%3A%2F%2Famateur-engineer.com%2Fwp-content%2Fuploads%2F2022%2F05%2Fundraw_React_re_g3ui.png)
文字列の日付を降順にソートする方法 - Qiita
[ { "id": "1", "title": "【参加メモ】 『SCRUM BOOT CAMP THE BOOK 増補改訂版』読書会 第1回目", "date": "2021/10/25", "url": "https://note.com/maiamea/n/n5cd7a8c0cbf7" }, { "id": "2", "title": "【参加メモ】 『SCRUM BOOT CAMP THE BOOK 増補改訂版』読書会 第2回目", "date": "2021/10/27", "url": "https://note.com/maiamea/n/n792779910e0b" }, { "id": "3", "title": "【参加メモ】 『SCRUM BOOT CAMP THE BOOK 増補改訂版』読書会 第3回目", "date": "2021/10/29", "url":
あなたが知らないであろう15個の強力なJavaScriptのテクニック🗡🔈🔥
はじめに この記事はこちらの記事の和訳となります。 なお、著者には許可をいただいております。是非原文もご覧ください。 拙訳なので、ご指摘などあればお待ちしております。 Javascriptのバグ修正や答えを求めてGoogleやStackOverflowを探し回るのは楽しくないでしょう🏴☠️。 この記事では、生産性⚡を最大化し、苦痛🩸を最小化する、20個（訳註:正確には15個）の短く、パワフルなJavaScriptのテクニックを紹介します。 それではコードを見ていきましょう🤘 配列の重複を除去 配列から重複した要素を除去します。 const arr = ["a", "b", "c", "d", "d", "c", "e"] const uniqueArray = Array.from(new Set(arr)); console.log(uniqueArray); // ['a',
querySelectorAllしてmapしたいとき[...すると短い - hitode909の日記
表示中のHTMLから情報を雑に抜き出して利用するため，ブラウザのデベロッパツールなどでquerySelectorAllしてmapしたい．しかし，querySelectorAllはNodeListを返すので，mapするにはArrayに変換する必要がある． NodeListをArrayに変換するときに短く書く方法ないですかって同僚に聞いたらいろいろ教えてもらえたのでメモ． Array.prototype.slice.callする オーソドックスな手法．昔からこれを書いていて，長くて困っていた．最近はアロー関数を使えるのでちょっと短くなったけど長い． Array.prototype.slice.call(document.querySelectorAll('a')).map(a => a.href) [].slice.callする Array.prototypeのかわりに[]で書く．ちょっと短い
for-ofで配列も普通のオブジェクトも反復しよう。（配列とかおれおれAdvent Calendar2018 – 15日目） | Ginpen.com
配列とかおれおれAdvent Calendar2018 – 15日目 繰り返しにもいろいろあるよ。 for, while → for文を仕様からじっくり見てみる。あとwhileとか。（配列とかおれおれAdvent Calendar2018 – 13日目） for-in → for-inの仕様も見てみたよ。使う機会なさそうだけど。（配列とかおれおれAdvent Calendar2018 – 14日目） for-of for-await-of → 別稿 forEach() → 別稿 for-in じゃない方です。 こっち使おう。 for-of 文 for-in と違って値の方を持ってきてくれます。 const arr = [11, 22, 33]; for (const value of arr) { console.log(value); } // 11 // 22 // 33
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
順番の乱れたobjectをkeyでsortする.js
