js中this指向問題 有例題

先做一下美團2019的題

var name = 'global'

var obj = .bind(window)
}var bar = new obj.foo()
settimeout((function()),0)
console.log(bar.name)
var bar3 = bar2 = bar
bar2.name = "foo2"
console.log(bar3.name)

function foo(num) 

foo.count = 0;
var i;
for (i=0; i<10; i++) 
} // foo: 6 
// foo: 7 
// foo: 8 
// foo: 9 
// foo 被呼叫了多少次？ console.log( foo.count ); // 0

this 在任何情況下都不指向函式的詞法作用域

function foo() 

function bar() 
foo(); // referenceerror: a is not defined 
//this無法呼叫bar

this 的繫結和函式宣告的位置沒有任何關係，只取決於函式的呼叫方式

當乙個函式被呼叫時，會建立乙個活動記錄（有時候也稱為執行上下文）。這個記錄會包 含函式在**被呼叫（呼叫棧）、函式的呼叫方法、傳入的引數等資訊。this 就是記錄的 其中乙個屬性，會在函式執行的過程中用到。

function baz() 

function bar() 
function foo() 
baz(); // <-- baz 的呼叫位置

（new 繫結） var bar = new foo()

函式是否在某個上下文物件中呼叫（隱式繫結）？如果是的話，this 繫結的是那個上 下文物件。 var bar = obj1.foo()

如果都不是的話，使用預設繫結。如果在嚴格模式下，就繫結到 undefined，否則繫結到 全域性物件。 var bar = foo()

this預設繫結到全域性，若this所在函式為嚴格模式，則不會預設繫結

function foo()  

var a = 2;
foo(); // 2

function foo() 

var obj = ;
obj.foo(); // 2

function foo() 

var obj = ;
var bar = obj.foo; // 函式別名！
var a = "oops, global"; // a 是全域性物件的屬性 
bar(); // "oops, global"

//但也不能解決隱式丟失

function foo() 
var obj = ;
foo.call( obj ); // 2

function foo(something) 

var obj = ;
var bar = foo.bind( obj ); ****繫結後呼叫bar，始終與obj繫結
var b = bar( 3 ); // 2 3
console.log( b ); // 5

建立（或者說構造）乙個全新的物件。

這個新物件會被執行 [[ 原型 ]] 連線。

這個新物件會繫結到函式呼叫的 this。

如果函式沒有返回其他物件，那麼 new 表示式中的函式呼叫會自動返回這個新物件。

function foo(a) 

var bar = new foo(2);
console.log( bar.a ); // 2

new繫結比隱式繫結優先順序更高

new和硬繫結。。。可以看書

硬繫結函式是否是被 new 呼叫，如果是的話就會使用新建立 的 this 替換硬繫結的 this。

被忽略的this

若是null就會呼叫預設繫結規則，一下就繫結到全域性中

function foo(a,b) // 把陣列「展開」成引數 

// 使用 bind(..) 進行柯里化
var bar = foo.bind( null, 2 ); 
bar( 3 ); // a:2, b:3

這樣就不會this繫結到其他物件上

function foo(a,b) // 我們的 dmz 空物件 var ø = object.create( null ); 

// 把陣列展開成引數
// a:2, b:3 
// 使用 bind(..) 進行柯里化
var bar = foo.bind( ø, 2 ); 
bar( 3 ); // a:2, b:3

間接引用最容易在賦值時發生：

function foo() 
var a = 2;
var o = ;
var p = ;
o.foo(); // 3 
(p.foo = o.foo)(); // 2

軟繫結就是在不用顯性繫結的情況下，預設繫結obj，其他顯性繫結可以修改this

function foo() 

var obj = ,
obj2 = ,
obj3 = ;
var fooobj = foo.softbind( obj ); 
fooobj(); // name: obj 
obj2.foo = foo.softbind(obj); 
obj2.foo(); // name: obj2 <---- 看！！！
fooobj.call( obj3 ); // name: obj3 <---- 看！
settimeout( obj2.foo, 10 ); // name: obj <---- 應用了軟繫結

箭頭函式的繫結無法被修改

箭頭函式會繼承外層函式呼叫的 this 繫結

function foo() ,100); 

}var obj = ;foo.call( obj ); // 2

JS中this指向問題

解析器在呼叫函式時,每次都會向函式內部傳遞進乙個隱含的引數,這個隱含的引數就是this,this指向的是乙個物件,這個物件我們稱之為函式執行的上下文物件,根據函式的呼叫方式不同,this會指向不同的物件.簡單來說一下函式中this指向問題,1.this是什麼?任何函式本質上都是通過某個物件來呼叫的,...

JS中this指向問題

函式內部的this之和函式的呼叫方式有關，和函式的定義方式沒有關係functionfn fn windowvar obj obj.fn obj functionfn 或者可以這樣寫自呼叫函式 functionfn div document.queryselector div div.onclick ...

JS中this指向問題

與其它語言相比，js的this關鍵字的指向稍微有點差別。一 全域性環境 首選我們要明確一點，在全域性環境中 在任意函式體外部 無論是嚴格模式還是非嚴格模式，this都指向window。下面，我們來通過幾個例子理解一下。示例1 console.log this 這裡的this在全域性域下，指向wind...