一、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. Unity物品栏、商城3D物品的显示插件

    UI显示3D模型插件 本文提供全流程,中文翻译. Chinar 坚持将简单的生活方式,带给世人!(拥有更好的阅读体验 -- 高分辨率用户请根据需求调整网页缩放比例) Chinar -- 心分享.心创新 ...

  2. Codewars

    You can vote on other Codewarrior's solutions to help uncover the best ones. There are 2 choices for ...

  3. import sys

    目录 sys模块的常见函数列表 1.sys.argv 2.sys.platform 3.sys.path 4.sys.exit(n) sys模块提供了一系列有关Python运行环境的变量和函数. 回到 ...

  4. manjaro初体验

    manjaro Linux是https://distrowatch.com/网站上排名第一的Linux分支. https://manjaro.org/ 选择,下载,打开主页下载页:https://ma ...

  5. django额外参数的传递和url命名

    django额外参数的传递 path方法:path(route, view, kwargs=None, name=None) path方法可以传递入一个额外参数的字典参数(kwarg),字典里的值就会 ...

  6. (23)ajax实现上传文件的功能

    form表单上传文件 urls.py from django.conf.urls import urlfrom django.contrib import adminfrom app01 import ...

  7. 关于kafka的新的group无法订阅到topic中历史消息的问题

    今天在写kafka的java api例子时候,遇到一个问题,比如我创建了一个test主题,往里面写了1,2,3,4,5条消息,在这个时候,我用一个新的group启动了一个消费者,发现该消费者只能读到5 ...

  8. day 61 pymysql

    Python3连接MySQL 本文介绍Python3连接MySQL的第三方库--PyMySQL的基本使用. PyMySQL介绍 PyMySQL 是在 Python3.x 版本中用于连接 MySQL 服 ...

  9. spring 自己定义标签 学习二

    在上篇中写的仅仅支持写属性,不支持标签property的写法,可是假设有时候我们还想做成支持 property的使用方法,则能够在xsd中添加spring 自带的xsd引用   改动xsd文件例如以下 ...

  10. C#窗体模拟键盘按键(组合键)产生事件 ---- 通过keybd_event()函数

    如何模拟键盘按键触发产生的事件,比如模拟按下Alt + F4 关闭当前程序,Ctrl+Shift 切换输入法等 可以通过win32api 键盘事件 keybd_event() 来实现 1.定义键盘按键 ...