ES6基础：流程控制与DOM操作

最新推荐文章于 2022-11-07 20:44:27 发布

全栈狮子狗

最新推荐文章于 2022-11-07 20:44:27 发布

阅读量539

点赞数

分类专栏：成长记录文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/qq_36346853/article/details/121213373

版权

解构赋值

<body>
    <script>
      const user = ["老师", "12132132@qq.com"];
      // 将用户名,邮箱,保存到独立 变量中
      let userName = user[0];
      let userEmail = user[1];
      console.log(userName, userEmail);

      // es6, 解构完成以上功能
      // 将多值/引用,解析到单值变量中
      // 针对 数组, 对象

      // 1. 数组解构
      // 模板 = 具体的值
      let [name, email] = ["老师", "12132132@qq.com"];
      console.log(name, email);
      //更新
      [name, email] = ["灭绝", "a@qq.com"];
      console.log(name, email);
      // 参数不足: 默认参数
      [name, email, age = 18] = ["灭绝", "a@qq.com"];
      console.log(name, email, age);
      // 参数过多: 归并参数
      let [a, b, c, d, ...e] = [1, 2, 3, 4, 5, 6, 7];
      console.log(a, b, c, d, e);

      // 交换二个数
      let x = 10;
      let y = 20;
      console.log("x = %d, y = %d", x, y);
      // let t = 0;
      // t = x;
      // x = y;
      // y = t;
      // 使用解构一行搞定
      [y, x] = [x, y];
      console.log("x = %d, y = %d", x, y);

      // 2. 对象解构
      let { id, course, score } = { id: 1, course: "JS", score: 88 };
      // 属性与变量同名
      console.log(id, course, score);

      // 等号左边的数据,左值,禁止出现大括号 , 使用括号包住将它转为表达式进行求值
      ({ id, course, score } = { id: 2, course: "PHP", score: 99 });
      console.log(id, course, score);

      // 使用别名,防止命名冲突
      let { name: myName, email: myEmail } = { name: "灭绝", email: "a@qq.com" };
      console.log(myName, myEmail);
      let { ...r } = { a: 1, b: 2, c: 3 };
      console.log(r);

      // 3. 解构用在函数参数
      // function getUser(user) {
      //   console.log(user.id, user.name, user.email);
      // }

      // 作用解构来简化传参与使用
      function getUser({ id, name, email }) {
        console.log(id, name, email);
      }

      getUser({ id: 156, name: "李四", email: "ls@a.com" });
    </script>
  </body>

流程控制: 分支

<body>
    <script>
      //   代码块, 无条件
      {
        //   var , let 区别在于是否支持块级的作用域
        // var a = 123;
        // let a = 123;
        console.log("Hi, 晚上好");
      }

      //   console.log(a);

      // 代码块: 有条件
      let status = false;
      //   单分支
      if (status) {
        console.log("Hi, 晚上好");
      }
      // 双分支
      status = false;
      if (status) {
        console.log("Hi, 晚上好");
      } else {
        // 默认
        console.log("Hi , 上午好");
      }

最低0.47元/天解锁文章

全栈狮子狗

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
ES6基础：流程控制与DOM操作

解构赋值<body> <script> const user = ["老师", "12132132@qq.com"]; // 将用户名,邮箱,保存到独立变量中 let userName = user[0]; let userEmail = user[1]; console.log(userName, userEmail); // es6, 解构完成以上功能 // 将多值/引用,解析到
复制链接

扫一扫