暂无图片
暂无图片
暂无图片
暂无图片
暂无图片

Object方法总结

Aid前端 2021-10-17
177

Object方法总结

Object的方法总结:(28个)

枚举对象的相关方法


方法作用参数返回值
Object.keys()枚举对象自身的属性要枚举的对象['key1', 'key2', ···]
Object.values()枚举对象自身的属性值要枚举的对象[value1,value2, ···]
Object.entries()枚举属性及其值并返回 [ '键',值 ] 二维数组要枚举的对象[['key1', value1], ['key2', value2], ··· ]
Object.fromEntries()把键值对列表转换为对象(上述方法的逆过程)键值对列表object


对象属性描述的相关方法(重点)

Object.assign()

作用:

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

语法:

Object.assign(target, ...sources)

参数:

target:目标对象

sources:源对象(可以为多个)

返回值:

目标对象

描述:

  1. 有相同的键会被覆盖

  2. 只会拷贝源对象自身的并且可枚举的属性到目标对象

使用场景:

  • 合并对象
const o1 = { a1 };
const o2 = { b2 };
const o3 = { c3 };
const obj = Object.assign(o1o2o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1);  // { a: 1, b: 2, c: 3 }, 注意目标对象自身也会改变。

注意:注意目标对象自身也会改变

  • 浅拷贝
let obj1 = { a0 , b: { c0}};
let obj2 = Object.assign({}, obj1);
obj1.b.c = 1;
console.log(obj1); // { a: 0, b: { c: 1 } }
console.log(obj2); // { a: 0, b: { c: 1 } }

注意:如果源值是一个对象的引用,它仅仅会复制其引用值

  • 字符串转对象
const v1 = "abc";
const obj = Object.assign({}, v1);
console.log(obj); // { "0": "a", "1": "b", "2": "c" }

注意:只有字符串的包装对象才可能有自身可枚举属性。


Object.defineProperty()

作用:

直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。

语法:

Object.defineProperty(obj, prop, descriptor)

参数:

obj:要定义属性的对象。 prop:要定义或修改的属性的名称或 Symbol 。 descriptor:要定义或修改的属性描述符。

对象里目前存在的属性描述符有两种主要形式:数据描述符存取描述符。数据描述符是一个具有值的属性,该值可以是可写的,也可以是不可写的。存取描述符是由 getter 函数和 setter 函数所描述的属性。一个描述符只能是这两者其中之一;不能同时是两者。

描述符descriptor

configurableenumerablewritablevaluegetset
作用是否可配置是否可枚举是否可写属性值访问该属性时触发属性值被修改时触发
默认值falsefalsefalseundefinedundefinedundefined
数据描述符可以可以可以可以不可以不可以
存取描述符可以可以不可以不可以可以可以

返回值:

被传递给函数的对象。

例子:

var o = {}; // 创建一个新对象

// 在对象中添加一个属性与数据描述符的示例
Object.defineProperty(o"a", {
 value : 37,
 writable : true,
 enumerable : true,
 configurable : true
});

// 对象 o 拥有了属性 a,值为 37

// 在对象中添加一个设置了存取描述符属性的示例
var bValue = 38;
Object.defineProperty(o"b", {
 // 使用了方法名称缩写(ES2015 特性)
 // 下面两个缩写等价于:
 // get : function() { return bValue; },
 // set : function(newValue) { bValue = newValue; },
 get() { return bValue; },
 set(newValue) { bValue = newValue; },
 enumerable : true,
 configurable : true
});

o.b// 38
// 对象 o 拥有了属性 b,值为 38
// 现在,除非重新定义 o.b,o.b 的值总是与 bValue 相同

// 数据描述符和存取描述符不能混合使用
Object.defineProperty(o"conflict", {
 value0x9f91102,
 get() { return 0xdeadbeef; }
});
// 抛出错误 TypeError: value appears only in data descriptors, get appears only in accessor descriptors

Object.defineProperties()

作用:

直接在一个对象上定义新的属性或修改现有属性,并返回该对象。

语法:

Object.defineProperties(obj, props)

参数:

obj:在其上定义或修改属性的对象。 props:要定义其可枚举属性或修改的属性描述符的对象。

返回值:

传递给函数的对象。

例子:

