作用域說明:指一個變量的作用范圍

1.全局作用域

(1) 全局作用域在頁面打開時被創(chuàng)建,頁面關(guān)閉時被銷毀
(2) 編寫在script標(biāo)簽中的變量和函數(shù),作用域為全局，在頁面的任意位置都可以訪問到
(3) 在全局作用域中有全局對象window,代表一個瀏覽器窗口,由瀏覽器創(chuàng)建,可以直接調(diào)用
(4) 全局作用域中聲明的變量和函數(shù)會作為window對象的屬性和方法保存

var a = 10;
b = 20;
function an(){
  console.log('an')
}
var bn = function(){
  console.log('bn')
}
console.log(window)

如圖，變量a，b和函數(shù)an，bn都保存在window對象上

(5) window對象的屬性和方法可以直接調(diào)用,如window.an() 可以寫為 an()

2.函數(shù)作用域:

(1) 調(diào)用函數(shù)時,函數(shù)作用域被創(chuàng)建,函數(shù)執(zhí)行完畢,函數(shù)作用域被銷毀

function an(){
    var s = 'an'
    console.log(s);
}
//an();

此時函數(shù)an并沒有執(zhí)行，作用域沒有創(chuàng)建，當(dāng)函數(shù)執(zhí)行時,作用域創(chuàng)建，輸出結(jié)果an

an();

(2) 每調(diào)用一次函數(shù)就會創(chuàng)建一個新的函數(shù)作用域,他們之間是相互獨(dú)立的

(3) 在函數(shù)作用域中可以訪問到全局作用域的變量,在函數(shù)外無法訪問到函數(shù)作用域內(nèi)的變量

function an(){
  var s = 'an'
  console.log(s);
}
an();
console.log(s); // 此時，程序會從當(dāng)前作用域和上級作用域及以上作用域中尋找變量s，并不會去下級作用域中尋找

(4) 在函數(shù)作用域中訪問變量、函數(shù)時,會先在自身作用域中尋找,若沒有找到,則會到函數(shù)的上一級作用域中尋找,一直到全局作用域
(5) 在函數(shù)作用域中也有聲明提前的特性,對于變量和函數(shù)都起作用,此時函數(shù)作用域相當(dāng)于一個小的全局作用域,詳細(xì)聲明提前請看聲明提前部分

an();
bn();
function an(){
    var s = 'an'
    console.log(s);
}
var bn = function(){
    console.log('bn')
}

下圖就結(jié)果中，an()可以正常執(zhí)行，函數(shù)an()提升并創(chuàng)建了，函數(shù)bn的變量名提升了，但是為賦值，此時bn不是函數(shù)

(6) 在函數(shù)作用域中,不使用變量關(guān)鍵字聲明的變量,在賦值時會往上一級作用域?qū)ふ乙呀?jīng)聲明的同名變量,直到全局作用域時還沒找到,則會成為window的屬性

an(); // 輸出結(jié)果 bn
function an(){
  var b = 'bn';
  function bn(){
    console.log(b); 
	b = 'bn2';  // b會往上一級尋找已經(jīng)聲明的同名變量,并賦值,直到全局作用域時還沒找到,則會成為window的屬性
  }
  bn();
  console.log(b); // 輸出 bn2
}

(7) 在函數(shù)中定義形參,等同于聲明變量

function an(name){
  console.log(name); // 輸出 undefined
}
an();

等同于

function an(){
  var name
  console.log(name); // 輸出 undefined
}
an();

到此這篇關(guān)于JS中作用域以及變量范圍的文章就介紹到這了,更多相關(guān)JS作用域內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論