作用域說明:指一個(gè)變量的作用范圍

1.全局作用域

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

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對(duì)象上

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

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

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

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

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

an();

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

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

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

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

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的變量名提升了，但是為賦值，此時(shí)bn不是函數(shù)

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

an(); // 輸出結(jié)果 bn
function an(){
  var b = 'bn';
  function bn(){
    console.log(b); 
	b = 'bn2';  // b會(huì)往上一級(jí)尋找已經(jīng)聲明的同名變量,并賦值,直到全局作用域時(shí)還沒找到,則會(huì)成為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)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論