块级作用域


<!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>Document</title>
</head>

<body>
    <script>

        // 作用域指变量所作用的范围,在 Javascript 中有两种作用域:
        // 全局作用域
        // 函数作用域

        //ES6又新增了块级作用域 块级作用域只有在块语句{}下用let const才生效,同时只对let const变量有作用

        /**MDN block
         *通过var声明的变量或者非严格模式下(non - strict mode) 创建的函数声明没有块级作用域。
         * 在语句块里声明的变量的作用域不仅是其所在的函数或者 script 标签内,
         * 所设置变量的影响会在超出语句块本身之外持续存在。
         * 换句话说,这种语句块不会引入一个作用域。尽管单独的语句块是合法的语句,
         * 但在 JavaScript 中你不会想使用单独的语句块,
         */

        //  var定义的变量,没有块的概念,可以跨块访问, 不能跨函数访问。
        //  let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问。
        //  const用来定义常量,使用时必须初始化(即必须赋值),只能在块作用域里访问,而且不能修改。



        // //1.在函数外var定义 会变成全局变量
        // for (var i = 0; i < 10; i++) {
        //     console.log(i);
        // }
        // console.log(i);

        //2.使用let const会形成块级作用域
        //只要是带有{}括号的都会变成块级作用域
        //但如果在高层环境定义依然能被访问
        // for (let k = 0; k < 10; k++) {
        //     (function () {
        //         console.log(k);
        //     })()
        // }
        // console.log(k);//undefined

        ////3.***块级作用域只针对let const变量本身 不会影响 var 或全局变量***
        // if (true) {
        //     let a = 2;
        //     var b = 3;
        //     window.c = 5;
        // }
        // console.log(c);
        // console.log(b);
        // // console.log(a);//报错


        // //4.块级作用域解决settimeout循环输出
        // //for循环创建了x次块级作用域
        // //它们之间互相不干扰
        // //settimeout函数异步执行了块级作用域变量x
        // for (let x = 0; x < 10; x++) {
        //     setTimeout(() => {
        //         console.log(x);
        //     }, 1000);
        // }

        // //5.函数作用域(局部作用域)
        // //形参也是函数变量
        // (function (n) {
        //     console.log(n)
        // })(2)
        // console.log(n)//报错

        //6.try() catch
        //var被定义为全局作用域 let定义为块级作用域
        //catch 块捕获的异常只能在catch里使用
        // try {
        //     throw new Error('debug');
        // } catch (e) {
        //     var o = 1;
        //     let p = 1;
        //     console.log(e);
        // }
        // console.log(o);
        // console.log(e);//报错 define
        // console.log(p);//报错 define

        //事实上这种题出的知识点非常的偏 并没有多少实际意义
        
        //难题1
        //在立即执行函数中 函数a与let a存在于不同区块 互不干扰
        // let a = 1;
        // (function a() {
        //     a = 2;
        //     console.log(a);//返回a函数体
        // })()
        // console.log(a);//返回1

        // //难题2 函数声明导致,MDN推荐使用表达式a=funciton(){}
        // var a = 1;
        // if (true) {
        //     console.log(a)//函数 函数提升
        //     a = 2;
        //     console.log(a)//2
        //     function a() { }
        //     a = 3
        //     console.log(a)//3
        // }
        // console.log(a)//2 为什么???



    </script>
</body>

</html>

文章作者: iamfugui
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 iamfugui !
评论
  目录