[解決済み】このコンテキストを関数に渡すにはどうすればいいですか?
2022-04-05 17:06:07
質問
これは簡単にググれるものだと思っていたのですが、もしかしたら私の質問が間違っていたのかもしれません...。
javascriptの関数で、"this"が指すものを設定するにはどうすればよいですか?
例えば、jQueryのほとんどの関数のような。
$(selector).each(function() {
//$(this) gives me access to whatever selector we're on
});
呼び出されたときに適切な "this" 参照を持つ独自のスタンドアロン関数を書いたり呼び出したりするにはどうしたらよいでしょうか? 私はjQueryを使っているので、jQuery特有の方法があれば理想的です。
どのように解決するのですか?
Javascripts
.call()
と
.apply()
メソッドを使用すると
コンテキスト
を使用することができます。
var myfunc = function(){
alert(this.name);
};
var obj_a = {
name: "FOO"
};
var obj_b = {
name: "BAR!!"
};
これで呼び出しができるようになりました。
myfunc.call(obj_a);
という警告が表示されます。
FOO
. その逆で
obj_b
は警告を発します。
BAR!!
. との違いは
.call()
と
.apply()
は、その
.call()
関数に引数を渡す場合はカンマ区切りのリスト、関数に引数を渡す場合は
.apply()
は配列が必要です。
myfunc.call(obj_a, 1, 2, 3);
myfunc.apply(obj_a, [1, 2, 3]);
したがって、簡単に関数を書くことができます
hook
を使用することで
apply()
メソッドを使用します。例えば、jQuerysにある機能を追加したい場合
.css()
メソッドを使用します。元の関数参照を保存し、カスタムコードで関数を上書きし、保存された関数を呼び出すことができます。
var _css = $.fn.css;
$.fn.css = function(){
alert('hooked!');
_css.apply(this, arguments);
};
マジックは
arguments
オブジェクトは配列のようなオブジェクトなので、それを
apply()
. この方法で、すべてのパラメータが元の関数に渡されることが保証されます。
関連
-
[解決済み】Facebook Graph API のクエリで with=location を使用すると "Uncaught (in promise) undefined" というエラーが発生する。
-
[解決済み] 解決済み】clearInterval()が動作しない [重複] [重複]
-
[解決済み】WebpackとBabelで「このファイルタイプを扱うには適切なローダーが必要な場合があります。
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] let "と "var "の使い分けは?
-
[解決済み] 関数内でグローバル変数を使用する
-
[解決済み] セレクタの子を取得する方法は?
-
[解決済み】別のウェブページにリダイレクトするにはどうすればいいですか?
最新
-
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 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】node.js TypeError: path must be absolute or specify root to res.sendFile [JSONのパースに失敗しました]。
-
[解決済み】JavaScriptで':'(コロン)は何をするのか?
-
[解決済み】JavaScriptのisset()に相当するもの
-
[解決済み】XMLHttpRequestモジュールが定義されていない/見つからない
-
[解決済み】Google Conversionsが動作しない - スクリプトが読み込まれない
-
[解決済み】エラー:リクエストのエンティティが大きすぎる
-
[解決済み】Vueのテンプレートまたはレンダー関数が定義されていない 私はどちらも使っていないのですが?
-
[解決済み】このオブジェクトの "forEach "はなぜ関数でないのですか?
-
[解決済み】HTMLの最初の行に予期しないトークン<がある。
-
[解決済み] [Solved] Uncaught Invariant Violation: 前のレンダリング中よりも多くのフックをレンダリングする