原生JavaScript提取对象属性及通过解构创建新对象的方法

1. 原生方法替代Underscore提取属性 #

你示例里用的ES6解构赋值就是最棒的原生解决方案！完全不需要Underscore这类第三方库，语法更简洁，性能也更优。就像你写的：

var fullObject = {'name': 'Jack', 'age': 39, 'device': 'tablet', 'team': 'Red'}
const {name, device, team} = fullObject
console.log(name, device, team) // Jack tablet Red

这已经是原生JS的标准写法了，比Underscore的_.pick(fullObject, 'name', 'device', 'team')还要直观好读。

2. 用解构赋值直接创建新对象 #

当然可以！你现在的分步写法没问题，但其实有几种更简洁的方式，能直接从原对象提取指定属性生成新对象：

方式一：分步解构+对象字面量（直观易懂）

这是最常用的写法，逻辑清晰，新手也能一眼看懂：

const fullObject = {'name': 'Jack', 'age': 39, 'device': 'tablet', 'team': 'Red'}
// 先解构出需要的属性
const {name, device, team} = fullObject
// 用解构后的变量直接创建新对象（ES6对象字面量简写，属性名和变量名一致时可以省略冒号和值）
const newObject = {name, device, team}
console.log(newObject) // {name: 'Jack', device: 'tablet', team: 'Red'}

方式二：一行搞定（立即执行函数封装）

如果想省掉中间变量，用立即执行函数把解构和新对象创建合并成一行：

const fullObject = {'name': 'Jack', 'age': 39, 'device': 'tablet', 'team': 'Red'}
const newObject = (({name, device, team}) => ({name, device, team}))(fullObject)
console.log(newObject) // 同样得到目标对象

方式三：排除法创建新对象（适合排除少数属性的场景）

如果你只需要排除原对象里的个别属性（比如这里的age），可以用剩余操作符...直接提取剩余属性生成新对象，比逐个列举需要的属性更高效：

const fullObject = {'name': 'Jack', 'age': 39, 'device': 'tablet', 'team': 'Red'}
const {age, ...newObject} = fullObject
console.log(newObject) // {name: 'Jack', device: 'tablet', team: 'Red'}

内容的提问来源于stack exchange，提问作者user1107173