【JavaScript】20_JS提升

简介: # 13、提升## 变量var的提升​ \- 使用var声明的变量,它会在所有代码执行前被声明​ 所以我们可以在变量声明前就访问变量(不推荐,不好维护)## 函数的提升​ \- 使用函数声明创建的函数,会在其他代码执行前被创建​ 所以我们可以在函数声明前调用函数## let的提升不显示​ **let声明的变量实际也会提升,但是在赋值之前解释器禁止对该变量的访问**```html <script>

13、提升

变量var的提升

​ - 使用var声明的变量,它会在所有代码执行前被声明

​ 所以我们可以在变量声明前就访问变量(不推荐,不好维护)

函数的提升

​ - 使用函数声明创建的函数,会在其他代码执行前被创建

​ 所以我们可以在函数声明前调用函数

let的提升不显示

let声明的变量实际也会提升,但是在赋值之前解释器禁止对该变量的访问

        <script>
            console.log(b)

            let b = 10

            // fn()

            function fn(){
                alert("我是fn函数~")
            }

            // fn2()
            // var fn2 = function(){

            // }
            // console.log(a)

            var a = 10
            // a = 10 // window.a = 10
        </script>

练习

        <script>
            /* var a = 1
        function fn(){
            a = 2
            console.log(a) // 2
        }
        fn()
        console.log(a) // 2 */

            // 变量和函数的提升同样适用于函数作用域

            /*  var a = 1
        function fn(){
            console.log(a) //undefined
            var a = 2
            console.log(a) // 2
        }
        fn()
        console.log(a) // 1 */

            // 定义形参就相当于在函数中声明了对应的变量,但是没有赋值
            /* var a = 1
        function fn(a){
            console.log(a) //undefined
            a = 2
            console.log(a) // 2
        }
        fn()
        console.log(a) // 1 */

            /* var a = 1
        function fn(a){
            console.log(a) //10
            a = 2
            console.log(a) // 2
        }
        fn(10)
        console.log(a) // 1
 */

            /* var a = 1
        function fn(a){
            console.log(a) //1
            a = 2
            console.log(a) // 2
        }
        fn(a)
        console.log(a) // 1 */

            console.log(a)  // 2

            var a = 1

            console.log(a) // 1

            function a() {
                alert(2)
            }

            console.log(a) // 1

            var a = 3

            console.log(a) // 3

            var a = function () {
                alert(4)
            }

            console.log(a) // 4

            var a

            console.log(a) // 4
        </script>
相关文章
|
1月前
|
人工智能 JavaScript 前端开发
使用Node.js模拟执行JavaScript
使用Node.js模拟执行JavaScript
|
1月前
|
消息中间件 JavaScript 前端开发
用于全栈数据流的 JavaScript、Node.js 和 Apache Kafka
用于全栈数据流的 JavaScript、Node.js 和 Apache Kafka
43 1
|
1月前
|
JavaScript 前端开发
电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
99 1
|
30天前
|
Web App开发 JavaScript 前端开发
Node.js:JavaScript世界的全能工具
Node.js:JavaScript世界的全能工具
|
1月前
|
JSON JavaScript 前端开发
使用JavaScript和Node.js构建简单的RESTful API服务器
【10月更文挑战第12天】使用JavaScript和Node.js构建简单的RESTful API服务器
17 0
|
1月前
|
移动开发 JavaScript 前端开发
【JavaScript】JS执行机制--同步与异步
【JavaScript】JS执行机制--同步与异步
19 0
|
1月前
|
数据采集 JavaScript 前端开发
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
|
3月前
|
JavaScript 前端开发
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
这篇文章是JavaScript基础与实战教程的第一部分,涵盖了JavaScript的基本语法、标识符、数据类型以及如何进行强制类型转换,通过代码示例介绍了JS的输出语句、编写位置和数据类型转换方法。
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
|
3月前
|
设计模式 JavaScript 前端开发
从工厂到单例再到策略:Vue.js高效应用JavaScript设计模式
【8月更文挑战第30天】在现代Web开发中,结合使用JavaScript设计模式与框架如Vue.js能显著提升代码质量和项目的可维护性。本文探讨了常见JavaScript设计模式及其在Vue.js中的应用。通过具体示例介绍了工厂模式、单例模式和策略模式的应用场景及其实现方法。例如,工厂模式通过`NavFactory`根据用户角色动态创建不同的导航栏组件;单例模式则通过全局事件总线`eventBus`实现跨组件通信;策略模式用于处理不同的表单验证规则。这些设计模式的应用不仅提高了代码的复用性和灵活性,还增强了Vue应用的整体质量。
50 1
|
3月前
|
JavaScript 前端开发
JavaScript基础&实战 JS中正则表达式的使用
这篇文章介绍了JavaScript中正则表达式的使用,包括正则表达式的创建、匹配模式、字符串匹配、拆分、搜索、匹配和替换等方法,并通过示例代码展示了如何应用这些技术。
JavaScript基础&实战 JS中正则表达式的使用