JS變量提升原理與用法實(shí)例淺析
本文實(shí)例講述了JS變量提升。分享給大家供大家參考，具體如下：
該篇介紹什么是變量提升,寫(xiě)給像我一樣的JS新手看的
簡(jiǎn)單來(lái)說(shuō)變量提升就是 JS會(huì)把var變量的聲明自動(dòng)提升到作用域的頂部,即使你不想這樣
一個(gè)例子: (局部變量與全局變量同名時(shí) , 局部變量覆蓋全局變量)
var a="全局變量";
function test()
{
document.writeln(a);
var a="局部變量";
document.writeln(a);
}
test();
上例的兩個(gè)輸出結(jié)果是
undefined局部變量
第一個(gè)輸出并沒(méi)有輸出全局變量a而是undefined ,這就是變量提升導(dǎo)致的
上例等同與下例:
var a="全局變量";
function test()
{
var a;
document.writeln(a);
a="局部變量";
document.writeln(a);
}
test();
test函數(shù)內(nèi)即使局部變量a還沒(méi)定義,就已經(jīng)覆蓋了全局變量,可見(jiàn)其聲明已經(jīng)生效了,
即變量聲明會(huì)自動(dòng)提升到作用域的頂部, 即使該語(yǔ)句并沒(méi)執(zhí)行
如下例:
var x=100;
var y=200;
function test()
{
document.writeln(x);
document.writeln(y);
if(false)
{
var x=1;
}
return;
var y=2;
}
test();
輸出結(jié)果:
undefinedundefined
等同如下形式:
var x=100;
var y=200;
function test()
{
var x,y;
document.writeln(x);
document.writeln(y);
if(false)
{
x=1;
}
return;
y=2;
}
test();
那么怎么解決這個(gè)問(wèn)題呢?
用let變量!let變量執(zhí)行到定義部分才會(huì)裝載,具體用法請(qǐng)自行查詢(xún)!
感興趣的朋友可以使用在線(xiàn)HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。
更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專(zhuān)題：《JavaScript常用函數(shù)技巧匯總》、《javascript面向?qū)ο笕腴T(mén)教程》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
JavaScript之class繼承_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要介紹了JavaScript之class繼承，新的關(guān)鍵字class從ES6開(kāi)始正式被引入到JavaScript中。class的目的就是讓定義類(lèi)更簡(jiǎn)單，有興趣的可以了解一下2017-07-07
javascript iframe編程相關(guān)代碼，對(duì)于熟練操作iframe的朋友有很大的幫助。2009-12-12
JavaScript編程開(kāi)發(fā)中的五個(gè)實(shí)用小技巧
下面的5點(diǎn)說(shuō)明確實(shí)不錯(cuò)，提高性能與可讀性，大家可以根據(jù)需要選擇使用。2010-07-07
JavaScript 精美貪吃蛇實(shí)現(xiàn)流程
看起來(lái)好像很復(fù)雜的貪吃蛇，到底是怎么用JavaScript去實(shí)現(xiàn)的？下面就來(lái)一步一步地，剖析怎么用JavaScript，放在任意一個(gè)瀏覽器中，把貪吃蛇搞起來(lái)2021-11-11
一篇文章掌握RequireJS常用知識(shí)，通過(guò)本文，你可以對(duì)模塊化開(kāi)發(fā)和AMD規(guī)范有一個(gè)較直觀的認(rèn)識(shí)，并詳細(xì)地學(xué)習(xí)RequireJS這個(gè)模塊化開(kāi)發(fā)工具的常見(jiàn)用法，感興趣的小伙伴們可以參考一下2016-01-01
javascript基于prototype實(shí)現(xiàn)類(lèi)似OOP繼承的方法
這篇文章主要介紹了javascript基于prototype實(shí)現(xiàn)類(lèi)似OOP繼承的方法,實(shí)例分析了JavaScript使用prototype實(shí)現(xiàn)面向?qū)ο蟪绦蛟O(shè)計(jì)的中類(lèi)繼承的相關(guān)技巧,需要的朋友可以參考下2015-12-12
原生JS實(shí)現(xiàn)各種運(yùn)動(dòng)之勻速運(yùn)動(dòng)
這篇文章主要為大家詳細(xì)介紹了原生JS實(shí)現(xiàn)各種運(yùn)動(dòng)之勻速運(yùn)動(dòng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-08-08
這篇文章主要為大家詳細(xì)介紹了Python實(shí)現(xiàn)學(xué)生成績(jī)管理系統(tǒng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
這篇文章主要介紹了自制微信公眾號(hào)一鍵排版工具的相關(guān)資料,需要的朋友可以參考下2016-09-09
BOM系列第一篇之定時(shí)器setTimeout和setInterval
這篇文章主要介紹了BOM系列第一篇之定時(shí)器setTimeout和setInterval 的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08