JavaScript中var的重要性實例分析

更新時間：2019年07月09日 08:45:44 作者：webbc

這篇文章主要介紹了JavaScript中var的重要性,結(jié)合實例形式分析了javascript變量定義、作用范圍、作用域及相關(guān)操作注意事項,需要的朋友可以參考下

本文實例講述了JavaScript中var的重要性。分享給大家供大家參考，具體如下：

在JS中申明變量是使用var來進(jìn)行申明，但是有的時候我們沒有使用var也可以。這是為什么呢？我來給大家細(xì)細(xì)的說來。

var的本質(zhì)

var的本質(zhì)就是來申明變量的

<script>
var str = 'China';//申明并進(jìn)行賦值
</script>

變量的作用范圍

先以一個例子來說明引出問題，在這個例子中，在函數(shù)t中沒有使用var關(guān)鍵字來申明變量，系統(tǒng)認(rèn)為只是進(jìn)行賦值操作而已，而且這個賦值操作會影響到了window對象的str2屬性

<script>
var str1 = 'China';//申明并賦值str1
var str2 = 'Japan';//申明并賦值str2
console.log(window.str1,window.str2);//輸出：China Japan
function t(){
  var str1 = 'local';//申明并賦值str1
  str2 = 'global';//賦值操作，并不是申明變量，污染window對象的屬性
}
t();//調(diào)用t函數(shù)
console.log(window.str1,window.str2);//輸出：China global
</script>

變量的作用域

全局作用域：在最外層定義的變量

局部作用域：在函數(shù)內(nèi)部定義的變量

JS作用域的特點：首先在函數(shù)內(nèi)部查找變量，找不到則到外層函數(shù)查找，逐步找到最外層，即window對象，并操作window對象的屬性。

<script>
var str = 'China';
function t1(){
  var str = 'Japan';
  function t2(){
    var str = 'USA';
    console.log(str);
  }
  t2();
}
t1();
</script>

這個例子比較典型，可以來說明JS變量的作用域切換問題，腳本首先在最外層定義了str屬性，當(dāng)調(diào)用t1函數(shù)時，在t1函數(shù)中也定義了str變量和t2方法，當(dāng)執(zhí)行t2方法時，此時又定義了str變量，所以此時打印USA。

當(dāng)屏蔽t2函數(shù)中的定義操作，此時在t2函數(shù)作用域中沒有str變量，則從它的上一級作用域中查找，又因為t1函數(shù)中定義了str變量，此時打印Japan。

當(dāng)屏蔽t1和t2函數(shù)中的定義操作，則一層一層地往外找，此時找到最外層，此時打印China。

當(dāng)最外層也沒有定義該變量，在運行該JS過程中就找不到該變量，此時會出錯，在瀏覽器的控制臺可以找到錯誤。