学习ES6 对对象的扩展方法-Object.assign()

前言

前一篇更文对 ES6 对于对象的新增扩展 对象-属性的可枚举性使用进行了学习了解, 以及有对对象的扩展进行了初步学习-对象属性的简写&对象的扩展运算符"...". 本文继续来学习 ES6 的重要的知识点

熟练使用 ES6 及更高版本对于我们在项目开发中可提高开发效率! 前面文章学习了 JavaScript 中操作数组的一些方法(Array.splice()/slice()/map()/reduce()等高阶函数), JavaScript 并不完美但是不影响其运行, 这里学习其中的一些神奇"bug"直达列表

ES6 - 对象的扩展

ES6 对对象扩展了许多方法, 这些方法不仅方便了我们书写, 有对有些数据处理进行了优化, 更加便捷地方便我们处理数据逻辑等.

对象新增方法-Object.assign()

Object.assign(): 用于对象的合并

MDN 权威解释: Object.assign()  方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。

let arr = { a: 1 }

let arr1 = { b: 2 }
let arr2 = { c: 3 }

Object.assign(arr, arr1, arr2)
arr // {a:1, b:2, c:3}

Object.assign()方法的第一个参数是要合并其他参数并返回的目标对象, 后面的参数都是源对象, 如果只有一个参数, 那Object.assign()会直接返回该参数

let arr = { a: 1 }

Object.assign(arr) // arr { a: 1 }

如果传递的不是一个对象, 比如一个数字, 那么 Object.assign() 将会把这个非对象转换为对象返回

typeof Object.assign(9999) // "object"

使用 && 注意:

1. Object.assign() 可以用于浅拷贝, 而不是深拷贝. 通过其进行的拷贝得到的是源目标对象的引用

let obj1 = { a: { b: 1 } }
let obj2 = Object.assign({}, obj1)

obj1.a.b = 2
obj2.a.b // 2 修改了 obj1 的值, obj2 通过其拷贝得到的,是对象的引用..

2. 由于 null 和 undefined 无法转成对象, 所以如果它们作为参数, 就会报错

Object.assign(null) // 报错
Object.assign(undefined) // 报错

相关阅读文章列表

• JavaScript 学习-函数剩余参数
• JS 小问题学习-函数可选参数
• JS 学习-for 循环
• JS 不完美亦可运行-自动加分号(;)问题、
• JS 不完美亦可运行-数组对象相加问题、
• JS 并不完美之箭头函数相关(二)、
• JS 并不完美~(一)浮点数
• JavaScript 高阶函数(一)
• JavaScript 高阶函数之 reduce
• 数组扁平化 Array.prototype.flat()
• 灵活操作数组数据 slice()
• 灵活操作数组-数组中间插入数据 splice()

学习 ES6系列:

1. ES6-解构赋值
2. ES6-数组扩展方法-find()/findIndex()
3. ES6-数组扩展方法-Array.from()处理数组
4. ES6 学习理解-Array 扩展方法 includes()
5. ES6 学习理解-Array 扩展 sort()排序的稳定性
6. ES6 学习理解-Proxy(一)
7. ES6 学习理解-Proxy 的使用(二)
8. ES6 对对象的扩展方法-属性简写
9. ES6 对象的扩展方法-扩展运算符
10. ES6 属性的可枚举性

学习参考文档

• MDN | ES6-Object.assign()