首頁  >  文章  >  web前端  >  實例詳解使用var宣告變數的不足

實例詳解使用var宣告變數的不足

WBOY
WBOY轉載
2022-08-09 16:01:261745瀏覽

本篇文章為大家帶來了關於javascript的相關知識,其中主要介紹了關於使用var聲明變量不足的相關問題,使用var聲明變量,允許重複變量聲明,導致數據被覆蓋,下面一起來看一下,希望對大家有幫助。

實例詳解使用var宣告變數的不足

【相關推薦:javascript影片教學web前端

##聲明變數的問題

    使用
  • var聲明變數(允許重複變數宣告:導致資料被覆寫)
變數的提升

    怪異資料存取
  • 閉包問題

  • 在函數的變數會提升到最頂端
  • 在全域作用域的變數也會提升到最頂部

JavaScript中的var宣告變數的缺陷

  • 未宣告卻可以使用(var宣告的變數會預先編譯或說是變數提示),這不符合邏輯。

  • 同一個變數可以被多次聲明,但是嚴謹來說,一個變數被宣告一次之後,後面只能對它修改而不是聲明。也不符合邏輯。

  • for迴圈中的迴圈參數可以在迴圈外使用(for迴圈被污染),而超出了最初主要控制迴圈的作用。不符合邏輯。

  • 沒有區塊級作用域。

我們來舉例來看看

//首先判断生成一个随机数当随机数小于0.5时声明a赋值为‘abc’
//然后输出a

if (Math.random() < 0.5){
	var a = 'abc';
	console.log(a);
}
//如果不是那么输出a
else {
	console.log(a)
}

console.log(a);

這裡就有一個很嚴重的問題讓我們來讀一下:

先判斷產生一個隨機數當隨機數小於0.5時宣告a且輸出a

然後如果不小於0.5也輸出a

那麼這個a其實是不存在的因為遇到了變數提升問題導致全域作用域有了一個a,這樣雖然能讀到但是因為這個變數提升就導致全域作用域被污染了。

在正常看來這似乎沒有問題但是將這串程式碼放在其他任何語言上寫出類似的程式碼他必定會報錯同時也因為這個問題導致他在一定程度上對大型應用的吃力。

讓我們再來看看閉包問題:

//选中div
var div = document.getElementByTd('div');
//我这里创建10个按钮并添加进代码里

for (var i = 1; 1 < 10; i ++){
	var btn = document.createElement('button');
	btn.innerHTML = '按钮' + i;
	div.appendChild(btn);
	//添加点击事件点击按钮时输出对应的i
	btn.onclick = function () {
		console.log(i);
	}
}
//但是当点击输出时所有的按钮都为11
//原因是当在for声明变量i时遇到了变量提升就导致了来来回回更改的就只有这一个i
//而当我们点击时for早已循环完所以循环完成时i = 11;就输出也是11了
//
//一般我们的解决办法是将点击事件上写一个立即执行函数执行完删除方可正常运行

#全域變數掛載到全域物件:全域物件成員污染問題

var abc = "123"
console.log(abc);
//可以正常输出对吧,这就导致了一个问题
//我可以将abc挂载到window上如果说我要写很多的代码那就会导致全局变量污染

//然后我给console赋值
var console = "abc";
console.log(console);
//然后再输出console会报错
//因为我对window的console进行了覆盖所以会报错
這就是原來的JS所遇到的各種問題和不方便的地方

【相關推薦:

javascript影片教學web前端

以上是實例詳解使用var宣告變數的不足的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:csdn.net。如有侵權,請聯絡admin@php.cn刪除