js内置对象

Js 标准内置对象

Object

Object 是 JavaScript 的一种数据类型。它用于存储各种键值集合和更复杂的实体。可以通过 Object() 构造函数或者使用对象字面量的方式创建对象。

Object.assign()

Object.assign() 静态方法将一个或者多个源对象 中所有可枚举自有属性复制到目标对象,并返回修改后的目标对象。

js 复制代码
const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source); 
// target 目标对象 需要应用源对象属性的目标对象,修改后将作为返回值
// source 源对象

console.log(target);
// Expected output: Object { a: 1, b: 4, c: 5 }

描述

如果目标对象与源对象具有相同的键(属性名),则目标对象中的属性将被源对象中的属性覆盖,后面的源对象的属性将类似地覆盖前面的源对象的同名属性。

Object.assign() 方法只会拷贝源对象可枚举的自有属性 到目标对象。该方法在源对象上使用 [[Get]],在目标对象上使用 [[Set]],因此它会调用 gettersetter。故它对属性进行赋值,而不仅仅是复制或定义新的属性。如果合并源对象包含 getter 的新属性到原型中,则可能不适合使用此方法。

如果要将属性定义(包括它们的可枚举性)复制到原型中,则应改用 Object.getOwnPropertyDescriptor()Object.defineProperty() 方法。

字符串Symbol 类型属性都会被复制。

如果赋值期间出错,例如如果属性不可写,则会抛出 TypeError;如果在抛出异常之前已经添加了一些属性,则这些属性会被保留,而 target 对象也会被修改。

备注: Object.assign() 不会在源对象值为 nullundefined 时抛出错误

  1. 复制对象
js 复制代码
const obj = { a: 1 };
const copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }

深拷贝问题

针对深拷贝,需要使用其他办法,因为 Object.assign() 只复制属性值。

js 复制代码
const obj1 = { a: 0, b: { c: 0 } };
const obj2 = Object.assign({}, obj1);
console.log(obj2); // { a: 0, b: { c: 0 } }

obj1.a = 1;
console.log(obj1); // { a: 1, b: { c: 0 } }
console.log(obj2); // { a: 0, b: { c: 0 } }

obj2.a = 2;
console.log(obj1); // { a: 1, b: { c: 0 } }
console.log(obj2); // { a: 2, b: { c: 0 } }

// 假如源对象是一个对象的引用,它仅仅会复制其引用值。
obj2.b.c = 3;
console.log(obj1); // { a: 1, b: { c: 3 } }
console.log(obj2); // { a: 2, b: { c: 3 } }

// 深拷贝
const obj3 = { a: 0, b: { c: 0 } };
const obj4 = JSON.parse(JSON.stringify(obj3));
obj3.a = 4;
obj3.b.c = 4;
console.log(obj4); // { a: 0, b: { c: 0 } }
  1. 合并对象
js 复制代码
const o1 = { a: 1 };
const o2 = { b: 2 };
const o3 = { c: 3 };

const obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1); // { a: 1, b: 2, c: 3 },目标对象本身发生了变化

// 合并具有相同属性的对象   
const o1 = { a: 1, b: 1, c: 1 };
const o2 = { b: 2, c: 2 };
const o3 = { c: 3 };

const obj = Object.assign({}, o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }

属性会被后续参数中具有相同属性的其他对象覆盖。
4.

复制代码
  ### [拷贝 Symbol 类型属性](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#%E6%8B%B7%E8%B4%9D_symbol_%E7%B1%BB%E5%9E%8B%E5%B1%9E%E6%80%A7)
js 复制代码
const o1 = { a: 1 };
const o2 = { [Symbol("foo")]: 2 };

const obj = Object.assign({}, o1, o2);
console.log(obj); // { a : 1, [Symbol("foo")]: 2 } (cf. bug 1207182 on Firefox)
Object.getOwnPropertySymbols(obj); // [Symbol(foo)]
复制代码
  ### [原型链上的属性和不可枚举的属性不能被复制](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#%E5%8E%9F%E5%9E%8B%E9%93%BE%E4%B8%8A%E7%9A%84%E5%B1%9E%E6%80%A7%E5%92%8C%E4%B8%8D%E5%8F%AF%E6%9E%9A%E4%B8%BE%E7%9A%84%E5%B1%9E%E6%80%A7%E4%B8%8D%E8%83%BD%E8%A2%AB%E5%A4%8D%E5%88%B6)
复制代码
  ### [基本类型会被封装为对象](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#%E5%9F%BA%E6%9C%AC%E7%B1%BB%E5%9E%8B%E4%BC%9A%E8%A2%AB%E5%B0%81%E8%A3%85%E4%B8%BA%E5%AF%B9%E8%B1%A1)
js 复制代码
const v1 = "abc";
const v2 = true;
const v3 = 10;
const v4 = Symbol("foo");

const obj = Object.assign({}, v1, null, v2, undefined, v3, v4);
// 基本类型将被封装,null 和 undefined 将被忽略。
// 注意,只有字符串封装对象才拥有可枚举的自有属性。
console.log(obj); // { "0": "a", "1": "b", "2": "c" }
复制代码
  ### [异常会中断后续的复制](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#%E5%BC%82%E5%B8%B8%E4%BC%9A%E4%B8%AD%E6%96%AD%E5%90%8E%E7%BB%AD%E7%9A%84%E5%A4%8D%E5%88%B6)
相关推荐
曲幽14 小时前
手把手搞定FastAPI静态文件:安全、上传与访问
css·python·fastapi·web·js·favicon·staticfiles
冥界摄政王19 小时前
Cesium学习第二章 camera 相机
node.js·html·vue3·js·cesium
浩泽学编程3 天前
内网开发?系统环境变量无权限配置?快速解决使用其他版本node.js
前端·vue.js·vscode·node.js·js
芳草萋萋鹦鹉洲哦5 天前
【pixijs】关于pixijs画圆
cocos2d·js
程序媛小鱼9 天前
openlayers撤销与恢复
前端·js
Han.miracle9 天前
JQuery 基础与综合案例实践
jquery·js
FE阿祖10 天前
koa学习
koa·js·ndoe
东方不败之鸭梨的测试笔记10 天前
lodash-cloneDeep
js
道法自然|~13 天前
【建站】网站使用天地图
html·web·js
小阿宁的猫猫14 天前
XSS的原理、使用、防御方法及练习题
web安全·网络攻击模型·xss·js