前端开发：JS中向对象中添加对象的方法

前言

在前端开发过程中，一切皆对象，尤其是在数据处理的时候，大部分时候也是处理对象相关的数据，所以对象在JS中是很重要的一个内容，也是必用的内容。本篇博文来分享一下关于在JS中对象里面添加对象的操作，虽然知识点不难，但是常用，所以总结一下存起来，方便查阅使用。

对象是什么？

在JS中，对象就是一种数据类型，即引用数据类型。在ECMAScript中引用类型是一种数据结构，主要是把数据和功能融合在一起。所以这里所说的对象就是Object。

向对象中添加对象的场景

在实际开发过程中，有时候会遇到合并两个对象的业务场景，或者是把对象A添加到对象B中，一般这种需求都是在提交表单数据给后台的时候比较常见。而且这种给对象中添加对象的需求很常见且重要，所以要掌握。

对象中添加对象的方式

在JS中向对象中添加对象的操作方法大概有三种：直接添加、使用扩展运算符...、Object.assign()方法。

1、直接添加

直接在对象A中添加需要的键值对内容，具体示例如下所示：

let objectA = {
  name: 'Tom'
};
let key = 'age';
let value = 31;
objectA[key] = value;   //结果为：objectA.age = 18
console.log( 'objectA===>',objectA);  //输出结果为：objectA===> {name: 'Tom', age: 31}

2、使用扩展运算符...

使用扩展运算符...实现对象中添加对象是比较常用的方式，具体示例如下所示:

let objectA = {
    name: 'Tom'
};   
let objectB = {
     age: 31   
};
let object = { ...objectA, ...objectB};
console.log( 'object===>',object);   //输出结果为：object===> {name: 'Tom', age: 31}

3、Object.assign()方法

Object.assign()方法有好几个用法，主要是用于将所有可枚举属性的值从一个或多个源对象复制到目标对象中。这里主要是介绍关于对象的合并相关的功能，具体示例如下所示：

let objectA = {
    name: 'Tom'
};   
let objectB = {
    age: 31   
};
Object.assign( objectA, objectB);
console.log( 'objectA===>',objectA);  //输出结果为：objectA===> {name: 'Tom', age: 31}

最后

通过本文的介绍，关于在JS中对象里面添加对象的操作就得心应手了，虽然该知识点不难但是重要和常用，尤其是对于刚接触前端开发不久的开发者来说更是如此，所以绝对掌握该知识点还是很有必要的，重要性不再赘述。欢迎关注，共同进步。

本文参与了「SegmentFault 思否写作挑战赛」，欢迎正在阅读的你也加入。