1、背景:
在ES6之前聲明一個(gè)變量都是用var進(jìn)行聲明筷黔,但是由于var聲明變量具有變量提升作用往史,無論是在代碼后面聲明還是前面聲明,又或者聲明一個(gè)塊級(jí)作用域中的變量佛舱,都會(huì)將變量提升椎例,導(dǎo)致容易變成全局變量。
1请祖、執(zhí)行在后
var a=1 //全局變量,聲明和賦值一起
console.log(a)
//打印出1
2订歪、執(zhí)行在前
console.log(a)
var a=1
//var a 能進(jìn)行變量提升,將a先聲明肆捕,運(yùn)行console.log(a),之后才賦值刷晋,所以打印出是undefined
如果想變量只作用在塊級(jí)作用域,ES6之前使用var都會(huì)進(jìn)行變量提升慎陵,因此需要結(jié)合使用立即執(zhí)行函數(shù)才能實(shí)現(xiàn)方法眼虱,相當(dāng)麻煩。
{
var a=1 //因?yàn)樽兞刻嵘Γ惶嵘阶饔糜蛲饷婺笮瑹o法實(shí)現(xiàn)
}
如果使用函數(shù)進(jìn)行包裹,雖然對(duì)變量a進(jìn)行實(shí)現(xiàn)塊級(jí)作用域,但是對(duì)于函數(shù)x來說又是一個(gè)全局變量润梯,多次一舉过牙。
function x(){
var a=1
window.jack=function(){
console.log(a)
}
}
最后只能結(jié)合立即執(zhí)行函數(shù)來實(shí)現(xiàn)甥厦。
( function x(){
var a=1
window.jack=function(){
console.log(a)
}
}())
總結(jié):你看看想要實(shí)現(xiàn)一個(gè)變量只在塊級(jí)作用域中,需要那么麻煩寇钉,因此ES6誕生了let和const刀疙。
2、let的使用
{
let a=1
console.log(a) //打印出1
}
//就那么簡(jiǎn)單實(shí)現(xiàn)塊級(jí)作用域變量扫倡,只在這個(gè)范圍有用
(1)谦秧、超過塊級(jí)作用域使用,報(bào)錯(cuò)镊辕,無效
{
let a=1
}
console.log(a)
//報(bào)錯(cuò):a is not defined
(2)油够、未聲明先使用,報(bào)錯(cuò)
console.log(a)
let a=1
//報(bào)錯(cuò):a is not defined
3征懈、const的使用
和let使用基本差不多石咬,唯一區(qū)別是const只有一次賦值機(jī)會(huì),而且必須在聲明的時(shí)候立馬賦值
{
const a=1
}
最后總結(jié)一下:var卖哎、let鬼悠、const區(qū)別
(1)、var是ES5語法亏娜,let是ES6語法
(2)焕窝、var定義變量是函數(shù)作用越(全局變量),let定義變量是塊級(jí)作用域
(3)维贺、var有變量提升它掂,let沒有變量提升
(4)、var可以重復(fù)聲明溯泣,let不能重復(fù)聲明
(5)虐秋、let可以重新賦值,const不能重復(fù)賦值
4垃沦、經(jīng)典題目:
(1)
var a=1
function fn(){
console.log (a)
}
a=2
fn()
//打印出來是2
修改成下面
var a=1
function fn(){
console.log (a)
}
fn()
a=2
//打印出來是1
這里主要是涉及一個(gè)執(zhí)行順序問題客给,所以打印出什么要看代碼執(zhí)行順序是怎么樣的
(2)
<button id='x'>aa</button>
<script>
// 0、1肢簿、2靶剑、3、4池充、5桩引,退出循環(huán)是6
for(var i=0;i<6;i++){
function fn(){
console.log(i) //打印出i=6
}
x.onclick=fn
}
</script>
你會(huì)疑惑為啥打印不是0、1收夸、2坑匠、3、4咱圆、5笛辟,這里涉及到代碼執(zhí)行時(shí)間問題,當(dāng)我們想執(zhí)行代碼時(shí)候i早就變成了6序苏。
<button id='x'>aa</button>
<script>
for(let i=0;i<6;i++){ //用let情況
//i0 i1 i2 i3 i4 i5
//塊里面的i=圓括號(hào)里面的i值
function fn(){
console.log(i) //打印出i=5
}
x.onclick=fn
}
</script>
這里看出使用var打印出是6手幢,使用let打印出是5,這是因?yàn)橐粋€(gè)是全局變量忱详,一個(gè)是塊級(jí)作用域围来。