Analisis perbandingan mudah tentang penggunaan apply, call dan ini dalam kemahiran JavaScript_javascript

1.guna definisi

gunakan: Panggil fungsi, gantikan nilai fungsi ini dengan objek yang ditentukan, dan gantikan parameter fungsi dengan tatasusunan yang ditentukan.
Sintaks: apply([thisObj[,argArray]])
thisObj
Pilihan. Objek untuk digunakan sebagai objek ini.

argArray
Pilihan. Satu set hujah untuk dihantar ke fungsi.

2.takrif panggilan

panggilan: Panggil kaedah objek dan gantikan objek semasa dengan objek lain.
Sintaks: panggil([thisObj[, arg1[, arg2[, [, argN]]]]])
thisObj
Pilihan. Objek yang akan digunakan sebagai objek semasa.

arg1, arg2, , argN
Pilihan. Senarai parameter yang akan dihantar ke kaedah.

3. Perbezaan antara keduanya

Parameter panggilan kedua boleh daripada sebarang jenis, manakala parameter kedua permohonan mestilah tatasusunan atau argumen.
Terdapat juga perbezaan dalam definisi.

4. Contoh analisis

(1) Contoh rasmi:

function callMe(arg1, arg2){
  var s = "";

  s += "this value: " + this;
  s += "<br />";
  for (i in callMe.arguments) {
    s += "arguments: " + callMe.arguments[i];
    s += "<br />";
  }
  return s;
}

document.write("Original function: <br/>");
document.write(callMe(1, 2));
document.write("<br/>");

document.write("Function called with apply: <br/>");
document.write(callMe.apply(3, [ 4, 5 ]));
document.write(callMe.call(3, 4, 5 ));
// Output: // Original function: // this value: [object Window] // arguments: 1 // arguments: 2 // Function called with apply: // this value: 3 // arguments: 4 // arguments: 5

Yang pertama menggunakan apply: Definisi: Panggil fungsi dan gantikan nilai fungsi ini dengan objek yang ditentukan
Panggil fungsi callMe dan gantikan ini dalam fungsi callMe dengan objek yang ditentukan 3. Pada masa ini, ini di sini berubah daripada [Tetingkap objek] sebelumnya kepada 3.
Yang pertama menggunakan panggilan: Definisi: Panggil kaedah objek dan gantikan objek semasa dengan objek lain.
Panggil kaedah objek callMe dan gantikan objek dalam callMe dengan objek lain 3.
Daripada analisis keputusan ini, dapat dilihat bahawa kedua-duanya menggunakan objek dalam objek yang ditentukan atau nilai yang ditentukan untuk menukar ini dalam objek.
Ia juga boleh dikatakan bahawa objek (ini) dalam fungsi "hijack" objek (ini) dalam fungsi lain untuk dilaksanakan.
Malah, ini menimbulkan persoalan: Apakah sebenarnya ini? Mengapa begitu penting untuk melalui begitu banyak masalah untuk mengubah hala tujunya lagi dan lagi?

(2) Contoh:

function zqz(a,b){
  return alert(a+b);
}
function zqz_1(a,b){
  zqz.apply(zqz_1,[a,b])
}
zqz_1(1,2)  //->3 

Analisis: Mengikut definisi: panggil fungsi dan gantikan nilai fungsi ini dengan objek yang ditentukan,
Di sini fungsi zqz dipanggil dan nilai fungsi zqz ini digantikan dengan objek yang ditentukan zqz_1.

Sila ambil perhatian bahawa nama fungsi dalam js sebenarnya adalah objek, kerana nama fungsi adalah rujukan kepada objek Fungsi!

function add(a, b)
{
 alert(a + b);
}
function sub(a, b)
{
 alert(a - b);
}
add.call(sub, 3, 1); // 4

Analisis: Mengikut definisi: Panggil kaedah objek dan gantikan objek semasa dengan objek lain.
Berikut ialah kaedah memanggil objek tambah dan menggantikan sub objek semasa dengan objek tambah;

Contoh lain:

function zqz(a,b){
  this.name=a;
  this.age=b;
  alert(this.name+" "+this.age);
}
function zqz_1(a,b){
  zqz.apply(this,[a,b])   //我们亦可以这么写  zqz.apply(this,arguments) 
}
zqz_1("Nic",12)  //Nic 12

Analisis: Mengikut definisi: panggil fungsi dan gantikan nilai fungsi ini dengan objek yang ditentukan,
Di sini, fungsi zqz dipanggil, menggunakan objek yang ditentukan ini untuk menggantikan fungsi ini zqz.

Contoh lain:

<input type="text" id="myText"  value="input text">
function Obj(){
  this.value="对象！";
}
var value="global 变量";
function Fun1(){
  alert(this.value);
}
Fun1();  //global 变量
Fun1.call(window); //global 变量
Fun1.call(document.getElementById('myText')); //input text
Fun1.call(new Obj());  //对象！
Fun1(); //global 变量

Analisis: Definisi: Panggil kaedah objek untuk menggantikan objek semasa dengan objek lain.

Panggil kaedah objek Fun1 untuk menggantikan objek semasa dalam Fun1 dengan objek tetingkap.
Panggil kaedah objek Fun1 dan gantikan objek semasa dalam Fun1 dengan objek dalam input.
Panggil kaedah objek Fun1 dan gantikan objek dalam Fun1 semasa dengan objek dalam obj baharu.

Mari kita lihat soalan yang ditimbulkan oleh seorang netizen:

Kaedah panggilan boleh digunakan untuk memanggil kaedah bagi pihak objek lain. Kaedah panggilan menukar konteks objek fungsi daripada konteks awal kepada objek baharu yang ditentukan oleh thisObj. Jika parameter thisObj tidak disediakan, objek Global digunakan sebagai thisObj.

Kemudian saya mengambil tanggungjawab sendiri untuk menulis kes, tetapi apa yang saya tulis berbeza daripada apa yang saya bayangkan adalah seperti berikut

 function parent()
 {
 alert(this.name);
 }
 function child()
 {
 var name = '张三';
 };
 
 parent.call(child); 

Apa yang dia keluarkan ialah kanak-kanak. Mengapa tidak Zhang San mengikut ayat di atas, konteks ibu bapa telah menjadi anak

Dan terdapat nilai nama dalam kanak-kanak Keluaran mestilah Zhang San. Sila jelaskan

 
 function parent()
 {
 alert(this.name);
 }
 function child()
 {
 this.name = '张三';
 };
 var p1 = new child();
 
 parent.call(p1); 

Ini boleh mengeluarkan Zhang San Why?

Jom lihat apa yang berlaku

Penggunaan panggilan dan gunakan ialah ia boleh dipanggil menggunakan pembolehubah sebagai nama fungsi. Sebagai contoh, fungsi panggil balik fungsi. Penggunaan khusus ialah: executed function.call(a,b,c...), di mana a ialah objek yang ini perlu dinyatakan dalam fungsi yang dilaksanakan, yang boleh menjadi batal, dan parameter lain digunakan sebagai parameter bagi fungsi yang dilaksanakan. Penggunaan apply adalah serupa, kecuali parameter kedua ialah tatasusunan.

Contoh:

function doPost(url,param,callback){
  //这里处理post请求
  var str = xhr.responseText;
  callback.apply(this,[str]);//相当于调用了callback(str);并把callback中的this设定为doPost对象
}