【学习笔记17】JavaScript作用域

news2025/8/12 4:05:42

笔记首发

一、作用域

  1. 😴我们学变量,不是在任何地方都可以使用
  2. 😴变量有一个使用区间, 这个可以使用的区间就叫做作用域

1、全局作用域

  1. 😫 script标签内部声明的变量,就是全局作用域的变量
  2. 😏在全局作用域声明的变量, 在哪里都可以使用
  3. 😣浏览器在运行的时候,会给我们一个window对象, 我们的全局作用域内声明的变量,全都在window对象中

2、局部(函数)作用域

  1. 🤒 在函数内部的大括号内,这个区间叫做函数作用域
  2. 😴 在函数作用内声明的变量, 只能在当前函数内部使用, 在函数外部(超过作用域了) 就无法使用
  3. 😪 函数作用域内声明的变量, 不会挂载到window对象
       // 在全局作用域中声明的变量, 同时他也会挂载到全局对象window
        var a = 100;
        // 在全局作用域中声明的变量, 同时他也会挂载到全局对象 window
        var a1 = '这是我手写的';

        console.log(window)

        function fn() {
            // 这里边就是函数作用域
            var amyFn = '我是在函数作用域内声明的变量';
             // 我是在函数作用域内声明的变量
            console.log(amyFn) 
        }
        fn()
        // amyFn is not a defined
        console.log(amyFn);   //报错  

在这里插入图片描述

二、作用域链

1、变量的访问规则

  1. 😴 会先在自己当前作用域内查找, 找到直接使用(打印)
  2. 😴 如果没有找到,会向上层作用域查找, 不会向下层查找
  3. 😴 如果上层作用域内也没有找到, 会继续向上层作用域的上层作用域查找(相当于是去自己爷爷级作用域)
  4. 😴 一直会找到最顶层的全局作用域, 找到就是用, 找不到报错
        var a = 100;

        function fn() {
            /**
             *  会先在自己当前作用域(fn函数内部)查找, 找到直接使用, 这里找不到, 因为函数内部没有声明变量a
             *  那么会去自己的上一层作用域(全局作用域)中查找, 找到直接使用
            */
            console.log(a)  // 100

            function fn1() {
                var a = 200;
                console.log(a);  //200
            }
            fn1()
        }
        fn()

在这里插入图片描述

        var a = 1;
        function fn() {
            function fn1() {;
                console.log(a)    // 1
                /**
                 * 查找规则:
                 *      1. 在当前作用域(fn1函数内部)查找, 找到直接使用, 但是没找到, 所以会去父级(fn函数内部)
                 *      2. 在父级作用域(fn函数内部)查找, 找到直接使用, 但是没找到, 所以会去父级(全局)
                 *      3. 在全局作用域查找, 找到直接使用, 找到了var a = 1;    所以会打印1
                */
            }
            fn1()
        }
        fn()
        function fn() {
            function fn1() {
                console.log(a)
                /**
                 * 查找规则:
                 *      1. 在当前作用域(fn1函数内部)查找, 找到直接使用, 但是没找到, 所以会去父级(fn函数内部)
                 *      2. 在父级作用域(fn函数内部)查找, 找到直接使用, 但是没找到, 所以会去父级(全局)
                 *      3. 在全局作用域查找, 找到直接使用, 没找到    所以会报错
                */
            }
            fn1()
        }
        fn()

2、变量的赋值规则

  1. 🤒 会先在自己当前作用域内查找, 找到直接赋值
  2. 🤒 如果没找到, 会向上层作用域查找, 不会向下层查找
  3. 🤒 如果上层作用域内也没有找到, 会继续向上层作用域的上层作用域查找(去自己的爷爷级作用域)
  4. 🤒 一直会找到最顶层的全局作用域, 找到直接赋值, 找不到将变量定义为全局变量,并赋值

        function fn() {

            function fn1() {
                a = 1
                /**
                 * 赋值规则:
                 *      1. 在当前作用域(fn1函数内部)查找, 找到直接赋值, 但是没找到, 所以会去父级(fn函数内部)
                 *      2. 在父级作用域(fn函数内部)查找, 找到直接使用, 但是没找到, 所以会去父级(全局)
                 *      3. 在全局作用域查找, 找到直接赋值, 没找到; 所以会将变量定义为全局变量并赋值
                */
            }
            fn1()
        }
        fn()

        console.log(a)  // 1

