js中期知識點總結10月31日 javascript中有關this的解析題
javascript中有關this的解析題
1.作用域鏈
作用域：瀏覽器給js一個生存環境（棧）記憶體
作用域鏈：js中的關鍵字var function 都可以提前宣告和定義，提前宣告和定義，放在我們的記憶體地址（堆）記憶體中，然後js從上到下逐行執行，遇到變數就去記憶體地址查詢是否存在這個變數有就直接使用，沒有就繼續向父級查詢，直到window下結束，這種查詢機制叫作用域鏈
this的目的：js程式碼中存在大量的變數和函式，我們在只用他們的時候他們到底歸屬誰
this （ this是js的關鍵字，指定一個物件，然後去代替他）
1.this分為函式內的this，函式外的this
函式內的this，指向行為發生的主體（方法）
函式外的this，都指向window （沒有意思）
2.函式的this和函式在什麼環境下定義的沒有關係，而和自己的主體有關
3.主體怎麼找？ 就看這個函式帶沒帶"." 如果函式和方法執行帶".",那麼this指向"."前面的物件，如果不帶點，this就指向window
4.自執行函式裡面的this都指向window
小技巧：this個變數的面試題，先找到this的主體是誰，然後把它們換成那個主體就行了
5.給元素中的某一個事件的繫結方法，
當事件觸發時，就執行繫結的方法，方法中的this指向當前元素；
總結：怎樣找到this的指函式內
函式內的this跟函式在哪定義沒有關係，只跟在執行時的主體有關，帶點的主體就是"."前面的，不帶"."就是window
案例分析：
1.
var a={
chifan:function(){
console.log(this);
}
}
a.chifan() （ 這裡面的this a就是主體，因為他在"."前面）
function chifan{
console.log(this)
}
chifan() （這個裡面沒帶點，所以指向this指向window）
2.var num=45;
var obj={
num=12,
ff:(function(){
console.log(this.num)
})() 其結果為45； （因為他是自呼叫，所以它的this指向window）
var um=45;
var obj={
um:12,
ff:function(){
console.log(this.um)
}
}
obj.ff() 其結果為12； （"." 因為有點，所以this指向它點前面就是他的物件）
3. body中輸入
<div id="div1"> hello world</div>
function fn(){
console.log(this) （其this指向的物件是div1 後面跟的語句為document.getElementById("div1").onclick=fn; 他的前面有"."）
}
document.getElementById("div1").onclick=function(){
console.log(this); （其this指向的物件是div1 因為"."在他的前面）
fn() (其this的指向的物件是window，因為沒"." )
}
document.getElementById("div1").onclick=fn;
4.奇虎360的一道經典面試題
1） var val=1;
var obj={
val:2,
del:function(){
console.log(this); this指的是物件obj
this.val*=2
console.log(val) （因為沒有this，所以是一道作用域的題，內部沒有宣告val這個變數，所以去父級找，結果是1）
console.log(this.val) （有this，因為"." 所以他的物件是obj ， obj中val的值為2，所以其結果是4）
}
}
var ff=obj.del()
2） var val=1;
var obj={
val:2,
del:function(){
console.log(this); this指定的window；
this.val*=5 window的val被賦值為5*1（1是val全域性的值） 最後的結果是val被賦值了5
console.log(val) （全域性下的val） 所以結果是5
console.log(this.val) （全域性下的val） 所以結果是5
}
}
var fn=obj.del;
fn()
最後說一下var ff=obj.del()與var fn=obj.des;fn()的區別
var ff=obj.del() 說的是宣告一個變數 將obj為物件的del()函式賦值給ff；
var fn=obj.del;fn() 說的是宣告一個變數將obj為物件的del以匿名函式賦值給fn, 因為沒"." 所以fn（）是在window下的
1.作用域鏈
作用域：瀏覽器給js一個生存環境（棧）記憶體
作用域鏈：js中的關鍵字var function 都可以提前宣告和定義，提前宣告和定義，放在我們的記憶體地址（堆）記憶體中，然後js從上到下逐行執行，遇到變數就去記憶體地址查詢是否存在這個變數有就直接使用，沒有就繼續向父級查詢，直到window下結束，這種查詢機制叫作用域鏈
this的目的：js程式碼中存在大量的變數和函式，我們在只用他們的時候他們到底歸屬誰
this （ this是js的關鍵字，指定一個物件，然後去代替他）
1.this分為函式內的this，函式外的this
函式內的this，指向行為發生的主體（方法）
函式外的this，都指向window （沒有意思）
2.函式的this和函式在什麼環境下定義的沒有關係，而和自己的主體有關
3.主體怎麼找？ 就看這個函式帶沒帶"." 如果函式和方法執行帶".",那麼this指向"."前面的物件，如果不帶點，this就指向window
4.自執行函式裡面的this都指向window
小技巧：this個變數的面試題，先找到this的主體是誰，然後把它們換成那個主體就行了
5.給元素中的某一個事件的繫結方法，
當事件觸發時，就執行繫結的方法，方法中的this指向當前元素；
總結：怎樣找到this的指函式內
函式內的this跟函式在哪定義沒有關係，只跟在執行時的主體有關，帶點的主體就是"."前面的，不帶"."就是window
案例分析：
1.
var a={
chifan:function(){
console.log(this);
}
}
a.chifan() （ 這裡面的this a就是主體，因為他在"."前面）
function chifan{
console.log(this)
}
chifan() （這個裡面沒帶點，所以指向this指向window）
2.var num=45;
var obj={
num=12,
ff:(function(){
console.log(this.num)
})() 其結果為45； （因為他是自呼叫，所以它的this指向window）
var um=45;
var obj={
um:12,
ff:function(){
console.log(this.um)
}
}
obj.ff() 其結果為12； （"." 因為有點，所以this指向它點前面就是他的物件）
3. body中輸入
<div id="div1"> hello world</div>
function fn(){
console.log(this) （其this指向的物件是div1 後面跟的語句為document.getElementById("div1").onclick=fn; 他的前面有"."）
}
document.getElementById("div1").onclick=function(){
console.log(this); （其this指向的物件是div1 因為"."在他的前面）
fn() (其this的指向的物件是window，因為沒"." )
}
document.getElementById("div1").onclick=fn;
4.奇虎360的一道經典面試題
1） var val=1;
var obj={
val:2,
del:function(){
console.log(this); this指的是物件obj
this.val*=2
console.log(val) （因為沒有this，所以是一道作用域的題，內部沒有宣告val這個變數，所以去父級找，結果是1）
console.log(this.val) （有this，因為"." 所以他的物件是obj ， obj中val的值為2，所以其結果是4）
}
}
var ff=obj.del()
2） var val=1;
var obj={
val:2,
del:function(){
console.log(this); this指定的window；
this.val*=5 window的val被賦值為5*1（1是val全域性的值） 最後的結果是val被賦值了5
console.log(val) （全域性下的val） 所以結果是5
console.log(this.val) （全域性下的val） 所以結果是5
}
}
var fn=obj.del;
fn()
最後說一下var ff=obj.del()與var fn=obj.des;fn()的區別
var ff=obj.del() 說的是宣告一個變數 將obj為物件的del()函式賦值給ff；
var fn=obj.del;fn() 說的是宣告一個變數將obj為物件的del以匿名函式賦值給fn, 因為沒"." 所以fn（）是在window下的