关于前端:20220602每日小记之11个常用的JavaScript小技巧

所有内容均来自web前端开发微信公众号文章，记录作为学习笔记
2022-06-02
知识点目录

1. 通过条件判断向对象增加属性

const isValid = false
const age = 18

const person = {
id:'ak001',
name:'ak47',
...( isValid && { isActive : true } ),
...( ( age>18 || isValid  ) && { cart : 0 } )
}

//'&&'前的表达式为true，就增加'&&'后的属性；为false则不增加。
console.log('person',person)

2. 查看对象中是否存在某个属性

const person = {
id:'ak001',
name:'ak47'
}

console.log( 'name' in person )   //true
console.log( 'isActive' in person ) //false

3. 解构赋值

const product = {
  id: 'ak001',
  name: 'ak47'
}

const { name : weaponName  } = product;
console.log('weaponName:' , weaponName); //weaponName:ak47

//通过动静key进行解构赋值
const extractKey = ‘name’
const { [ extractKey ] : data } = product
console.log( 'data:' ,data ) //data:ak47