作用域与作用域链--面试题

面试题一
面试题二

面试题一

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>作用域与作用域链面试题</title>
</head>
<body>
    <script>
        var x = 10
        function fn(){
            console.log(x)
        }

        function show(f){
            var x = 20
            f()
        }
        show(fn)   // 输出10
    </script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

作用域示意图：

在这里插入图片描述

面试题二

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>作用域与作用域链面试题</title>
</head>
<body>
    <script>
        var fn = function(){
            console.log(fn)
        }
        fn()   // 打印fn的函数

        var obj = {
            fn2:function(){
                console.log(fn2)
                // console.log(this.fn2) // 加上this.fn2才行
            }
        }
        obj.fn2()  // 报错
    </script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

作用域图解：
执行fn()函数时，会在自身作用域查找，能够找到fn函数，便输出
执行obj.fn2()时，先在自身作用域中查找，没有找到fn2函数，然后去全局作用域查找，没有找到fn2函数，因此报错,说fn2没有定义，要想能够输出fn2函数内容，要使用this.fn2()才行
在这里插入图片描述

相关阅读:
Nginx 高性能架构解析
SpringMVC简介
【Flink】 FlinkCDC读取Mysql（ DataStream 方式）（带完整源码，直接可使用）
如何设计一个可扩展的登录功能
学生宿舍管理系统（前端java+后端Vue）实现-含前端与后端程序
c++ 结构体
Linux网络接口配置文件ifcfg-eth0说明
iOS接入IJKPlayer遇到的问题汇总
第四代智能井盖传感器：万宾科技助力城市安全
ImageMol

原文地址：https://blog.csdn.net/cjhxydream/article/details/127601042