【7】JavaScript 函数高级——作用域与作用域链

lentrue 发布于2019-08-23 18:20 / 912人阅读

摘要：函数高级作用域与作用域链一作用域作用域个数定义的函数个数全局作用域理解就是一块地盘一个代码段所在的区域。函数执行上下文环境是在调用函数时函数体代码执行之前创建。

JavaScript函数高级——作用域与作用域链 一、作用域

作用域个数 = n(定义的函数个数) + 1(全局作用域)
（1）理解

就是一块"地盘", 一个代码段所在的区域。

它是静态的(相对于上下文对象), 在编写代码时就确定了。

（2）分类

全局作用域

函数作用域

ES6中新增了块级作用域

（3）作用

隔离变量，不同作用域下同名变量不会有冲突。

二、作用域与执行上下文

（1）区别1

全局作用域之外，每个函数都会创建自己的作用域，作用域在函数定义时就已经确定了。而不是在函数调用时。

全局执行上下文环境是在全局作用域确定之后, js代码马上执行之前创建。

函数执行上下文环境是在调用函数时, 函数体代码执行之前创建。

（2）区别2

作用域是静态的, 只要函数定义好了就一直存在, 且不会再变化。

上下文环境是动态的, 调用函数时创建, 函数调用结束时上下文环境就会被释放。

（3）联系

上下文环境(对象)是从属于所在的作用域。

全局上下文环境==>全局作用域

函数上下文环境==>对应的函数作用域

三、作用域链

（1）理解

多个上下级关系的作用域形成的链, 它的方向是从下向上的(从内到外)

查找变量时就是沿着作用域链来查找的。

（2）查找一个变量的查找规则

1）在当前作用域下的执行上下文中查找对应的属性, 如果有直接返回, 否则进入2）。

2）在上一级作用域的执行上下文中查找对应的属性, 如果有直接返回, 否则进入3）。

3）再次执行2）的相同操作, 直到全局作用域, 如果还找不到就抛出找不到的异常。

var a = 2;
function fn1() {
    var b = 3;
    function fn2() {
        var c = 4;
        console.log(c);
        console.log(b);
        console.log(a);
        console.log(d);
    }
    fn2();
}
fn1();

四、作用域_面试题

面试题1

var x = 10;
function fn() {
  console.log(x);
}
function show(f) {
  var x = 20;
  f();
}
show(fn); // 结果 10
// 由于fn()的作用域中没有找到属性x,则会去fn()的上一级作用域也就是全局作用域中找，找到x=10，因此打印10.

面试题2

var fn = function () {
  console.log(fn)
}
fn()

var obj = {
  fn2: function () {
    console.log(fn2)
  }
}
obj.fn2()

上面第一个会正常打印出fn()

第二个，调用时是obj.fn2()，而obj.fn2() = function(){console.log(fn2)}

所以相当于window调用function(){console.log(window.fn2)}，而window中没有fn2属性，所以会报错。

将代码改变：

var fn = function () {
  console.log(fn)
}
fn()

var obj = {
  fn2: function () {
    // console.log(fn2)
    console.log(this.fn2)
  }
}
obj.fn2()

obj.fn2()调用时this的指向为obj，所以相当于function(){console.log(obj.fn2)}，obj中有fn2属性，所以能成功执行。

GPU云服务器云服务器 javascript作用域链作用域链 javascript作用 javascript的作用

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/105077.html

《你不知道的javascript》笔记_作用域与闭包

摘要：建筑的顶层代表全局作用域。实际的块级作用域远不止如此块级作用域函数作用域早期盛行的立即执行函数就是为了形成块级作用域，不污染全局。这便是闭包的特点吧经典面试题下面的代码输出内容答案个如何处理能够输出闭包方式方式下一篇你不知道的笔记下一篇：《你不知道的javascript》笔记_this 写在前面这一系列的笔记是在《javascript高级程序设计》读书笔记系列的升华版本，旨在将零碎...

galaxy_robot 2019-08-23 14:11 评论0 收藏0
进击JavaScript之（二）词法作用域与作用域链

摘要：一作用域域表示的就是范围，即作用域，就是一个名字在什么地方可以使用，什么时候不能使用。概括的说作用域就是一套设计良好的规则来存储变量，并且之后可以方便地找到这些变量。一、作用域域表示的就是范围，即作用域，就是一个名字在什么地方可以使用，什么时候不能使用。想了解更多关于作用域的问题推荐阅读《你不知道的JavaScript上卷》第一章（或第一部分），从编译原理的角度说明什么是作用域。概...

denson 2019-08-20 10:21 评论0 收藏0
【Javascript】深入理解this作用域问题以及new/let/var/const对this作

摘要：理解作用域高级程序设计中有说到对象是在运行时基于函数的执行环境绑定的在全局函数中，等于，而当函数被作为某个对象调用时，等于那个对象。指向与匿名函数没有关系如果函数独立调用，那么该函数内部的，则指向。理解this作用域《javascript高级程序设计》中有说到: this对象是在运行时基于函数的执行环境绑定的：在全局函数中，this等于window，而当函数被作为某个对象调用时，t...

snowLu 2019-08-23 17:14 评论0 收藏0
Javascript重温OOP之作用域与闭包

摘要：的变量作用域是基于其特有的作用域链的。需要注意的是，用创建的函数，其作用域指向全局作用域。所以，有另一种说法认为闭包是由函数和与其相关的引用环境组合而成的实体。作用域定义在编程语言中，作用域控制着变量与参数的可见性及生命周期，它能减少名称冲突，而且提供了自动内存管理 --javascript 语言精粹我理解的是，一个变量、函数或者成员可以在代码中访问到的范围。 js的变量作...

JessYanCoding 2019-08-21 10:56 评论0 收藏0
深入理解 JavaScript, 从作用域与作用域链开始

摘要：所以上面那段代码链中最初应该是之后之后所以最后的输出结果是作用域链概念看了前面一个完整的函数执行过程，让我们来说下作用域链的概念吧。而这一条形成的链就是中的作用域链。 showImg(https://segmentfault.com/img/bVbvayE?w=1280&h=545); 1. 什么是作用域作用域是你的代码在运行时,某些特定部分中的变量,函数和对象的可访问性。换句话说，...

frontoldman 2019-08-26 10:09 评论0 收藏0