一、作用域

作用域是可访问的变量的集合。在JavaScript中，作用域为可访问变量，对象，函数的集合，它分为局部作用域和全局作用域。作用域决定了这些变量的可访问性（可见性）。

1. 全局作用域（Global Scope）

在代码中任何地方都能访问到的对象拥有全局作用域，一般来说以下几种情形拥有全局作用域：
（1）最外层函数和在最外层函数外面定义的变量拥有全局作用域.

var outValue = "最外层变量"; //最外层变量
function outFun() { //最外层函数var inValue = "内层变量";function innerFun() { //内层函数console.log(inValue );}innerFun();
}
console.log(outValue ); //最外层变量
outFun(); //最外层函数
console.log(inValue );  //inValue is not defined  内层变量是局部作用域，函数以外访问不到他
innerFun();   //innerFun is not defined  内层函数是局部作用域，函数以外访问不到他

（2）所有末定义直接赋值的变量自动声明为拥有全局作用域

function outFun2() {value1= "未定义直接赋值的变量";var value2= "内层变量2";
}
outFun2();//要先执行这个函数,
console.log(value1); //未定义直接赋值的变量
console.log(value2); //value2not defined  内层变量2是局部作用域，函数以外访问不到他

注意点:如果在函数中定义变量时,如果不添加var关键字, 这个变量是一个全局变量

<script>function test() {// 企业开发千万不要这么写num = 123;console.log(num);}test();console.log(num);
</script>

（3）所有window对象的属性拥有全局作用域

2. 局部作用域（Local Scope）　

和全局作用域相反，局部作用域一般只在固定的代码片段内可访问到，最常见的例如函数内部，所有在一些地方也会看到有人把这种作用域称为函数作用域

3. 块级作用域

ES6 之前 JavaScript 没有块级作用域,只有全局作用域和函数作用域。ES6 的到来，为我们提供了‘块级作用域’,可通过新增命令 let 和 const 来体现。
块级作用域所声明的变量在指定块的作用域外无法被访问。块级作用域在如下情况被创建：
在一个函数内部，在一个代码块（由一对花括号包裹）内部

二、作用域链

JavaScript代码中至少有一个作用域, 即全局作用域。
凡是代码中有函数，那么这个函数就构成另一个作用域。
如果函数中还有函数，那么在这个作用域中就又可以诞生一个作用域。
将这样的所有的作用域列出来，可以形成的结构就称之为作用域。

<script>var num = 123; // 0级作用域链function test() { // 0级作用域链var num = 666; // 1级作用域链console.log(num);function demo() { // 2级作用域链var num = 777;console.log(num);}demo();}test();console.log(num);
</script>

三、预解析

JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。
JavaScript解析器执行JavaScript代码的时候，分为两个过程：预解析过程，代码执行过程
预解析过程：

a、把变量的声明提升到当前作用域的最前面，只会提升声明，不会提升赋值。

b、把函数的声明提升到当前作用域的最前面，只会提升声明，不会提升调用。

c、先提升var，在提升function。

案例1

<script>console.log(num); // undefinedvar num = 123;// 把变量的声明提升到当前作用域的最前面var num;console.log(num);num = 123;
</script>

案例2

<script>test();function test() {console.log("hello world");}
</script>

<script>// 把函数的声明提升到当前作用域的最前面function test() {console.log("hello world");}test();alert(test);
</script>

预解析练习

    var num = 123;fun();function fun() {console.log(num);var num = 666;}/*var num;function fun() {var num;console.log(num);num = 666;}num = 123;fun();*/

    var a = 666;test();function test() {var b = 777;console.log(a);console.log(b);var a = 888;}/*var a;function test() {var b;var a;b = 777;console.log(a);console.log(b);a = 888;}a = 666;test();*/

注意点:变量和函数同名时, 函数的优先级高

<script>console.log(num);function num() {console.log("hello world");}var num = 666;console.log(num);/*function num() {console.log("hello world");}var num;console.log(num);num = 666;console.log(num);*/
</script>

不同方式定义函数区别

预解析时提升的方式不同

<script>// 1.函数声明test();function test() {console.log("你好，世界");}// 2.函数表达式demo(); // 报错var demo = function () {console.log("www.it666.com");}/*function test() {console.log("你好，世界");}var demo;test();demo();demo = function () {console.log("www.it666.com");}*/
</script>

【经典面试题】JS作用域、作用域链、预解析相关推荐

this指向-作用域、作用域链-预解析变量提升-Vue组件传值父子子父非父子-Vue数据双向绑定原理
目录 this指向作用域.作用域链预解析变量提升 Vue组件传值父子子父非父子 Vue数据双向绑定原理 1.this指向函数的this指向看调用.不看声明 (1)普通函数调用 ①函数名 ...
内置对象的API Array数组对象 String字符串对象 json字符串 JSON对象 js作用域及变量预解析引用类型与值类型区别共享引用基本包装类型数组去重
01-内置对象的API a.Date对象获取时间 b.Array对象数组加工 c.String对象字符串加工 d.json字符串的语法格式 e.JSON对象的字符串与对象转换应用 02-JS作用域 a ...
JS函数声明和预解析的理解
JS函数声明方法今天看到了一个自己关注了的大神给我回了私信,觉得自己仿佛摸到了大神的裤腿,哈哈,而且人还特别好,居然会给小菜鸟回私信,特别开心呀,一个菜鸟的小激动,言归正传啦 1.最为常见的函数声明 ...
javascript之作用域与预解析
js之预解析在谈js的预解析之前,先看一段c++程序 #include <iostream> using namespace std;void useGreet(){greet(); } ...
前端经典面试题（一）-李游Leo-专题视频课程
前端经典面试题(一)-89人已学习课程介绍在鱼龙混杂的前端行业中,面试一直是一门非常重要的课程,尤其是笔试题. 本课程精选了22道出现率颇高的经典的前端面试题,从浅入深的了解认知这 ...
轻松搞定javascript预解析机制（搞定后，一切有关变态面试题都是浮云~~）
hey,guys!我们一起总结一下JS预解析吧! 首先,我们得搞清楚JS预解析和JS逐行执行的关系.其实它们两并不冲突,一个例子轻松理解它们的关系: 你去酒店吃饭,吃饭前你得看下菜谱,点下菜(JS预解 ...
前端学习记录27-JavaScript-(作用域、预解析、自定义对象)
前端学习记录27-JavaScript-作用域.预解析.自定义对象作用域全局作用域局部作用域(函数作用域) 变量作用域全局变量局部变量作用域链预解析变量预解析函数预解析预解析经典面 ...
js变量提升_学习笔记：JS中的作用域和预解析
知识总结:谢静贤.汤昊在javascript中作用域是非常重要的,本文将会说明作用域以及我们在工作,以及面试中的一些面试题,如果有不足的地方希望大家可以评论指出来,自己一定会及时的改正错误,避免大家 ...
JavaScript中的作用域、作用域链、预解析
作用域: /* 变量--->局部变量和全局变量 * 作用域:就是变量的适用范围 * 局部作用域和全局作用域 * js中没有快级作用域---一对括号中定义的变量,这个变量可以在大括号外面使用 * ...

【经典面试题】JS作用域、作用域链、预解析