Javascript第四章变量的提升和预解析方法流程第四课
2019-07-12 本文已影响0人
您好简书
在这里插入图片描述
<a class="btn btn-sm btn-red-hollow attention" id="btnAttent" target="_blank">更多免费教学文章<font color="blue" size="2">请关注这里</font></a>
首先我们写一个代码：
解析前代码：
在这里插入图片描述
预解析（全局）后代码：
在这里插入图片描述
第二步：一行一行的执行代码
在这里插入图片描述
第三步：当执行函数时，再次进行预解析 局部作用域依然跟第一步一样解析
在这里插入图片描述
解析后： 放到当前局部作用域的上面（放到自己所在作用域的上面）
在这里插入图片描述
第四部：接着一步一步的执行
为什么输出的是undefined?
解答：因为就近原则，var num 全局变量和 function内的方法局部标量num是一样的， 所以优先是取局部变量里的值，但是代码执行，从上到下，未给num赋值，所以输出结果是undefined
源码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
//解析器执行JavaScript代码的过程
//思考一：结果undefined
/*var num = 10;
fun();
function fun(){
console.log(num);
var num = 20;
}*/
/*//第一步：预解析(全局作用域)
var num;
function fun(){
//第三步：当执行函数时，再次进行预解析(局部作用域)
var num;
//第四步：一行一行执行代码
console.log(num);
num = 20;
}
//第二步：一行一行执行代码
num = 10;
fun();*/
//思考二：结果undefined、9
/*var a = 18;
f1();
function f1(){
var b=9;
console.log(a);
console.log(b);
var a = '123';
}*/
/*//第一步：预解析
var a;
//第三步：当执行函数时，再次进行预解析(局部作用域)
function f1(){
var b;
var a;
//第四步：一行一行执行代码
b=9;
console.log(a);
console.log(b);
a = '123';
}
//第二步：一行一行执行代码
a = 18;
f1();*/
//思考三：
/*f1();
console.log(c);
console.log(b);
console.log(a);
function f1(){
var a = b = c = 9;
console.log(a);
console.log(b);
console.log(c);
}*/
/*function f1(){
var a; //a是局部变量
a = b = c = 9; //b、c是全局变量
//var a = b = c = 9; //等同于var a=9; b=9; c=9;
//var a=9,b=9,c=9; //等同于var a=9; var b=9; var c=9;
console.log(a);
console.log(b);
console.log(c);
}
f1();
console.log(c);
console.log(b);
console.log(a);*/
/*
区分：没有声明变量和变量未赋值
1.如果没有声明变量就直接使用，报错：Uncaught ReferenceError: a is not defined
2.声明了变量，但未赋值，输出：undefined
*/
//console.log(age);
var age;
console.log(age);
</script>
</head>
<body>
</body>
</html>
