Object.assign 是一个 JavaScript 的方法，用于将所有可枚举的属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。
用法
Object.assign(target, ...sources)
target: 目标对象，将接收来自源对象的属性。...sources: 一个或多个源对象，这些对象的属性将会被复制到目标对象上。
const target = { a: 1 }; const source1 = { b: 2 }; const source2 = { c: 3 }; // 合并对象 const result = Object.assign(target, source1, source2); console.log(result); // 输出: { a: 1, b: 2, c: 3 }
在 Vue 和 TypeScript 中的使用
注意事项
- 如果目标对象和源对象有相同的属性，则源对象的属性会覆盖目标对象的属性。
Object.assign只能复制对象的自身属性和可枚举属性。- 对于深层属性的合并，
Object.assign无法处理，需要使用其他方法如 lodash 的_.merge。
在 Vue 和 TypeScript 中的使用
在 Vue 和 TypeScript 环境下，Object.assign 可以用来动态地更新组件的状态或者合并类型定义。
<template><div>{{ mergedData }}</div>
</template><script lang="ts">
import { defineComponent } from 'vue';export default defineComponent({data() {return {baseData: { message: 'Hello' },newData: { count: 42 }};},computed: {mergedData() {return Object.assign({}, this.baseData, this.newData);}}
});
</script>TypeScript 示例
typescript
interface Target {a: number;
}const target: Target = { a: 1 };
const source: Partial<Target> = { a: 2, b: 'extra' as any }; // 使用 Partial 来允许部分属性存在const result = Object.assign(target, source);
console.log(result); // 输出: { a: 2 }, 注意 b 属性不会出现在结果中
