Rumah  >  Artikel  >  hujung hadapan web  >  Analisis contoh penggunaan fungsi JS kemahiran this_javascript

Analisis contoh penggunaan fungsi JS kemahiran this_javascript

WBOY
WBOYasal
2016-05-16 16:15:421072semak imbas

Contoh dalam artikel ini menerangkan penggunaan fungsi JS ini. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Apabila menulis fungsi dalam js, ini banyak digunakan Apakah ini kata kunci dan penunjuk, menunjuk kepada skop persekitaran pelaksanaan, juga dipanggil konteks.
Mari kita bincangkan tentang fungsi dahulu. Pemahaman peribadi saya ialah fungsi ialah blok kod yang dipanggil berulang kali dalam bahasa.
Dalam JS, apabila memberikan fungsi kepada sifat objek, ia dipanggil kaedah
Seperti:

var m={};
m.title='title';
m.show=function(){
alert(this.title)
}
m.show()

Adalah untuk memanggil fungsi sebagai kaedah objek m
Dalam kes ini, ini menunjukkan kepada objek m.

Memanggil nama fungsi secara langsung dipanggil fungsi:

var a=1212;
function show(){
alert(a)//1212
}
show()// 1212

Dalam persekitaran global, pembolehubah global boleh difahami sebagai sifat tetingkap, dan fungsi global ialah kaedah tetingkap
Lihat contoh di bawah:

var m ={};
m.id='mmm';
m.show=function(){
  alert(this.id);
}
var a={};
a.id='aaa';
a.show=m.show;
a.show(); //aaa

a.show=m.show;  先理解这句话,因为函数是个对象,
m.show=function(){
  alert(this.id)
}

Ungkapan ini bersamaan dengan a.show dan m.show secara serentak merujuk

function(){
  alert(this.id)
}

sebenarnya bersamaan dengan

a.show=function(){
  alert(this.id)
}

Jadi apabila memanggil a.show(), ini menunjuk ke objek,
Lihatlah berangan berikut

var m ={};
m.id='mmm'
m.show=function(){
  alert(this.id)
}
var a={}
a.id='aaa'
a.show=function(){
  m.show()
};
a.show(); //mmm

Jadi apabila memanggil a.show(), ia bersamaan dengan memanggil kaedah m.show(), jadi ini menunjuk ke objek m.

Lihat contoh berikut sekali lagi saya masih tidak faham pada mulanya

var color='red';
var app = {};
app.color="green";
app.paint=function(node){
node.style.color=this.color;
  alert(this.color);
}
function findNode(callback){
  var btn =document.querySelector('.btn');
  callback(btn);//传进来,
}
findNode(app.paint);
alert(this.color); //red 而不是green

Apabila parameter fungsi diluluskan, parameter diluluskan mengikut nilai, bukan dengan rujukan

Jadi apabila findNode(app.paint); ia sebenarnya

function(node){
  node.style.color=this.color;
  alert(this.color);
}
Rujukan

dan kerana findNode ditakrifkan secara global, ini menunjukkan kepada WINDOW ATAU UNDEFINED

Perihal menghantar parameter, luluskannya mengikut nilai

function show(a){
  alert(a)
}

Mudah difahami apabila parameter adalah jenis data asas

var b=10;
show(b)//alert(10);

Bagi objek

var c ={};
c.prop=true;
var showProp=function(obj){
obj.prop=false
}
showProp(c); //c.prop = false

Sesetengah orang berpendapat bahawa contoh di atas menghantar parameter melalui rujukan
Sebenarnya, parameter di atas masih diteruskan oleh nilai Apabila showProp(c) melepasi c ke dalam fungsi, c sebenarnya bersamaan dengan rujukan dalam fungsi adalah bersamaan dengan menukar objek yang dirujuk kepada {prop: palsu}

Lihat contoh berikut

var c ={};
c.prop=true;
var showProp=function(obj){
  obj = new Object();
  obj.prop=false
  return obj;
}
showProp(c);
alert(c.prop); //true

Obj masuk telah diubah suai di sini Jika parameter diluluskan dengan rujukan mengikut fungsi, pengubahsuaian dalam fungsi pasti akan ditunjukkan secara luaran

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn