JavaScript中的let变量与var变量的不同

最新推荐文章于 2024-07-31 22:33:25 发布

nZk丶

最新推荐文章于 2024-07-31 22:33:25 发布

阅读量144

点赞数

分类专栏： JavaScript&Vue

本文链接：https://blog.csdn.net/weixin_43729854/article/details/89165024

版权

JavaScript&Vue 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

在JS中，var与let都能声明变量，那么它们有什么不同呢？

两者的最主要区别是：var声明的变量的作用域是整个封闭函数

let声明的变量只在其声明的块或子块中可用

上一下代码：


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>t6</title>
</head>
<body>

<button type="button" οnclick="myFunction()">戳我测试var</button>

<script>
    function myFunction() {
        document.innerHTML="请按F12查看控制台"
        var x=1;
        if(true){
            var x=2;
            console.log(x);//写入控制台
        }
        console.log(x);//再在if块外写入一次x，观察x是1还是2
    }
</script>

</body>
</html>

运行结果：

可见两个x都是2，那么就是说var声明的变量的作用域是整个封闭函数（否则则是2,1）

var测试了，我们来测试一下let:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>t7</title>

</head>

<body>

<button type="button" οnclick="myFunction()">戳我测试var</button>



<script>

    function myFunction() {

        document.getElementById("ddt").innerHTML="请按F12查看控制台"

        let x=1;

        if(true){

            let x=2;

            console.log(x);//写入控制台

        }

        console.log(x);//再在if块外写入一次x，观察x是1还是2

    }

</script>

<p id="ddt"></p>

</body>

</html>