对象字面量的增强

属性和方法的简洁表示法

  1.       // 1.对象字面量是什么
  2.       // 实例化构造函数生成对象
  3.       // const person = new Object();
  4.       // person.age = 18;
  5.       // person.speak = function () {};
  7.       // 对象字面量
  8.       // const person = {
  9.       //   age: 18,
  10.       //   speak: function () {}
  11.       // };
  13.       // 2.属性的简洁表示法
  14.       // 键名和变量或常量名一样的时候，可以只写一个
  15.       // const age = 18;
  16.       // const person = {
  17.       //   // age: age
  18.       //   age
  19.       // };
  20.       // console.log(person);
  22.       // 3.方法的简洁表示法
  23.       // 方法可以省略冒号和 function 关键字
  24.       const person = {
  25.         // speak: function () {}
  26.         speak() {}
  27.       };
  28.       console.log(person);

方括号语法

  1.       // 1.方括号语法的用法
  2.       // const prop = 'age';
  3.       // const person = {};
  5.       // // person.prop = 18;
  6.       // person[prop] = 18;
  8.       // 方括号语法可以写在对象字面量中
  9.       // const person = {
  10.       //   [prop]: 18
  11.       // };
  13.       // console.log(person);
  15.       // 2.方括号中可以放什么
  16.       // ${}
  17.       // [值或通过计算可以得到值的（表达式）]
  18.       // const prop = 'age';
  19.       // const func = () => 'age2';
  20.       // const person = {
  21.       //   // [prop]: 18
  22.       //   // [func()]: 18
  23.       //   // ['sex']: 'male'
  24.       //   ['s' + 'ex']: 'male'
  25.       // };
  26.       // console.log(person);
  28.       // 3.方括号语法和点语法的区别
  29.       // 点语法是方括号语法的特殊形式
  30.       const person = {};
  31.       // person.age 等价于 person['age']
  33.       // 属性名由数字、字母、下划线以及 $ 构成，并且数字还不能打头的时候可以使用点语法
  34.       // age18_$ √
  35.       // 18age ×
  36.       // 合法标识符可以用来作为变量或常量名
  38.       // 当你的属性或方法名是合法标识符时，可以使用点语法，其他情况下请使用方括号语法

函数参数的默认值

函数参数的默认值是什么

  1.       // 1.认识函数参数的默认值
  2.       // 调用函数的时候传参了，就用传递的参数；如果没传参，就用默认值
  3.       // multiply(2, 1);
  4.       // multiply(2);
  6.       // 2.函数参数默认值的基本用法
  7.       // const multiply = (x, y) => {
  8.       //   if (typeof y === 'undefined') {
  9.       //     y = 1;
  10.       //   }
  12.       //   return x * y;
  13.       // };
  15.       const multiply = (x, y = 1) => x * y;
  16.       console.log(multiply(2));

函数参数默认值的注意事项

  1.       // 1.默认值的生效条件
  2.       // 不传参数，或者明确的传递 undefined 作为参数，只有这两种情况下，默认值才会生效
  3.       // const multiply = (x, y = 1) => x * y;
  4.       // // console.log(multiply(2, 0));
  5.       // // console.log(multiply(2, null));
  6.       // console.log(multiply(2, undefined));
  7.       // console.log(multiply(2));
  9.       // 2.默认值表达式
  10.       // 如果默认值是表达式，默认值表达式是惰性求值的
  12.       // 3.设置默认值的小技巧
  13.       // 函数参数的默认值，最好从参数列表的右边开始设置
  14.       // const multiply = (x = 1, y) => x * y;
  15.       // console.log(multiply(undefined, 2));
  17.       const multiply = (x, y = 1) => x * y;
  18.       console.log(multiply(2));

函数参数默认值的应用

  1.       // 1.接收很多参数的时候
  2.       // const logUser = (username = 'ZhangSan', age = 0, sex = 'male') =>
  3.       //   console.log(username, age, sex);
  4.       // logUser('Alex', 18, 'male');
  5.       // logUser();
  7.       // 2.接收一个对象作为参数
  8.       // const logUser = options =>
  9.       // console.log(options.username, options.age, options.sex);
  11.       const logUser = ({ username = 'zhangsan', age = 0, sex = 'male' } = {}) =>
  12.         console.log(username, age, sex);
  13.       // logUser({
  14.       //   username: 'alex',
  15.       //   age: 18,
  16.       //   sex: 'male'
  17.       // });
  18.       // logUser({ username: 'alex' });
  19.       // { username = 'zhangsan', age = 0, sex = 'male' } = { username: 'alex' }
  21.       // logUser({});
  22.       logUser();
  23.       // { username = 'zhangsan', age = 0, sex = 'male' } = {}
  25.       // { username = 'zhangsan', age = 0, sex = 'male' } = undefined