七、ES6补充

1、块级作用域

 <body>
        <button>button1</button>
        <button>button2</button>
        <button>button3</button>
        <button>button4</button>
        <button>button5</button>
        <script>
        //  //1.变量作用域：变量在什么范围内是可用
        //  {
        //     var name = "why";
        //     console.log(name);
        //  }
        //  console.log(name);
        // 2. 没有块级作用域引起的问题
        // if(true){
        //     var name = "why" ;
        // }
        // console.log(name);

        //在ES5中，只有function才有作用域    在ES6中，let有自己的作用域
        let btns = document.getElementsByTagName("button");
        for(let i = 0 ; i<btns.length ; i++){
            btns[i].addEventListener('click',function(){
                debugger;
                console.log("点击了第"+i+"个按钮");
            })
        }
        </script>
    </body>

2、const 的使用

    <body>
        <!-- 
        //注意：1. 一旦const修饰的标识符被赋值之后，不能更改
        // const dbss = 18;
        // dbss=1

        //注意：2. const修饰标识符，必须进行初始化赋值
        // const name;
        
        //注意：3. 常量的含义是指向的对象不能修改，但是可以该表对象的内部属性
        -->
        <script>
          const dbss = 18;

          const obj= {
              name:"cess",
              sex: "男"
          }
          console.log(obj);

          obj.name="测试改变";
          obj.sex="女";
          console.log(obj);
          
        </script>
    </body>

3、对象字面增强量的写法

<script>
        //const obj = new Object();
        //下面得分写法则为字面量
        //   const obj ={};

        //   const obss= {
        //       name: "why",
        //       age: 28,
        //       run :function(){
        //         console.log("在奔跑");
        //       },
        //       eat :function(){
        //         console.log("在吃饭");
        //       }
        //   }


        //1. 属性的增强写法
        //   const name="why";
        //   const age= 18;
        //   const height=1.88;

        //ES5的写法
        //   const aa={
        //     name:name,
        //     age:age,
        //     height:height,
        //   }

        //ES6的写法  会将变量的名称作为key，值作为value
        // const obj={
        //     name,
        //     age,
        //     height
        // }
        // console.log(obj);

        //2.函数的增强写法
        //ES5的写法
        // const obj= {
        //     run : function(){
        //     },
        //     eat : function(){
        //     }
        // }
        //
        //ES6的写法
        // const obj = {
        //     run(){
        //     },
        //     eat(){
        //     }
        // }
        </script>

　　

posted @ 2022-03-30 09:35  搬砖工具人  阅读(29)  评论(0)    收藏  举报