、Undefined類型
Undefined類型只有一個值,即特殊的undefined值。在使用var聲明變量但未對其加以初始化時,這個變量的值就是undefined,例如:
var message; alert(message==undefined); //true
這個例子只生命了變量message,但未對其進(jìn)行初始化。比較這個變量與undefined字面量,結(jié)果表明它們是相等的。這個例子與下面的例子是等價的:
var message=undefined; alert(message==undefined); //true
這個例子使用undefined值顯式初始化了變量message。但我們沒有必要這么做,因為未經(jīng)初始化的值默認(rèn)就會取得undefined值。
一般而言,不存在需要顯式地把一個變量設(shè)置為undefined值的情況。字面值undefined的主要目的是用于比較,而ECMA-262第3版之前的版本中并沒有規(guī)定這個值。第3版引入這個值是為了正式區(qū)分空對象指針與未經(jīng)初始化的變量。
二、未初始化的變量與尚未定義的變量
不過,未初始化的變量與尚未定義的變量是不一樣的,看看下面這個例子:
var message; //var age; alert(message); //"undefined" alert(age); //產(chǎn)生錯誤
運行以上代碼,第一個警告框會顯示變量message的值,即“undefined”。而第二個警告框,由于傳遞給alert()函數(shù)的是尚未聲明的變量age,則會導(dǎo)致拋出一個錯誤。對于尚未聲明過的變量,只能執(zhí)行一項操作,即使用typeof操作符檢測其數(shù)據(jù)類型(對未經(jīng)聲明的變量調(diào)用delete不會導(dǎo)致錯誤,但這樣做沒什么實際意義,而且在嚴(yán)格模式下確實會導(dǎo)致錯誤)。
然而,令人困惑的是:對未經(jīng)初始化的變量執(zhí)行typeof操作符會返回undefined值,而對未聲明的變量執(zhí)行typeof操作符同樣也會返回undefined值。來看下面的例子:
var message; //var age alert(typeof message); //"undefined" alert(typeof age); //"undefined"
結(jié)果表明,對未經(jīng)初始化和未聲明的變量執(zhí)行typeof操作符都返回了undefined值,這個結(jié)果有其邏輯上的合理性。因為雖然這兩種變量從技術(shù)角度看有本質(zhì)區(qū)別,但實際上無論對哪種變量也不可能執(zhí)行真正的操作。
即便未初始化的變量會自動被賦予undefined值,但顯示地初始化變量依然是明智的選擇。如果能夠做到這一點,那么當(dāng)typeof操作符返回“undefined”值時,我們就知道被檢測的變量還沒有被聲明,而不是尚未初始化。
篇文章給童靴們講解了typeof操作符的用法,從這篇開始我們分六篇詳細(xì)講解js數(shù)據(jù)類型 。
Undefined只有一個特殊的值,就是undefined。在使用var變量聲明變量但是并沒有給其初始化時,它的值就是undefined。
var message;
console.log(message==undefined); //true
上面的栗子只聲明了一個變量message,沒有給它初始化。我們在控制臺輸出變量message與字面量undefined比較后的結(jié)果是相等的。這個栗子與下面的栗子等價的:
var message=undefined;
console.log(message==undefined); //true
上面的栗子給message初始化一個值undefined,結(jié)果也是一樣的。不過我們不需要如此麻煩,一個沒有初始化的值默認(rèn)會取undefined值。
童靴們還要注意的是,沒有初始化的變量和尚未定義的變量還是不一樣的。我們舉個栗子區(qū)分一下:
//var age;
console.log(age) //產(chǎn)生錯誤
var name;
console.log(name); //undefined
上面栗子中第一段代碼,因為age是注釋的,并沒有聲明變量age,所以在控制臺中輸出會導(dǎo)致一個錯誤:
控制臺報錯
第二段代碼聲明了一個變量name,所以在控制臺中會顯示name的值undefined:
對尚未聲明的變量,我們只能執(zhí)行一項操作就是typeof操作符檢測其類型。另大家都疑惑的是,未初始化的變量執(zhí)行typeof操作符返回的值是undefined,而沒有聲明的變量執(zhí)行typeof操作符也會返回undefined。
var name;
//var age
console.log(typeof name) //undefined
console.log(typeof age) //undefined
這種結(jié)果可能童靴們會疑惑,其實還是有一定邏輯上的合理性的。雖然它們在技術(shù)角度看有本質(zhì)的區(qū)別,但是這兩種變量都是不可能執(zhí)行真正的操作。
愛學(xué)習(xí)的孩子運氣不會差哦~
關(guān)注小白前端,持續(xù)收到文章推送!
vue與axios直接在html文件中使用的時候,位于axios的請求中的this指向并不是指向vue,而是指向window,如果在請求中直接用this獲取data中的數(shù)據(jù)會出現(xiàn)undefined的問題,解決思路是將ES5的函數(shù)語法更換為箭頭函數(shù)即可解決此問題,深層的原因就得深入去了解箭頭函數(shù)和普通函數(shù)之間的區(qū)別了!
案例:
new Vue({
el: '#app',
data:{
carousels: [],
},
created() {
axios.get('/api/banners/').then(function (response) {
// 這里的this.carousels是undefined,因此上下邊的賦值是不起作用的
this.carousels=res.data
}).catch(function (error) {
console.log(err)
});
},
})
以上案例可以發(fā)現(xiàn)在axios中使用this獲取data中的值是獲取不到的,這就是this的指向問題造成的,他不是指向vue,只需要修改如下,將function函數(shù)改為箭頭函數(shù)即可解決!
修改代碼如下:
new Vue({
el: '#app',
data:{
carousels: [],
},
created() {
axios.get('/api/banners/').then(res=> {
this.carousels=res.data
}).catch(err=> {
console.log(err)
});
},
})
到此問題就解決了!
*請認(rèn)真填寫需求信息,我們會在24小時內(nèi)與您取得聯(lián)系。