一、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. linux 执行脚本

    crontab -e 直接编辑定时脚本 保存后,在/var/spool/cron/下自动生成一个以用户名命名的脚本文件.

  2. Tomcat端口被占用解决办法

    1.在cmd运行窗口中输入netstat -ano 查看当前被占用的端口所对应的进城PID: 2.输入命令tasklist,找到进程号PID对应的进程名称(映像名称) 3.打开任务管理器(ctrl+a ...

  3. redux笔记 进阶

    1 拆分UI组件和容器组件 import React from 'react' const AppUI = (props) =>{ return ( <div className=&quo ...

  4. bash常识

    文章目录 比较是否相等 = 字符串操作 字符串变量的截取操作 字符串替换 字符串比较 取长度 查找子串的位置 选取子串 fork, exec, source fork exec source 补充 其 ...

  5. JDBC面试题

    关于jdbc的面试题 什么是JDBC,在什么时候会用到它? JDBC的全称是Java DataBase Connection,也就是Java数据库连接,我们可以用它来操作关系型数据库.JDBC接口及相 ...

  6. MySQL Replication--复制异常1

    ============================================== 问题描述: 1.从库环境:MySQL 5.7.19,主从都开启GTID模式 2.MySQL数据目录所有者被 ...

  7. linux 变量定义

    本地变量:用户自定义的变量. 环境变量:用于所有用户变量,用于用户进程前,必须用export命令导出. 位置变量:$0(脚本名),$1-$9:脚本参数. 特定变量:脚本运行时的一些相关信息. $# 传 ...

  8. mongo之 前后台创建索引 --noIndexBuildRetry

    在数据量超大的情形下,任何数据库系统在创建索引时都是一个耗时的大工程.MongoDB也不例外.因此,MongoDB索引的创建有两个选择,一个是前台方式,一个是后台方式.那这两种方式有什么差异呢,在创建 ...

  9. redux 知识点

    redux原理:store中维护了一个state,我们dispatch一个action,接下来reducer根据这个action更新state. react-redux提供两个关键模块:Provide ...

  10. 新版vue-cli输入本地ip不能访问,只能用localhost才可以访问?

    问:新版vue-cli输入本地ip不能访问,只能用localhost才可以访问? 答:修改config/index.js配置,将host: 'localhost',改为host: '0.0.0.0', ...