this 指向
在 js 中,將乙個變數賦值為null
和undefined
幾乎沒有什麼區別,它們都是虛值(falsy),在判斷語句中都會被轉為false
。
雖然它們非常類似,但是還是有一些區別的:
null
表示沒有物件,即該處沒有值。典型的用法是:
作為函式的引數,表示該函式的引數不是物件。
作為物件原型鏈的終點
object.
getprototype
(object.prototype)
;// null
undefined
表示缺少值,即是此處可能會有乙個值,但是還沒有定義。典型語法是:
變數被宣告了,但是沒有複製時,就等於undefined
呼叫函式時,應該提供的引數沒有提供,該引數就等於undefined
物件沒有賦值的屬性,該屬性的值為undefined
函式沒有返回值時,預設返回undefined
var i;
i // undefined
function
f(x)f(
)// undefined
var o =
newobject()
;o.p // undefined
var x =f(
);x // undefined
綜上,我們可以知道:
因此設定乙個值為null
是合理的,如:obj.val = null;
但是設定乙個值為undefined
是不合理的,如obj.val = undefined;
,因為在我們定義obj.val
之前,我們呼叫obj.val
同樣能夠得到undefined
,這樣做不是多此一舉了嗎。
因此,任何乙個存在引用的變數值為undefined
都是一件錯誤的事。
這樣,判斷乙個值是否存在,就可以使用obj.val === undefined
。
在一些使用廣泛的庫(比如jquery)中的深度拷貝函式會忽略undefined
而不會忽略null
,也是針對這個語義的理解。
ref:阮一峰部落格
函式的呼叫方式決定了this
的值(執行時繫結)。
es5 引入了bind
方法來設定函式的this
的值,es2015 引入了箭頭函式,箭頭函式不提供自身的this
繫結,this
的值將保持為閉合詞法上下文的值。
可以使用globalthis
來獲取全域性物件,無論**是否在當前上下文中執行。
在函式內部,this
的值取決於函式被呼叫的方式。
在嚴格模式下,如果進入執行環境時沒有設定this
的值,this
會保持為undefined
,如:
functionf2(
)f2()
=== undefined;
// true
functionf1(
)f1()
=== window;
// 在瀏覽器中,全域性物件是 windowf1(
)=== globalthis;
// 在 node 中
this
在 類 中的表現與在函式中類似,因為類本質上也是函式。
在類的構造器中,this
是乙個常規物件。類中所有非靜態的方法都會被新增到this
的原型中:
class
example
first()
second()
static
third()
}new
example()
;// ['constructor', 'first', 'second']
如:
function
foo1()
letfoo2=(
)=>
this
;let obj =
;//foo1 返回的 this 為 obj,foo2 返回的 this 為全域性物件,因為函式是根據執行的物件來繫結 this 的,而箭頭函式是建立的時候就繫結了上下文環境
console.
log(obj.
foo1()
, obj.
foo2()
);
// obj 物件中有乙個 foo 方法,這個方法中使用了箭頭函式返回了乙個 this
// 因此箭頭函式返回的這個 this 被繫結到了外層函式的 this
// 而 foo 的值可以在呼叫中設定,進而設定返回的 this
let obj =
}// 作為 obj 物件的乙個方法來呼叫,它的 this 會繫結到 obj 上
let fn = obj.
foo();
// fn === obj
// 但是,若只是引用 obj 方法,沒有呼叫它
let fn2 = obj.foo;
// 那麼呼叫箭頭函式後,this 指向 window,因為它從 foo 繼承了this。
fn2(
)=== window;
// true
當乙個函式用作建構函式時(使用new
關鍵字),它的this
被繫結到正在構造的新物件。
當函式被用作事件處理函式時,它的this
指向觸發事件的元素。
當**被內聯 on-event 處理函式 呼叫時,它的this
指向***所在的dom元素:
"alert(this.tagname.tolowercase());"
>
show this
<
/button>
上面的 alert 會顯示button
。
注意只有外層**中的this
是這樣設定的:
"alert((function())());"
>
show inner this
<
/button>
在這種情況下,沒有設定內部函式的this
,所以它指向global/window
物件(即非嚴格模式下呼叫的函式未設定this
時指向的預設物件)。
這種情況下,若想要正確設定this
,可以使用bind
:
"alert((function()).bind(this)());"
>
show inner this
<
/button>
ref: mdn 知識點雜記
三 c 相關 1.qstring與qchar類 關於qchar類詳細的文章 1 qchar轉char型別 char a qchar qch a qch.tolatin1 qchar char 還有 toutf82 qstring轉qchar型別 qstring str abcde qchar b n...
前端知識點雜記
css display屬性 block css1 塊物件的預設值。將物件強制作為塊物件呈遞,為物件之後新增新行 可以定義高度和寬度 none css1 隱藏物件。與 visibility 屬性的hidden值不同,其不為被隱藏的物件保留其物理空間 inline css1 內聯物件的預設值。將物件強制...
Python 知識點雜記
輸入以空格分隔的陣列時,可使用字串的split函式按空格分隔,例如dir input split 得到了陣列dir 但是該陣列是以字串形式儲存的,所以此時,我們可以使用map函式,例 dir map int,input split 來獲得乙個int陣列。或者,如果需要使用數量已知的變數去儲存,可以直...