js中var、let和const 的区别与作用域

js中var、let和const 的区别与作用域,第1张

js中var、let和const 的区别与作用域 前言:

在了解let var const 之前,建议先了解一下ECMAscript也就是所谓的ES标准,我们所有使用的Javascript脚本语言(JS)与ES都有着密切的关系,那么ES与JS之间到底是什么关系呢,我稍微总结了一下,如下:

ES全称(ECMAscript)是国际标准化组织发布的浏览器脚本语言的标准。

JS(Javascript)是一种基于对象和事件驱动的具有安全性能的脚本语言。

可以简单的理解为ES是JS语言的国际标准,JS是基于ES的实现。

2011.6 ES5.1版发布并且成为ISO国际标准。

2015.6 ES6正式通过,成为国际标准。

2021.6.22第 121 届 Ecma 国际(Ecma International)大会以远程会议形式召开。正式通过了ES2021标准,ECMAscript 2021 (ES12)成为事实的 ECMAscript 标准。

在ES6出现之前,Javascript(js)中声明变量有且仅有 var 关键字,函数声明是通过 function 关键字,而在ES6之后,声明变量的方式大有不同分别是 var 、 let 、 const 这三个关键字,函数声明则仍是通过 function。ES6之前ES5中作用域有:全局作用域、函数作用域。没有块作用域的概念。而 ES6后新增了块级作用域。块作用域由 { } 包括,if语句和 for语句里面的{ }也属于块作用域。本篇内容主要讨论一下js中变量声明关键字 var 、 let 和 const 之间的区别与作用域。

var let const 的区别与作用域: 总体概括:

使用var声明的变量,其作用域为该语句所在的函数内,且存在变量提升现象;

使用let声明的变量,其作用域为该语句所在的代码块内,不存在变量提升;

使用const声明的是常量,在后面出现的代码中不能再修改该常量的值。

详细介绍:

1.var

使用var关键字定义的变量,有两种情况,区别是作用域不同。第一种是在函数内使用var声明变量,作用域为函数内,那么这个变量仅限当前函数使用。第二种就是函数外使用var声明变量,作用域为全局,那么这个变量就是全局变量,函数内外均可使用。在声明变量时,如果省略 var ,该变量就会变成默认为全局变量,相当于全局作用域中存在该变量,就会更新其值。

示例:

        //定义var类型全局变量
        var a = 1;
        var a = 1;  //可重复定义变量
        b = 2;

        //var类型测试函数
        function varTypeTest() {
            c = 3;
            var d = 4;
            console.log(a);  //a = 1;全局变量
            console.log(b);  //b = 2;默认为全局变量
        }
        varTypeTest();  //执行varTypeTest函数
        console.log(c);  //c = 4;默认为全局变量
        console.log(d);  //d is not defined;因为c为test函数局部变量

 2.let

使用let定义的变量,是块级作用域的,不能跨函数、跨块访问。同一作用域中不能重复定义相同的变量名。let非常适合用于 for循环内部的块级作用域。JS中的for循环体比较特殊,每次执行都是一个全新的独立的块作用域,用let声明的变量传入到 for循环体的作用域后,不会发生改变,不受外界的影响。

示例:

        //let类型测试函数
        function letTypeTest() {
            //let定义局部变量
            let a = 1;
            let a = 1;  //编写报错!!!;不可重复定义变量
            let b = 1;
            console.log(a);  //a = 1;letTypeTest函数局部变量
            //修改let定义的局部变量
            a++;
            console.log(a);  //a = 2;
            //创建一个块级循环
            for (let i = 0; i < 1; i++) {
                let b = 2;  //仅限于当前块级
                b++;
                console.log(b);  //b = 3;仅限当前块级
            }
            console.log(b);  //b = 1;因为循环内部属于块级作用域;因此不会跨块赋值
        }
        //跨块(跨函数)测试
        function test() {
            console.log(a);  //a is not defined;因为a为letTypeTest函数局部变量;不可跨块
        }

3.const

使用const定义的只能是常量,必须赋初始值,不可以二次赋值,但如果定义的是对象,则可以修改对象属性或者属性值,const也是块级作用域的,不能跨函数、跨块访问。同一作用域中也不能重复定义相同的变量名。

示例:

        //const类型常量测试函数
        function constTypeTest() {
            const a = 1;
            const a = 1;  //编写报错!!!;不可重重复定义常量
            //const定义对象
            const obj = {"name": "马冬梅", "age": 22};
            //修改const定义的常量
            a = 2;  //Assignment to constant variable:提示不可以赋值给常量
            //修改const定义的对象
            obj.age = 25;
            obj.sex = "男";
            console.log(obj);  //{name: '马冬梅', age: 25, sex: '男'};可以修改对象
        }

科普知识:变量提升

当 Javascript 编译所有代码时,所有使用 var 的变量声明都被提升到它们的函数/局部作用域的顶部(如果在函数内部声明的话),或者提升到它们的全局作用域的顶部(如果在函数外部声明的话),而不管实际的声明是在哪里进行的。这就是我们所说的“提升”。请记住,这种“提升”实际上并不发生在你的代码中,而只是一种比喻,与Javascript编译器如何读取你的代码有关。记住当我们想到“提升”的时候,我们可以想象任何被提升的东西都会被移动到顶部,但是实际上你的代码并不会被修改。

函数声明也会被提升,但是被提升到了最顶端,所以将位于所有变量声明之上。

在编译阶段变量和函数声明会被放入内存中,但是你在代码中编写它们的位置会保持不变。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/5654822.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-12-16
下一篇 2022-12-16

发表评论

登录后才能评论

评论列表(0条)

保存