解构与展开运算符

5.1解构赋值

用法1. 变量重命名

const { name: userName, age: userAge } = user;
console.log(userName); // '张三'
console.log(userAge);  // 28

用法2. 默认值设置

const { name, gender = 'male' } = user;
console.log(gender); // 'male' (当user.gender不存在时使用默认值)

用法3. 展开运算符

展开运算符也可以用于解构赋值中，用于提取数组或对象的剩余部分。

const { id, ...userInfo } = user;
console.log(userInfo); // { name: '张三', age: 28, email: 'zhangsan@example.com' }

用法4.只解构需要的属性，并对某些属性重命名

const {
  id: userId,
  username,
  realName: name,
  email,
  ...restInfo  // 收集剩余属性
} = userData;

console.log(userId, name); // 1001 '王小明'
console.log(restInfo); // { age: 28, phone: '13800138000', ... }

. 用法5.嵌套对象解构

const order = {
  orderId: 'ORD-2023-001',
  customer: {
    name: '李小红',
    memberId: 'VIP-008',
    contact: {
      mobile: '13900139000',
      wechat: 'lixiaohong'
    }
  },
  items: [
    { id: 1, name: '商品A' },
    { id: 2, name: '商品B' }
  ]
};

// 多层级解构
const {
  orderId,
  customer: {
    name: customerName,
    contact: { mobile }
  },
  items: [firstItem]
} = order;

console.log(`订单 ${orderId}`);
console.log(`客户 ${customerName} 手机号 ${mobile}`);
console.log(`首个商品 ${firstItem.name}`);

5.2 展开运算符

展开运算符：用于对原有数值进行复用

//------数组-------
const arr1 = [1, 2, 3];
const arr2 = [...arr1]; // 使用展开运算符复制数组
const combined = [...arr1, ...arr2]; // 合并两个数组
const newArr = [0, ...arr1, 4]; // 在数组前后添加新元素
//------对象-------
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const obj3 = { ...obj1 }; // 使用展开运算符复制对象
const combined = { ...obj1, ...obj2 }; // 合并两个对象

function sum(a, b, c) {
  return a + b + c;
}

const args = [1, 2, 3];
console.log(sum(...args)); // 输出: 6

六.js使用

1."&&"和"||"产生的短路运算

在&&的运算中

if(a > = 5){
  alert(“hello world”);
}
//可以写成：
a > = 5 && alert(“hello world”);

在||的运算中，代码从左往右执行，如果都为假，则返回最后一个假值，当遇到真值的时候，就会发生短路，并且返回这个真值，代码不再往下执行。

var add_level = "" ;    

if(add_step == 5){    
    add_level = 1 ; 
}    
else if(add_step == 10){    
  add_level = 2 ;     
}    
else if(add_step == 12){    
     add_level = 3 ; 
}    
else if(add_step == 15){    
     add_level = 4 ;  
}    
else {    
      add_level = 0 ;   
}  
//另外就是用switch写了

let add_level = (add_step==5 && 1) || (add_step==10 && 2) || (add_step==12 && 3) || (add_step==15 && 4) || 0;