一．聲明

1.變量聲明

var	聲明了未賦值為undefined	可以重復聲明	可以重復賦值
let	聲明了未賦值為undefined	不可以重復聲明	可以重復賦值
const	聲明了就得賦值	不可以重復聲明	不可以重復賦值

2.函數聲明

聲明式：function fun(){};

函數表達式：var/let/const fun = function(){};相當于一個變量

3.同名的情況

let、const參與的聲明不存在同名問題。

（1）變量和變量同名：var和var；var和函數表達式；函數表達式和函數表達式。

（2）函數與函數同名：聲明式函數和聲明式函數。

（3）變量和函數同名：var和聲明式函數；聲明式函數和函數表達式。

二. 作用域

作用域：變量和函數可以訪問的范圍。

全局作用域：無論是函數外還是函數內都能訪問到。

局部作用域：只能在函數內訪問，在函數外不能訪問。

變量的作用域

（1）全局變量：

在函數外使用var聲明的變量；

無論是函數內外都沒有使用var聲明就直接賦值的變量。a=1

（2）局部變量：在函數內使用var聲明的變量。

函數的作用域

（1）全局函數：在函數外聲明的函數。

（3）局部函數：在函數內聲明的函數。

3. 作用域鏈：就是作用域之間的相互嵌套，在查找變量的時候，會先到當前作用域下查找，如果在當前作用域沒有變量聲明，就會一直往上一級作用域查找。

三．提升

提升：在真正執行js代碼之前,還有一個操作叫做預解析,預解析操作會找到文件中所有的聲明,并且使用合適的作用域將它們關聯起來,變量和函數的聲明會被提升到與其對應作用域的最頂端。

變量創建的過程：

var a = 1;

（1）聲明及初始化賦值階段（聲明階段）：var a = undefined;

（2）真實賦值階段（賦值賦值）：a = 1。

1. 變量的提升

（1）使用var聲明的變量只能提升聲明階段，賦值階段還停留在原地。

（2）隱式聲明的變量不會提升。a=1;

2. 函數的提升

（1）使用聲明式函數創建的函數，聲明及賦值階段全都會被提升。

（2）使用函數表達式創建的函數只提升聲明階段，賦值階段還停留在原地。

（3）當函數被聲明在判斷語句內部時，JS會將函數聲明當成表達式(賦值聲明)，即不會提升

3. 變量和函數的同名提升情況

（1）變量和變量同名：var和var；var和函數表達式；函數表達式和函數表達式。會按順序提升，結果取決于最后面的值。

（2）函數與函數同名：聲明式函數和聲明式函數。會按順序提升，結果取決于最后面的值。

var a = 1; var a = function(){}; console.log(a)

var a; var a; a = 1; a = function(){}; console.log(a);

（3）變量和函數同名：var和聲明式函數；聲明式函數和函數表達式。會按順序提升，結果取決于變量是否有值，變量有值就取變量值，變量沒值就取函數值。

var a=1; function a(){}; console.log(a);

var a; function a(){}; a=1; console.log(a)

	全局作用域	局部作用域	提升
隱式聲明的變量a=1;	函數內、外	無	無
var	函數外	函數內	提升聲明部分
let	無	{}	無
const	無	{}	無
函數	函數外	函數內	聲明式函數是整體提升；函數表達式提升聲明部分

作用域貫穿整個步驟

第一步：找聲明（是否符合聲明規則，聲明種類：var/聲明式函數/函數表達式）

第二步：找提升（對應的提升規則，同名問題）

var a = 1; function b(){ ????a = 10; ????return; ????function a(){ ????????console.log(a); ????} } b(); console.log(a);
fn(30); var fn = 10; function fn(fn){ ?????console.log(fn); ?????var fn = 20; ?????console.log(fn); ?????function fn(){ ????? console.log(fn); ?????} } console.log(fn);	function fn(fn) { // var fn=30; function fn() { console.log(fn); } var fn; console.log(fn);//1function fn = 20; console.log(fn);//2 20 } var fn; fn(30); fn = 10; console.log(fn);//10

總結

以上是生活随笔為你收集整理的js作用域和提升的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。