var obj = {};
Object.defineProperties(obj, {
 'property1': {
   valuetrue,
   writabletrue
},
 'property2': {
   value'Hello',
   writablefalse
}
 // etc. etc.
});


Object.create()

作用:

以指定对象为原型创建新的对象

语法:

Object.create(proto,[propertiesObject])

参数:

  1. proto:新创建对象的原型对象。

  2. propertiesObject:参考Object.defineProperties()的第二个参数

返回值:

一个新对象,带着指定的原型对象和属性

使用场景:

  • 实现类式继承

// Shape - 父类(superclass)
function Shape() {
 this.x = 0;
 this.y = 0;
}

// 父类的方法
Shape.prototype.move = function(xy) {
 this.x += x;
 this.y += y;
 console.info('Shape moved.');
};

// Rectangle - 子类(subclass)
function Rectangle() {
 Shape.call(this); // call super constructor.
}

// 子类续承父类
Rectangle.prototype = Object.create(Shape.prototype);
Rectangle.prototype.constructor = Rectangle;

var rect = new Rectangle();
  • 以纯净模式创建对象

我们可以把它当作一个非常纯净的map来使用,我们可以自己定义hasOwnProperty
toString
方法

var o = Object.create(null,{
   a:{
       writable:true,
       configurable:true,
       value:'1'
  }
})
console.log(o)

注意:使用这种方式创建的对象,原型链上没有任何属性。


获取对象自身属性的相关方法

方法作用
Object.getOwnPropertyDescriptor(obj, prop)返回指定对象上一个自有属性对应的属性描述符
Object.getOwnPropertyDescriptors(obj)获取一个对象的所有自身属性的描述符
Object.getOwnPropertyNames(obj)返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组
Object.getOwnPropertySymbols(obj)方法返回一个给定对象自身的所有 Symbol 属性的数组
Object.getPrototypeOf(obj)方法返回指定对象的原型(内部[[Prototype]]属性的值)
Object.setPrototypeOf(obj, prototype)设置一个指定的对象的原型 ( 即, 内部[[Prototype]]属性)到另一个对象或 null

冻结对象的相关方法

方法作用
Object.freeze(obj)冻结对象。禁止一切关于对象属性的操作,原型也不能被修改。(只可修改属性对象里面的值)
Object.isFrozen(obj)判断对象是否被冻结。一个不可扩展的空对象也是冻结对象。返回true。
Object.seal(obj)封闭对象。不可添加新属性,属性变为不可配置,但是属性值可以改。(只可修改属性值)
Object.isSealed(obj)判断对象是否被密封。一个不可扩展的空对象也是密闭对象。返回true。冻结对象也是密闭对象。
Object.preventExtensions(obj)让对象不可扩展(禁止添加新属性)。但对象的原型依然可以添加新属性。(可改,可删,不可添)
Object.isExtensible(obj)判断对象是否是可扩展的。freeze,seal,preventExtensions都可以让对象不可扩展

实例对象上的相关方法

方法作用
Object.prototype.toLocaleString()表示对象的字符串(根据你机器的本地环境来返回字符串)
Object.prototype.toString()表示对象的字符串(不会因为本地环境(例如国家)改变而改变)
Object.prototype.valueOf()返回指定对象的原始值
Object.prototype.propertyIsEnumerable()返回一个布尔值,表示指定的属性是否可枚举
Object.prototype.isPrototypeOf()测试一个对象是否存在于另一个对象的原型链上
Object.prototype.hasOwnProperty()对象自身属性中是否具有指定的属性

这些方法的用法:obj.toLocaleString()

其他方法

Object.is()

作用:

判断两个值是否为同一个值。

语法:

Object.is(value1, value2);

面试题:

Object.is()与比较操作符"===","=="的区别?

  • 使用双等号(==)进行相等判断时,如果两边的数据类型不一致,则会进行强制类型转换后再进行比较。

  • 使用三等号(===)进行相等判断时,,如果两边的类型不一致,不会进行强制类型转换,直接返回false。

  • 使用Object.js来进行相等判断时,一般情况下和三等号的判断相同,它处理了一些特殊情况,比如:+0和-0不相等,两个NaN值相等。



文章转载自Aid前端,如果涉嫌侵权,请发送邮件至:contact@modb.pro进行举报,并提供相关证据,一经查实,墨天轮将立刻删除相关内容。

评论