值传递与引用传递

1.赋值

1.1 值传递：原始类型，string，number，bool

let a = 1;
      let b = a;
      console.log('a=%d,b=%d', a, b);
      // 更新a，b不受影响
      a = 2;
      console.log('a=%d,b=%d', a, b);

1.2 引用传递：引用类型，object,array

let obj1 = {
          a: 1,
          b: 2
      };
      console.log(obj1);
      let obj2 = obj1;
      console.log(obj2);
      // 更新obj1
      obj1.a = 10;
      obj1.b = 11;
      console.log(obj1);
      //obj2同步更新
      console.log(obj2);

2.传参
传参时，不论什么类型，都是值传递
入参：调用函数是传入的参数。函数中对参数的更新并不会影响到入参
对于引用类型，只有全新赋值才算是更新，修改属性不算。
3.深拷贝：值传递
4.浅拷贝：引用传递
模板字面量与标签函数

1、模板字面量：将表达式嵌入到字符串；`

let a = 1,
          b = 2;
      let res = a + "+" + b + "=" + (a + b);
      console.log(res);
      // 模板字面量使用反引号:'`';
      res = `${a}+${b}=${a+b}`;
      console.log(res);

模板字面量使用反引号”`”;
模板字面量的组成：

字符串字面量：+，=；

变量表达式： a,b,(a+b);
模板字面量创建多行字符串可以保留格式

let menu = ['首页', '系统', '新闻', '产品'];
      let htmlStr = `
      <ul>
          <li>${menu[0]}</li>
          <li>>${menu[2]}</li>
          <li>>${menu[2]}</li>
          <li>>${menu[3]}</li>
          </ul>
      `;
      console.log(htmlStr);

2、标签函数：自定义模板字面量的行为
使用自定义函数来处理模板字面量，它的参数约定：
第一个参数：模板字面量中的字符串字面量组成的数组；
从第二个参数开始，将模板字面量中的变量以此传入；
解构赋值
解构赋值：快速冲集合数据（数组/对象）解构出独立变量

1、数组

let [a, b, c] = [1, 2, 3];
      console.log(a, b, c);
      [a, b] = [1, 2, 3]
      console.log(a, b);
      [a, b, c, d = 4] = [1, 2, 3]
      console.log(a, b, c, d);
      [a, b, ...c] = [1, 2, 3, 4, 5, 6, 7];
      console.log(a, b, c);
      //单独取一个值
      [, , c, ] = [1, 2, 6, 4]
      console.log(c);
      //交换
      [y,x]=[x,y];

2、对象解构

let {
          id,
          name
      } = {
          id: 10,
          name: '手机'
      };
      console.log(id, name);
      ({
          name,
          id
      } = {
          id: 10,
          name: '手机'
      });
      console.log(id, name);
      let email = 'admin@qq.com';
      let {
          role,
          //取别名
          email: userEmail
      } = {
          role: 'user',
          email: 'user@qq.com'
      };
      console.log(userEmail);
      console.log(email);

3、参数解构
数组传参

let sum = ([a, b]) => a + b;
      console.log(sum([1, 2]));

对象传参

let getUser = ({
          name,
          email
      }) => [name, email];
      console.log(getUser({
          email: 'admin@admin.com',
          name: '系统管理员'
      }));

箭头函数中的this总是指向定义它时的作用域（静态作用域|词法作用域），而非调用时的作用域；

流程控制

1、if else

let score = 59;
      if (score >= 90) {
          console.log('优秀');
      } else if (score >= 80) {
          console.log('良好');
      } else if (score >= 70) {
          console.log('合格');
      } else if (score >= 60) {
          console.log('及格');
      } else {
          console.log('不及格');
      }

2、switch 简化多分支的if else
区间判断 switch(true);

let score = 80;
      switch (true) {
          case score >= 90:
              console.log('优秀');
              break;
          case score >= 80:
              console.log('良好');
              break;
          case score >= 70:
              console.log('合格');
              break;
          case score >= 60:
              console.log('及格');
              break;
          default:
              console.log('补考');
      }

单值

let status = 'success';
      switch (status) {
          case 'ok':
              console.log('成功');
              break;
          case 'fail':
              console.log('失败');
              break;
          default:
              console.log('未知错误');
      }

3、三元运算符
?:

let score=80;
console.log(score>=80?'合格':'补考')；

解构赋值与流程控制

值传递与引用传递

模板字面量与标签函数

解构赋值

流程控制

更多相关文章

随机推荐