this
this
もし "これ "を表現するのであれば:
関数が呼び出されると、アクティビティ記録が作成されます。
- this」の実態はthisがどのように(関数呼び出し時に)生成されるかであり、thisの生成には前述の関数である父親が存在しなければならないことは理解しています。しかし、この関数はthisの鍵であり、いつ、どこで呼ばれるかも重要です。
このレコードには、関数が呼び出された場所、関数が呼び出された方法、渡された引数などの情報が含まれます。
- 私は、thisは thisそのものに関する情報だと理解しています。
thisは、関数の実行中に使用されるレコードの属性の1つです。
- 私は thisの thisは thisが使用されているこのレコードの属性であると理解しています。
this
- thisは、オブジェクト参照を暗黙的に "渡す "よりエレガントな方法を提供するので、APIをより簡潔で再利用しやすいように設計することができます。特にコールバック関数では、thisを指定する場所に注意してください。
function aa(ctx){
console.log(ctx.name)
}
function bb (){
console.log(this.name)
}
var ctx={name:"marco is dashuaibi"}
aa(ctx)
aa.call(ctx)
this
まず、thisが何を指しているのか、つまり、前述したように父親は誰なのか、父親はあなたをどこで作ったのか。
デフォルトのバインディング。「strictモードの場合、thisは未定義です。
暗黙結合
function foo() { console.log( this.a ); } var obj = { a: 2, foo: foo }; obj.foo(); // 2
- 暗損
明示結合
- call
call() メソッドは、指定された this 値と、個別に指定された 1 つ以上の引数で関数を呼び出します。this Arg, arg1, arg2, ...)
Function.prototype.myCall = function(thisArg, ...args) { const fn = Symbol('fn') // fnが既存のプロパティをオーバーライドしないように、ユニークなSymbolプロパティを宣言する。 thisArg = thisArg || window // thisが渡されない場合、デフォルトでウィンドウオブジェクトにバインドされる。 thisArg[fn] = this // thisこれは呼び出しを指すオブジェクトであり、つまりthisが指す関数は変更される。 const result = thisArg[fn](...args) // 現在の関数を実行する delete thisArg[fn] // 宣言されたfn属性を削除する return result // 関数の実行結果を返す。 }
- apply
apply() メソッドは、与えられた this 値と配列として与えられた引数で関数を呼び出します。 構文: func.apply(this Arg, [argsArray])
Function.prototype.myApply = function(thisArg, args) { const fn = Symbol('fn') // fnが既存のプロパティをオーバーライドしないように、ユニークなSymbolプロパティを宣言する。 thisArg = thisArg || window // thisが渡されない場合、デフォルトでウィンドウオブジェクトにバインドされる。 thisArg[fn] = this // thisを呼び出すオブジェクト、つまりthisが指す関数を変更するオブジェクトに継承する。 const result = thisArg[fn](...args) // 現在の関数を実行する delete thisArg[fn] // 宣言されたfn属性を削除する return result // 関数の実行結果を返す。 }
- ハードバインディングはディスプレイバインディングの一種である > bind() メソッドはバインドの最初のパラメータを持つ新しい関数を作成し、残りのパラメータは新しい関数が呼び出されたときにその引数として使用される。構文: function.bind(thisArg, arg1, arg2, ...)コリアライゼーションによく使われる ``` はMDNが提供するポリフィルである。 if (!Function.prototype.bind) { Function.prototype.bind = function(oThis) { if (typeof this !== "function") { throw new TypeError( "Function.prototype.bind - what is trying " + "to be bound is not callable" ); } var aArgs = Array.prototype.slice.call( arguments, 1 ), fToBind = this, fNOP = function(){}, fBound = function(){ return fToBind.apply( ( this instanceof fNOP && oThis ? this : oThis ), aArgs.concat( Array.prototype.slice.call( arguments ) ); } ; fNOP.prototype = this.prototype; fBound.prototype = new fNOP(); return fBound; }; } ``` - new 1. は完全に新しいオブジェクトを生成する。 2. この新しいオブジェクトが実行される[[ ]] 3. この新しいオブジェクトは、関数呼び出しのthisにバインドされる。 4. 関数が他のオブジェクトを返さない場合、new式の関数呼び出しは自動的に新しいオブジェクトを返す。 ``` function foo(a) { this.a = a; } var bar = new foo(2); console.log( bar.a ); // 2 ```
優先順位:バインド > 新規 > 暗黙
- call
polyfill
if (!Function.prototype.softBind) {
Function.prototype.softBind = function(obj) {
var fn = this; // すべてのcurried引数をキャッチする
var curried = [].slice.call( arguments, 1 );
var bound = function() {
return fn.apply( (!this || this === (window || global)) ? obj : this
curried.concat.apply( curried, arguments ) );
};
bound.prototype = Object.create( fn.prototype );
return bound;
};
}
- アロー関数は外部スコープに基づいて thisを決定し、バインディングを使用することはできません。はバインディングを使用できません。
- アロー関数はプロトタイプを持たないので、その thisは外側の