JS基础 - Object 对象

整理一下在日常开发中会用到的 Object 的 API

Object.assign()

用途

将所有可枚举属性的值从一个或多个源对象分配到目标对象,并返回目标对象。

语法

Object.assign(target, ...sources)

示例:

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target); // output: { a: 1, b: 4, c: 5 }
console.log(returnedTarget === target); // output: true

注意点:

Object.assign() 方法创建的对象是原对象的浅拷贝。

Object.create()

用途

创造一个新对象,使用现有的对象来提供新创建的对象的原型( __proto__) ,常用来实现寄生式继承

语法

Object.create(proto,[propertiesObject])

示例:

const target = { a: 1 };

const returnedTarget = Object.create(target);

console.log(returnedTarget.__proto__); // output: { a: 1 }

Object.defineProperty()

用途

直接在一个对象上定义一个新属性,或者修改一个对象的属性,并返回此对象。和直接定义属性的区别在于:提供了更多的配置项。

语法

Object.defineProperty(obj, prop, descriptor)

obj:需要被创建/修改属性的对象

prop:需要被修改的对象名

description:配置项

  • value:any,默认值为 undefined,属性值;
  • configurable【可配置】:boolean,默认为 false,为 true 时属性可以被删除(delete)或重新设置(defineProperty),为 false 时则不可以;
  • writable【可写入】:boolean,默认为 false,为 true 时可以被重写,为 false 则不可被重写;
  • enumerable【可枚举】:boolean,默认值为 false,为 true 时属性可以被枚举(for…in / Object.keys());
  • get:function,默认值为 undefined,访问属性时会调用该函数,函数不传入任何参数,但是会传入 this 对象。该函数的返回值会被用作属性的值。
  • set:function,默认值为 undefined,修改属性时会调用该函数,函数接收被赋予的新值和 this 对象。

示例:

var obj = {};

Object.defineProperty(obj,"newKey",{
    value: "hello",
    writable: true,
    enumerable: false
});
var obj = {
    archive: []
};

Object.defineProperty(obj,"newKey",{
    get: function(){ return value },
    set: function(value){ obj.archive.push({ val: value }) }
});

obj.newKey = 1;
console.log( obj ) // output: { archive: [{ val: 1 }] }

注意点:

descriptor 中 value 或 writable 不能和 get 或 set 键同时存在

Object.defineProperties()

用途

与 defineProperty 的用途一致,不过能同时新增或修改多个属性。

语法

Object.defineProperties(obj, props)

示例:

var obj = {};

Object.defineProperties(obj, {
  'property1': {
    value: true,
    writable: true
  },
  'property2': {
    value: 'Hello',
    writable: false
  }
});

Object.entries()

用途

返回一个给定对象自身可枚举属性的键值对数组。

语法

Object.entries(obj)

示例:

var obj = {
    a: 1,
    b: 2
};

Object.entries(obj); // output: [[ "a", 1 ],[ "b", 2 ]]

注意点:

Object.entries() 的作用和 for…in 类似,不过 for…in 还会返回原型链中的属性。

Object.fromEntries()

用途

Object.entries() 的反向操作,可将 Array 、Map 或者其他键值对列表转换为一个对象

语法

Object.fromEntries(iterable);

示例:

const entries = new Map([
  [ "a", 1 ],
  [ "b", 2 ]
]);
const entries2 = [
  [ "a", 1 ],
  [ "b", 2 ]
];

const obj1 = Object.fromEntries(entries);
const obj2 = Object.fromEntries(entries2);

console.log(obj); // output: { a: 1, b: 2 }
console.log(obj2); // output: { a: 1, b: 2 }

Object.freeze()

用途

冻结一个对象,冻结对象的属性不能新增或者修改,且不能修改已有属性的可枚举性(enumerable)、可配置性(configurable)、可写性(writable),但是如果对象的值是对象,则还是可以修改值对象里面的内容。

语法

Object.freeze(obj)

示例:

const obj = {
  prop: 42
};

Object.freeze(obj); 

obj.prop = 33; // Error

Object.seal()

用途

封闭一个对象,阻止添加新属性并将所有现有属性标记为不可配置。

freeze 和 seal 的共同点在于:对象变得不可配置(configurable),无法添加或删除属性,不同点在于:seal 封闭对象的属性可写(writable),而 freeze 冻结对象的属性不可写。

语法

Object.seal(obj)

Object.is()

用途

判断两个值是否为同一个值,和全等(===)一样,他并不会进行类型转换,具体区别如下图所示:

语法

Object.is(value1, value2);

Object.keys()

用途

返回一个由一个给定对象的自身可枚举属性组成的数组。

语法

Object.keys(obj)

示例:

var arr = ['a', 'b', 'c'];

console.log(Object.keys(arr)); // output: ["0", "1", "2"]

var obj = { a: 1, b: 2, c: 3 };

console.log(Object.keys(arr)); // output: ["a", "b", "c"]

Object.values()

用途

返回一个给定对象自身的所有可枚举属性值的数组。

语法

Object.values(obj)

示例:

var obj = { a: 1, b: 2, c: 3 };

console.log(Object.keys(arr)); // output: [1, 2, 3]

Object.getPrototypeOf()

用途

获取指定对象的原型

语法

Object.getPrototypeOf(object)

示例:

const prototype1 = {};
const object1 = Object.create(prototype1);

console.log(Object.getPrototypeOf(object1) === prototype1); // output: true

Object.setPrototypeOf()

用途

设置指定对象的原型,其作用和Object.create()是一样的,但是对于数据量很大的对象来说,Object.create()的性能会更好。

语法

Object.setPrototypeOf(obj, prototype)

Object.getOwnPropertyNames()

用途

返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组

语法

Object.getOwnPropertyNames(obj)

示例:

var obj = { a: 1, b: 2, c: 3 };
Object.getOwnPropertyNames(obj); // output: ["a", "b", "c"]

以下为原型方法:

Object.prototype.toString()

用途

返回一个表示该对象的字符串

语法

Object.setPrototypeOf(object)

示例:

var obj = new Object();
obj.toString(); // output: [object Object]

注意点:

toString()方法可能被覆盖,所以在调用时需要以Object.prototype.toString.call(obj)的形式来调用。

Object.prototype.valueOf()

用途

返回指定对象的原始值

不同对象的 valueOf 方法返回值

对象 返回值
Array 数组本身
Boolean Boolean
Date UTC 时间
Function 函数本身
Number Number
Object 对象本身
String String

语法

object.valueOf()

示例:

var obj = new Object();
obj.valueOf(); // output: {}

Object.prototype.hasOwnProperty()

用途

返回一个布尔值,用于表示对象自身属性中是否含有指定属性

语法

object.valueOf()

示例:

var obj = { a: 1 };
obj.hasOwnProperty("b"); // output: false
作者

BiteByte

发布于

2021-07-27

更新于

2024-02-24

许可协议