JS函式--函式提升與變數提升
阿新 • • 發佈：2021-08-30
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>函式--函式提升與變數提升</title>
</head>
<body>
<script>
/*
javascript函式--函式提升與變數提升
*/
/*
1.作用域
1.1.全域性作用域
1.2.函式作用域
1.3.塊級作用域
2.變數提升
3.函式提升
*/
//1.作用域
/*
JS中一個變數定義和呼叫都會是在一個固定的範圍中，這個範圍就叫做作用域。
作用域分為全域性作用域、函式作用域和塊級作用域（es6）。
*/
//1.1 全域性作用域
var a = 'global variable';//全域性作用域變數
//1.2 函式作用域
function foo(){
var b = 'function variable';//函式作用域變數
console.log(a);//global variable
console.log(b);//function variable
}
//1.3 塊級作用域
{
let c = 'block variable';//塊級作用域變數
console.log(c);//block variable
}
// console.log(c);//報錯！！
//2.變數提升
/*
變數提升是將變數宣告提升到作用域頂部的位置，而變數的賦值不會被提升。
只有通過var關鍵字定於的變數才會產生提升。
*/
//1.1 全域性作用域
//未賦值
console.log(aa)//undefined
//未定義
// console.log(ac)//Uncaught ReferenceError: ac is not defined
var aa = 'global variable';//全域性作用域變數
//1.2 函式作用域
(function (){
var bb = 'function variable';//函式作用域變數
console.log(aa);//global variable
console.log(bb);//function variable
})();
//3.函式提升
/*
通過函式宣告式定義的函式也會出現提升，也只有這一種函式。
函式提升會將整個函式體一起提升，包括了執行邏輯。
*/
console.log(foo());//foo函式！
function foo(){
return "foo函式！";
}
/*
以上函式執行時等替於：
function foo(){
return "foo函式！";
}
console.log(foo());//foo函式！
*/
</script>
</body>
</html>