1.js作用域
1.作用域：變數起作用的范圍
* 2.js中只有兩種：全域作用域 區域作用域
* * 全域作用域：變數在任何地方起作用
* 全域變數：在函式外面宣告
* 區域作用域：變數只能在函式內部起作用（又叫塊級作用域）
* 區域變數：在函式內部宣告<script>
//1.全域變數
let a = 10;
function fn ( ) {
console.log ( a );
}
fn();
//2.區域變數
function fn1 ( ) {
let num = 10;
console.log ( num );
}
fn1();
console.log ( num );
</script>2.作用域鏈
-
1.作用域鏈是怎么來的
-
默認情況下，我們的js代碼處于全域作用域，當我們宣告一個函式時，此時函式體會開辟一個區域作用域， 如果我們在這個函式體中又宣告一個函式，那么又會開辟一個新的區域作用域，以此類推，就會形成一個作用域鏈
-
-
2.變數在作用域鏈上的訪問規則
-
就近原則：訪問變數時，會優先訪問的是在自己作用域鏈上宣告的變數，如果自己作用域鏈上沒有宣告這個變數，那么就往上一級去找有沒有宣告這個變數，如果有就訪問，如果沒有就繼續往上找有沒有宣告，直到找到0級作用域鏈上，如果有，就訪問，如果沒有就報錯
-
代碼展示：
let num = 10; // 0級鏈 全域作用域鏈
// 0級作用域
function f1 ( ) { // 函式變數f1本身還是處于0級鏈（變數f1本身處在全域作用域中，是一個全域變數，函式體中才是區域變數，也就是區域作用域鏈）
let num = 20; // 1級鏈
console.log ( num ); // 20
function f2 ( ) { // 1級鏈
// 2級鏈
console.log ( num ); // 20，當前作用域鏈未宣告，就會找上級作用域鏈的num變數
num += 100; // 當前作用域鏈未找到，會從上級尋找 num = 20 + 100
console.log ( "二級鏈" + num ); // 2級鏈 120
}
f2();
console.log ( "一級鏈" + num ); // 120 為什么不是20：因為二級鏈上并沒有宣告變數，而是直接獲取父級變數修改
};
// 0級作用域
f1();
// 0級作用域
console.log ( "0級鏈" + num );// 103.js預決議
-
1.為什么要有預決議機制？
-
通過前面的學習我們知道，js代碼是從上往下執行的，這樣有什么不好的地方呢？
-
實際開發中，往往一個檔案中js代碼會有很多的函式，而如果我們都把函式的宣告寫在最上面，那么我們的業務邏輯就會在下面，這樣的話開發效率不高
-
函式畢竟只是保存一段代碼的，我們希望可以將函式寫在頁面的下面，而把一些業務邏輯功能寫在代碼上面，這樣的話維護起來更方便
-
-
-
2.什么是預決議機制
-
（1）其實js代碼并不是從上往下執行的，這種說法不嚴謹
-
（2）預決議：JS在執行代碼之前，會把變數的宣告提前到所在作用域的最頂端
-
a.只是宣告提前（相當于提前開辟記憶體空間），變數的賦值與函式的呼叫還是在原地
-
b.函式的宣告也會提前
-
-
-
3.預決議的意義（好處）
-
讓函式可以在任意地方呼叫
-
console.log ( num ); // undefined
var num = 10;
console.log ( num ); // 10
/*
let num;
console.log ( num );
num = 10;
console.log ( num );
*/
fn();
function fn () {
console.log ( num );
console.log ( "嘿嘿嘿" );
var num = 10;
console.log ( num );
/*
// 函式宣告提前
function fn(){
var num;
console.log ( num ); // undefined
console.log ( "嘿嘿嘿" );
num = 10;
console.log ( num ); // 10
}
// 呼叫陳述句在原地不變
fn()
*/
// }上一章：JavaScript入門第十七章（內置物件的API）
下一章：JavaScript入門第十九章（JS補充知識點）（完結）
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/293376.html
標籤：其他
下一篇：前端基礎六之jQuery效果