Javascript基本功作用域深入学习

港控/mmm° 2022-05-24 05:12 162阅读 0赞

聊起作用域，很多小伙伴并不陌生，是所有编程语言最基本的功能之一，就是在某个范围内储存变量的值。

也可以说，“**作用域就是根据名称查找变量的一套规则**”。

想入深入学习作用域，必先理解作用域。

理解后面一行代码在底层的工作原理：   var a = 1 ;

这条语句在编译器会并不是一步处理掉的，它会被拆分成两条语句，var  a ，a = 1 。

var a ，编译器会先查询询问变量a是否存在，再做声明操作。

a = 1，编译器也是一样，查询询问变量a是否存在，再做赋值存在。

由此看见，机器毕竟还是机器，每当碰到变量必先进行查询，询问作用域里面是否存在变量。

那么，如果作用域中找不到变量怎么办？一直往上层的作用域寻找，直到最外层的全局作用域，不管有没有找到，查找过程都会停止。

**作用域按照工作模型来划分，作用域分两种，一种是词法作用域，一个动态作用域。**

词法作用域：在代码的位置决定作用域，词法分析器处理代码的时候会保持作用域不变。

动态作用域：在运行的位置决定作用域。

换一句话来说，就是词法作用域关注函数在哪里声明，动态作用域关注函数从哪里调用。Javascript是属于词法作用域。

**作用域按照容器区域来划分，作用域可以分为函数作用域和块作用域。**

**函数作用域**

在Javascript中，每一个函数都有自己的函数作用域。属于这个函数的全部变量都可以在整个函数的范围内使用及复用。

但是在某些场合，我们必须要隐藏作用域（很多原因促成这个隐藏方法，比如避免冲突，变量污染等。）

请阅读以下代码：

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

这代码里面展示了函数作用域，可以在函数作用域里面做一些只能在作用域才能进行的操作。但是这个代码并不理想，这么运行会附带一些额外的问题，首先它声明了一个demo函数，污染了所在的作用域；其次需要再次运行demo()才能运行函数内代码。

为了解决上述问题。请阅读下面代码

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

这代码的函数前面加了 “(” 号，函数将以函数表达式的声明方式来声明。

这个做法解决了之前的弊端，避免了声明函数名来污染作用域，而且能给函数内部代码一个独立的运行作用域。

其实这个方法有另外一种名字，就是IIFE（立即执行函数表达式），这个函数名对于IIFE并不是必须的。

IIFE的作用非常广，下面是它的主要三个推广实践的优势。

1.  创建只使用一次的函数，并立即执行它。
2.  创建闭包，并保持状态，隔离作用域。
3.  作为独立模块存在（如JQuery），防止命名冲突，命名空间注入，模块解耦。

**块作用域**

这个概念很可惜，在ES5之前，Javascript要实现块作用域是非常痛苦的事情。

在ES6之后，可以通过 let 关键字变量声明隐隐式地劫持所在的块作用域，达到块作用域的效果。

但是let进行的声明不会在块作用域内进行声明提升，只有 var 和 函数声明 才会进行声明提升。

发表评论取消回复

表情：

评论列表（有 0 条评论，162人围观）

还没有评论，来说两句吧...

相关阅读

相关深入理解javascript块作用域

文章目录前言正文块作用域 with try/catch let/const 块作用域

古城微笑少年丶/ 2022年10月09日 02:49/ 0 赞/ 210 阅读

相关深入理解javascript函数作用域

文章目录前言正文函数作用域隐藏内部实现规避冲突全局命名空间模块

冷不防/ 2022年10月09日 00:40/ 0 赞/ 220 阅读

相关深入理解JavaScript的变量作用域

在学习JavaScript的变量作用域之前，我们应当明确几点： JavaScript的变量作用域是基于其特有的作用域链的。 JavaScript没有块级作用

落日映苍穹つ/ 2022年08月26日 00:45/ 0 赞/ 208 阅读

相关 javascript深入之词法作用域和动态作用域

作用域作用域是指程序源代码中定义变量的区域。作用域规定了如何查找变量，也就是确定当前执行代码对变量的访问权限。 JavaScript 采用词法作用域(lexical

叁歲伎倆/ 2022年06月08日 03:29/ 0 赞/ 194 阅读

相关 JavaScript作用域学习笔记

JavaScript作用域学习笔记 JavaScript中的作用域，是要单独拿出来学习的，因为它和别的语言不太一样。不一样的地方主要有两点： 1. JavaScr

r囧r小猫/ 2022年06月03日 09:56/ 0 赞/ 235 阅读

相关 Javascript基本功作用域深入学习

聊起作用域，很多小伙伴并不陌生，是所有编程语言最基本的功能之一，就是在某个范围内储存变量的值。也可以说，“作用域就是根据名称查找变量的一套规则”。想入深入学习

港控/mmm°/ 2022年05月24日 05:12/ 0 赞/ 163 阅读

相关 javascript系列--javascript深入理解--作用域，作用域链，闭包的面试题解

一、概要作用域和作用域链是js中非常重要的特性，关系到理解整个js体系，闭包是对作用域的延伸，其他语言也有闭包的特性。那什么是作用域？作用域指的是一个变量和函数的作

灰太狼/ 2022年01月12日 02:43/ 0 赞/ 277 阅读

相关深入理解JavaScript作用域和作用域链

前言 JavaScript 中有一个被称为作用域(Scope)的特性。虽然对于许多新手开发者来说，作用域的概念并不是很容易理解，本文我会尽我所能用最简单的方式来解释

﹏ヽ暗。殇╰゛Y/ 2021年09月20日 09:50/ 0 赞/ 423 阅读

相关深入理解 JavaScript 作用域和作用域链

作用域是JavaScript最重要的概念之一，想要学好JavaScript就需要理解JavaScript作用域和作用域链的工作原理。今天这篇文章对JavaScript作用域和作

喜欢ヅ旅行/ 2021年09月14日 11:08/ 0 赞/ 386 阅读

相关 JavaScript深入之词法作用域和动态作用域

作用域作用域是指程序源代码中定义变量的区域。作用域规定了如何查找变量，也就是确定当前执行代码对变量的访问权限。 `JavaScript` 采用词法作用域(`lex

冷不防/ 2021年07月04日 21:21/ 0 赞/ 412 阅读