3、作用域链(纯概念)

  • 😦 在自己作用域内查找, 找不到去上层, 不会去下层, 这样一层一层的一个链条 我们叫做作用域链
  • 😑 简单总结: 永远向上查找, 不会向下

三、递归函数

1、递归函数

  • 😫 条件1:一个函数在内部调用了自身
  • 😇 条件2:在合适的实际,结束调用(结束递归),一定要有, 不然就是死递归
        function fn(n) {
            if (n == 1) {
                return 1
            }
            // return 4 的阶乘
            // return 4 * 3 的阶乘
            // return 4 * fn(3)
            return n * fn(n - 1)
        }
        var sum = fn(4)
        console.log(sum)    // sum就是4的阶乘  24

2、课堂案例

    /**
     *  现在有一个特殊的数列,前两位的值是固定为1
     *  从第三位开始, 他的值为前两位相加的和
     * 
     *  1 1 2 3 5 8 13 21 34 55
     *  递归比较好用, 但是计算量大的时候慎用
    */
        function fn(n) {
            if (n == 1 || n == 2) {
                return 1;
            }
            /**
             *  假设 我想求 第六位
             * 
             *  return 第五位 + 第四位
             *  return fn(5) + fn(4)
             *  return fn(n - 1) + fn(n - 2)
            */
            return fn(n - 1) + fn(n - 2);
        }
        var sum = fn(200);
        console.log(sum);  

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/33609.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

计算机网络的定义和分类

计算机网络早期定义:自治互联的计算机集合 计算机网络系统的基本组成为:通信子网资源子网 计算机网络分类: 公用网通常是由电信公司出资建造的大型网络。 专用网通常是由某个部门为满足本单位特殊业务的需要建造的网络&#xff…

基于springboot+jpa+camunda实现简单的请假审批流程

整个camunda的绘图、具体使用,参照上一篇文章Camunda工作流引擎简记。 源码地址,相关技术储备如下 springboot–v2.5.4jpa–v2.5.4postgresql–v11camunda–v7.16.0 整个过程不需要建表,这就是JPA面向对象编程的好处,这也是我认…

33 - C++中的字符串类

---- 整理自狄泰软件唐佐林老师课程 1. 历史遗留问题 C语言 不支持真正意义上的字符串 C语言用 字符数组 和 一组函数 实现字符串操作 C语言 不支持自定义类型,因此无法获得字符串类型 解决方案 从C到C的进化过程 引入了 自定义类型在C中可以通过类完成字符串类型…

iOS上架app store详细教材

1、安装iOS上架辅助软件Appuploader 2、申请iOS发布证书(p12) 3、申请iOS发布描述文件(mobileprovision) 4、打包ipa 5、上传ipa到iTunes Conn 1、安装iOS上架辅助软件Appuploader2、申请iOS发布证书(p12)…

ImmunoChemistry艾美捷牛膜联蛋白V-荧光素凋亡检测试剂盒方案

