理解:有条件的对象属性

1,090 阅读1分钟
不再需要根据一个条件创建两个不同的对象,可以使用展开运算符号来处理。
const getUser = (emailIncluded) => {
  return {
    name: 'John',
    surname: 'Doe',
    ...emailIncluded && { email : 'john@doe.com' }
  }
}

const user = getUser(true);
console.log(user); // outputs { name: "John", surname: "Doe", email: "john@doe.com" }

const userWithoutEmail = getUser(false);
console.log(userWithoutEmail); // outputs { name: "John", surname: "Doe" }
刚开始不是很明白...emailIncluded && { email : 'john@doe.com' }这句代码,其实理解这句代码应先想到运算符优先级,MDN 运算符优先级链接
好了,现在我们知道 && 优先级高于...,所以先执行逻辑与操作,这里附上《JavaScript高级程序设计》一书对于逻辑与操作符的详细介绍:

所以到这里,根据逻辑与定义规则,一切就明白了,true && { email : 'john@doe.com'}得到{ email : 'john@doe.com'}再执行扩展运算符...,结束。

这是我来掘金的第一篇博客,菜鸟一只,欢迎大家评论!!!