[解決済み】jQuery map vs. each.
2022-04-03 23:53:38
質問
jQueryでは
map
と
each
関数は、同じことをするようです。両者に実用的な違いはあるのでしょうか?また、どのような場合にどちらを使うのでしょうか?
どのように解決するのですか?
その
each
メソッドはイミュータブルなイテレータであることを意図していますが、一方
map
メソッドはイテレータとして使用できますが、 実際は与えられた配列を操作して新しい配列を返すものです。
もう一つ重要なことは
each
関数は元の配列を返すのに対し
map
関数は新しい配列を返します。 map関数の戻り値を使いすぎると、大量のメモリを浪費する可能性があります。
例えば
var items = [1,2,3,4];
$.each(items, function() {
alert('this is ' + this);
});
var newItems = $.map(items, function(i) {
return i + 1;
});
// newItems is [2,3,4,5]
また、map関数を使うと、配列から項目を削除することができます。 たとえば
var items = [0,1,2,3,4,5,6,7,8,9];
var itemsLessThanEqualFive = $.map(items, function(i) {
// removes all items > 5
if (i > 5)
return null;
return i;
});
// itemsLessThanEqualFive = [0,1,2,3,4,5]
また
this
にはマッピングされません。
map
関数を使用します。 コールバックの最初のパラメータを指定する必要があります (例えば、ここでは
i
上記)。 皮肉なことに、eachメソッドで使われるコールバック引数は、map関数のコールバック引数と逆になっているので、注意が必要です。
map(arr, function(elem, index) {});
// versus
each(arr, function(index, elem) {});
関連
-
[解決済み】node.js TypeError: path must be absolute or specify root to res.sendFile [JSONのパースに失敗しました]。
-
[解決済み】Javascriptのコールバック関数がFirefoxで「Callback is not a function」というエラーを投げる
-
[解決済み】WebpackとBabelで「このファイルタイプを扱うには適切なローダーが必要な場合があります。
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] jQueryでチェックボックスに "checked "を設定する
-
[解決済み] callとapplyの違いは何ですか?
-
[解決済み] event.preventDefault() vs. return false
-
[解決済み] jQueryで要素にスクロールする
-
[解決済み] JavaScriptで二重引用符と単一引用符はいつ使うべきですか?
-
[解決済み】jQueryでチェックボックスがチェックされているかどうかを確認するにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】JavaScriptで':'(コロン)は何をするのか?
-
[解決済み] React with ES7: Uncaught TypeError: Cannot read property 'state' of undefined [duplicate] (未定義のプロパティ'state'を読み込むことはできません。
-
[解決済み】BootstrapのCollapseが折りたたまれない
-
[解決済み】Uncaught ReferenceError。Reactが定義されていない
-
[解決済み】JavaScriptのボタンonclickが機能しない
-
[解決済み】Reactのeslintエラーはpropsの検証で見つからない
-
[解決済み】エラー:リスン EACCES 0.0.0.0:80 OSx Node.js
-
[解決済み】Redux TypeError: 未定義のプロパティ 'apply' を読み取れない
-
[解決済み】react router v^4.0.0 Uncaught TypeError: 未定義のプロパティ'location'を読み取れない
-
[解決済み】Javascript、[オブジェクトHTMLInputElement]を表示中。]