一、js中的词法作用域和动态作用域

     词法作用域也就是在词法阶段定义的作用域,也就是说词法作用域在代码书写时就已经确定了。 

     js中其实只有词法作用域,并没有动态作用域,this的执行机制让作用域表现的像动态作用域,this的绑定是在代码执行的时候确定的。

   example1: 理解词法作用域  

    记住js中只有词法作用域没有真正的动态作用域,作用域是在代码书写时确定的

var value = 1;

function foo() {

    console.log(value);

}

function bar() {

    var value = 2;

    foo();

}

bar();
//1  

输出是1,函数在哪里调用没有关系,变量的位置在编译的词法分析阶段就确定了。

当调用foo时,会对value进行一次RHS查询,在当前函数作用域中没有查找到会查找到最外层的作用域,也就是全局作用域定义的value。

二、修改词法作用域

      在代码书写时,作用域(词法作用域)就已经确定了,但是可不可以再修改呢?

      通过eval和with都可以用来修改词法作用域。

eval:

function foo(str, a) {
eval(str)
console.log(a, b)//1,3
} var b = 2;
foo("val b = 3", 1)

with:

用来重复引用同一个对象中的多个属性的快捷方式

可以理解为修改对象中多个属性的值的快捷方式

function foo(obj) {
with(obj) {
a = 7
}
} var obj1 = {
a: 2
} var obj2 = {
b: 3
} foo(obj1)
console.log(obj1)// {a=7}
console.log(a) //7
foo(obj2)
console.log(obj2)//{b:3}
console.log(a)//7

with可以定义一个词法作用域, 值得注意的是with中定义的a=2会在全局作用域中包含一个a变量。

  

三、函数作用域和块作用域

      1、创建作用域的方式

          a)通过函数创建局部作用域

              1、通过函数声明的方式创建

              2、通过函数表达式创建:

              匿名函数表达式和具名函数表达式

区别函数表达式和函数声明的方式就是看声明的第一个关键字是否是function开头

          b)通过with、try...catch、let和const创建块作用域

              值得提的是let和const定义的块作用域

              let在声明变量时,会将变量附加在一个已经存在的块作用域上,一般是{}(隐式附加),let声明的变量是在js运行的时候才存在的。

     

Javascript中的词法作用域、动态作用域、函数作用域和块作用域(四)的更多相关文章

  1. 博文推荐】Javascript中bind、call、apply函数用法

    [博文推荐]Javascript中bind.call.apply函数用法 2015-03-02 09:22 菜鸟浮出水 51CTO博客 字号:T | T 最近一直在用 js 写游戏服务器,我也接触 j ...

  2. JavaScript闭包理解【关键字:普通函数、变量访问作用域、闭包、解决获取元素标签索引】

        一.闭包(Closure)模糊概述 之前总觉得闭包(Closure)很抽象而且难理解,百度一下"闭包"名词,百度的解释是:“闭包是指可以包含自由(未绑定到特定对象)变量的代 ...

  3. JavaScript中的事件循环机制跟函数柯里化

    一.事件循环机制的理解 test();//按秒输出5个5 function test() { for (var i = 0; i < 5; i++) { setTimeout(() => ...

  4. Javascript中call、apply、bind函数

    javascript在函数创建的时候除了自己定义的参数外还会自动新增this和arguments两个参数 javascript中函数也是对象,call.apply.bind函数就是函数中的三个函数,这 ...

  5. JavaScript中以构造函数的方式调用函数

    转自:http://www.cnblogs.com/Saints/p/6012188.html 构造器函数(Constructor functions)的定义和任何其它函数一样,我们可以使用函数声明. ...

  6. JavaScript中的bind,call和apply函数的用法和区别

    一直没怎么使用过JavaScript中的bind,call和apply, 今天看到一篇比较好的文章,觉得讲的比较透彻,所以记录和总结如下 首先要理解的第一个概念,JavaScript中函数调用的方式, ...

  7. JavaScript中bind、call、apply函数用法详解

    在给我们项目组的其他程序介绍 js 的时候,我准备了很多的内容,但看起来效果不大,果然光讲还是不行的,必须动手.前几天有人问我关于代码里 call() 函数的用法,我让他去看书,这里推荐用js 写服务 ...

  8. JavaScript 中有关Array操作的一些函数

    JavaScript的Array可以包含任意数据类型,并通过索引来访问每个元素. 要取得Array的长度,直接访问length属性: var arr = [1, 0.222, 'Hi', null, ...

  9. JavaScript中bind、call、apply函数使用方法具体解释

    在给我们项目组的其它程序介绍 js 的时候,我准备了非常多的内容,但看起来效果不大,果然光讲还是不行的,必须动手. 前几天有人问我关于代码里 call() 函数的使用方法.我让他去看书,这里推荐用js ...

随机推荐

  1. python 加密 hashlib与hmac模块

    https://www.jb51.net/article/128911.htm hashlib模块简介: hashlib模块为不同的安全哈希/安全散列(Secure Hash Algorithm)和 ...

  2. MyBatis 遍历数组放入in中

    必须要遍历出数组的值放入in中 如果直接将"'2','3','4','5','6','7','8'" 字符串放入in中,只会查出 inv_operate_type的值为2的数据,因 ...

  3. java学习之动手实验

     一, 1,JAVA的基本运行单位是类 2,类的成员:成员变量,构造方法,普通方法和内部类 3,成员变量种类:字符类型:char        布尔类型:boolean     数值类型:byte, ...

  4. Prism for WPF

    Prism for WPF Prism for WPF初探(构建简单的模块化开发框架)   先简单的介绍一下Prism框架,引用微软官方的解释: Prism provides guidance to ...

  5. day18-19 Storm

    课程介绍 课程名称:Storm是什么 课程目标: 通过该课程的学习能够了解离线计算与流式计算的区别.掌握Storm框架的基础知识.了解流式计算的一般架构图. 课程大纲: 1. 离线计算是什么? 2.  ...

  6. 将koa+vue部署到服务器

    很久很久以前,就对前后端如何分离,后端如何把代码部署到服务器有浓厚的兴趣,最近在阿里云上申请了一个服务器,试试水吧! 本文参考了文章<基于Node的Koa2项目从创建到打包到云服务器指南> ...

  7. python——psutil的使用(获取进程信息)

    import psutil psutil.pids() [1, 2, 3, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18, 19, 20, 26, 27, 28, 2 ...

  8. MySQL在登陆时出现ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: YES)错误

    错误显示:ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: YES) 解决方案: 1.找到配 ...

  9. Generic Realtime Intermediary Protocol

    转自:https://pushpin.org/docs/protocols/grip/ Introduction The Generic Realtime Intermediary Protocol ...

  10. docusaurus 生成的website 通过circleci部署gh-pages

    docusaurus 是facebook 开源的一款文档脚手架工具,可以快速的进行文档生成,基于markdown 同时已经内置了gh-pages 发布的命令,对于ci 工具,我们只需要简单的配置就可以 ...