JavaScriptの2つの非継承メソッドの使用例を詳しく解説

1. 各関数には、apply() と call() という 2 つの非継承メソッドが含まれています。

2. これらは同じ目的を持ち、すべて特定のスコープ内の関数を呼び出します。

3. apply() は 2 つのパラメーターを受け取ります。1 つは関数が実行されるスコープ (this) で、もう 1 つはパラメーター配列です。

call() メソッドの最初のパラメータは apply() メソッドと同じですが、関数に渡されるパラメータはリストされている必要があります。 例 1:

window.firstName = "diz"; 
window.lastName = "song"; 
var myObject = { firstName: "my", lastName: "Object" }; 
function HelloName() { 
　　console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!"); 
} 
HelloName.call(window); //huo .call(this); 
HelloName.call(myObject);

実行結果は次のとおりです:

Hello diz song glad to meet you! 
Hello my Object glad to meet you!

例 2:

function sum(num1, num2) { 
return num1 + num2; 
} 
console.log(sum.call(window, 10, 10)); //20 
console.log(sum.apply(window,[10,20])); //30

分析: 例 1 では、apply() と call() の実際の使用は、関数を拡張してスコープを実行することであることがわかりました。従来の方法を使用して実装したい場合は、以下のコードを参照してください:

window.firstName = "diz"; 
window.lastName = "song"; 
var myObject = { firstName: "my", lastName: "Object" }; 
function HelloName() { 
console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!"); 
} 
HelloName(); //Hello diz song glad to meet you! 
myObject.HelloName = HelloName; 
myObject.HelloName(); //Hello my Object glad to meet you!

赤いコードを参照してください。オブジェクト myObject に HelloName() 関数のスコープを作成するには、次のことが必要であることがわかりました。 myObject を動的に作成する HelloName 属性は、HelloName() 関数へのポインタとして機能します。このようにして、myObject.HelloName() を呼び出すと、関数内の this 変数は myObject を指し、オブジェクトの他の内部パブリック プロパティを指定できます。と呼ばれた。
例 2 を分析すると、call() 関数と apply() 関数の実際の適用例がわかります。実際のプロジェクトでは、実際の状況に応じて柔軟に処理する必要があります。
小さな質問: 関数で関数を定義するときに this 変数をもう一度見てください

function temp1() { 
console.log(this); //Object {} 
function temp2() { 
console.log(this); //Window 
} 
temp2(); 
} 
var Obj = {}; 
temp1.call(Obj); //运行结果见上面的注释！！！！

実行結果は次と同じです:

function temp1() { 
console.log(this); 
temp2(); 
} 
function temp2() { 
console.log(this); 
} 
var Obj = {}; 
temp1.call(Obj);

以上がJavaScriptの2つの非継承メソッドの使用例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。