ImmunoChemistry艾美捷牛膜联蛋白V-荧光素细胞凋亡检测试剂盒提供了一种经验证的方法,可使用重组荧光素结合的牛膜连蛋白V和碘化丙啶(PI)快速、轻松地区分两个死亡细胞群和活细胞群。这些细胞将被膜联蛋白V-荧光素(绿色荧光&#…

docker容器持久化

第六章容器持久化 容器数据卷 什么是容器数据卷? 容器之间可以有一个数据共享技术!docker容器中产生的数据,同步到本地! 这就是卷技术!目录的挂载,将我们容器内的目录,挂在到linux上面&#x…

线性时间选择(Top K)问题(Java)

线性时间选择(Top K)问题(Java) 文章目录线性时间选择(Top K)问题(Java)1、前置介绍2、分治法求解3、代码实现4、复杂度分析5、扩展6、参考资料1、前置介绍 定义 选择问题&#xff0…

docker可视化与制作和提交自己的镜像

第四章docker可视化 portainer docker的图形化管理工具!提供一个后台面板供我们操作! docker run -d -p 8080:9000 \--restartalways -v /var/run/docker.sock:/var/run/docker.sock --privilegedtrue portainer/portainer 访问测试:外网…

Python_数据容器_元组tuple

一、元组tuple定义 为什么需要元组 列表是可以修改的,如果想要传递的信息不被篡改,列表就不适合了 元组和列表一样,都是可以封装多个不同类型的元素在内 最大的不同点在于: 元祖一旦定义完成,就不可修改 所以&am…

SpringBoot中使用JDBC

JDBC基础使用&#xff1a; JDBC基础使用_做测试的喵酱的博客-CSDN博客 一、SpringBoot使用JDBC&#xff0c;依赖 依赖&#xff1a; <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-jdbc</artifactId&…

linux zookeeper kafka_2.12-2.2.0 集群

文章目录一、zookeeper服务搭建1. 下载2. 解压3. 创建目录4. 调整配置5. 配置myid6. 开放防火墙7.启动验证zk二、kafka集群搭建2.1. 下载软件2.2. 解压2.3. 配置2.5. 启动kafka三、测试验证3.1. 创建一个主题3.2. 发送消息3.3. 消费消息预先准备&#xff1a;上传软件至服务器19…

使用Avalonia跨Linux平台

Avalonia&#xff0c;读&#xff1a;阿瓦隆尼亚 这里的跨平台指的是&#xff0c;使用c#语言开发跨Linux平台。c#在Windows桌面开发中很强&#xff0c;但是在Linux桌面中&#xff0c;不能跨平台&#xff0c;Qt可以在Linux中跨平台&#xff0c;但是那是另外一门语言了。Avalonia…

计算机组成原理4小时速成:计算机运算方法,无符号数和有符号数,定点数和浮点数,移位运算,加减运算,乘法运算,原码,反码,补码

计算机组成原理4小时速成&#xff1a;计算机运算方法&#xff0c;无符号数和有符号数&#xff0c;定点数和浮点数&#xff0c;移位运算&#xff0c;加减运算&#xff0c;乘法运算&#xff0c;原码&#xff0c;反码&#xff0c;补码 2022找工作是学历、能力和运气的超强结合体&…

[激光原理与应用-16]:《激光原理与技术》-2- 光的本质(粒子、波动说、电磁波、量子)

目录 前言&#xff1a;“光” 一、光的微粒说 - 牛顿 二、光的波动说 - 托马斯杨 惠更斯 三、光是电磁波 - 麦克斯韦 四、光的波动说受到的挑战&#xff0c;光的波动说重新唤醒 五、光量子假说 - 爱因斯坦 六、光的理论综合 七、光的重要特性 7.1 光的相干性 7.2 相…

安装ideaIU-2022.1.4报错问题解决办法

原来版本是2020 现在因为要用到JDK17 而IDEA2020支持的JDK只能到14 所以我们现在在下载一个2022 .1.4 这时我们安装好后 会发现如下错误 原因分析&#xff1a; JetBrains 会将各个产品的这些文件也放到这个目录中&#xff0c;而新版本的 IntelliJ IDEA 在安装时遭遇了旧版本…

Web(二)html5基础-文本控制类标签(知识训练和编程训练)

web知识训练_html5_文本控制类标签 第1关_web知识训练_html5_文本控制类标签 -------------------------------------------- web编程训练_html5_文本控制类标签 第1关_html5_网页背景及标题段落标签 编程要求 根据前面的效果图&#xff0c;在右侧编辑器中的Begin - End区域…

10K涨到30K,5年大厂横跳,经验全在这两份Java面试精华总结里了

为了帮助大家跳槽成功多长点薪资&#xff0c;我这边给大家准备了两份面试资料。这两份资料可大有来头&#xff0c;已经帮助五位我认识的人进入大厂。所以说含金量还是很高的。 这两份资料可以让你体验到原有知识从破碎到重建&#xff0c;豁然开朗的过程。5年大厂横跳真实案例加…

数据库事务

1 概述 数据库的事务&#xff08;Transaction&#xff09;是一种机制、一个操作序列&#xff0c;包含了一组数据库操作命令。 事务把所有的命令作为一个整体一起向系统提交或撤销操作请求&#xff0c;即这一组数据库命令要么同时成功&#xff0c;要么同时失败。 事务是一个不可…

前端开发——HTML5新增的客户端校验

1.使用校验属性执行校验 HTML5新增了表单的校验属性,如required、pattern等。 required:定义表单不能为空。属性值是required或者省略.pattern:定义表单满足正则表单式1.required属性 required属性用于不能为空。属性值是required或者省略. 代码如下&#xff1a; <form …

34 - 数组操作符的重载

---- 整理自狄泰软件唐佐林老师课程 1. 问题一 string类对象具备C方式字符串的灵活性吗&#xff1f;还能直接访问单个字符吗&#xff1f; 1.1 字符串类的兼容性 string类最大限度的考虑了C字符串的兼容性可以按照使用C字符串的方式使用string对象 1.2 编程实验&#xff1a…