JS 常用的技巧和几个鲜为人知的特性( 二 )

2025-12-27 JS

const cities = [ { name: 'Paris', visited: 'no' }, { name: 'Lyon', visited: 'no' }, { name: 'Marseille', visited: 'yes' }, { name: 'Rome', visited: 'yes' }, { name: 'Milan', visited: 'no' }, { name: 'Palermo', visited: 'yes' }, { name: 'Genoa', visited: 'yes' }, { name: 'Berlin', visited: 'no' }, { name: 'Hamburg', visited: 'yes' }, { name: 'New York', visited: 'yes' }];const cityNames = Array.from(cities, ({ name}) => name);console.log(cityNames);// outputs ["Paris", "Lyon", "Marseille", // "Rome", "Milan", "Palermo", "Genoa", "Berlin", "Hamburg", "New York"]有条件的对象属性
不再需要根据一个条件创建两个不同的对象，可以使用展开运算符号来处理。
nst 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" }动态属性名
早期，如果属性名需要是动态的，我们首先必须声明一个对象，然后分配一个属性。这些日子已经过去了，有了ES6特性，我们可以做到这一点。
const dynamic = 'email';let user = { name: 'John', [dynamic]: 'john@doe.com'}console.log(user); // outputs { name: "John", email: "john@doe.com" }代码部署后可能存在的BUG没法实时知道，事后为了解决这些BUG，花了大量的时间进行log 调试。

作者：Euel Duran
来源： Dev
译者：前端小智

推荐阅读

上一篇：中国十大名茶历史传奇

下一篇：茶不能总是端上来也不能总是假装