写在前面
掌握对象方法同样是前端开发中必会的技能，熟练掌握对象方法会快速处理好数据、快速解决开发工作中遇到的问题。这篇文章将整理所有的对象方法。
查看所有的对象方法
众所周知，对象的方法也都在自己的原型链上，所以可在浏览器中直接查看。
Object.prototype方法
dir(Object)
对象方法讲解
Object.assign()
方法将n个对象复制到目标对象（浅复制）。
参数
target：目标对象。
source：源对象。
返回值
返回目标对象。
- 示例
var target = {name: '小红', age: 22};
var source1 = {job: '前端开发'};
var source2 = {age: 24, say: {name: '小丽'}};
console.log(Object.assign(target, source1, source2)); // { name: '小红', age: 24, job: '前端开发', say: { name: '小丽' } }
// 如果属性相同，后面的会覆盖前面的属性
Object.getOwnPropertyDescriptor()
获取对象上一个自有属性的属性描述。
参数
obj：需要查找的对象。
prop：目标对象的某个自有属性。
返回值
返回对象上自有属性的属性描述，如果没有该属性，则返回undefined。
- 示例
var person = {name: '小红'};
var descriptor1 = Object.getOwnPropertyDescriptor(person, "name");
var descriptor2 = Object.getOwnPropertyDescriptor(person, "age");
console.log(descriptor1); // { value: '小红', writable: true, enumerable: true, configurable: true }
console.log(descriptor2); // undefined
Object.getOwnPropertyDescriptors()
获取对象上所有属性的属性描述。
参数
- obj：要获取属性描述的对象
返回值
返回对象的所有属性的描述，如果没有属性，则返回空对象。
- 示例
var person = {name: '小红', age: 11};
var person1 = {};
console.log(Object.getOwnPropertyDescriptors(person));
// {
name: {
value: '小红',
writable: true,
enumerable: true,
configurable: true
},
age: { value: 11,
writable: true,
enumerable: true,
configurable: true
}
}
console.log(Object.getOwnPropertyDescriptors(person1)); // {}
Object.getOwnPropertyNames()
获取一个由指定对象的所有自身属性的属性名（包括不可枚举属性但不包括Symbol值作为名称的属性）组成的数组。
参数
- obj：要获取属性名的对象。
返回值
在给定对象上找到的自身属性对应的字符串数组。
- 示例
var person = {name: '小红', age: 11};
console.log(Object.getOwnPropertyNames(person)); // ['name', 'age']
consoel.log(Object.getOwnPropertyNames({})); // []
Object.getOwnPropertySymbols()
获取一个给定对象自身的所有Symbol属性。
参数
- obj：任何一个对象。
返回值
返回所有Symbol属性的数组。
- 示例
var person = {name: '小红'};
var a = Symbol("a");
person[a] = 11;
console.log(Object.getOwnPropertySymbols(person)); // [Symbol(a)]
Object.is()
判断两个值是否为相同的值。
参数
value1：第一个需要比较的值。
value2：第二个需要比较的值。
返回值
如果两个值相同，返回true；如果不同，则返回false。
- 示例
console.log(Object.is(null, null)); // true
console.log(Object.is(undefined, undefined)); // true
console.log(Object.is(1, 1)); // true
console.log(Object.is(1, "1")); // false
console.log(Object.is("a", "a")); // true
console.log(Object.is(true, true)); // true
console.log(Object.is(0, -0)); // false
Object.preventExtensions()
让一个对象变的不可扩展，也就是永远不能再添加新的属性。
参数
- obj: 一个对象。
返回值
已经变为不可拓展的对象。
- 示例
var person = {name: '小红'};
var person1 = Object.preventExtensions(person);
person.age = 11; // 此时对象已不可拓展，所以添加属性会不成功
console.log(person, person1); // {name: '小红'} {name: '小红'}
Object.isExtensible()
判断一个对象是否可以拓展
参数
- obj：任意一个对象。
返回值
返回Boolean，如果可拓展，返回true，否则为false。
- 示例
var person = {name: '小红'};
console.log(Object.isExtensible(person)); // true
Object.preventExtensions(person);
console.log(Object.isExtensible(person)); // false
Object.seal()
使对象封印，对象封印也可以创建一个不可扩展的对象，被封印的对象不可扩展并且所有属性都不可配置。对象封印使对象不能添加属性，也不能删除、改变类型（只能读写）
参数
- obj：要封印的对象。
返回值
返回被封印的对象。
- 示例
var person = {
name: '熊大'
}
Object.seal(person);
person.age = 11;
person.name = '熊二';
console.log(person.name); // 熊二
delete person.name;
console.log(person); // {name: '熊二'}
Object.isSealed()
判断一个对象是否被封印
参数
- obj：任意一个对象。
返回值
返回Boolean，如果被封印，返回true，否则为false。
- 示例
var person = {
name: '熊大'
}
console.log(Object.isSealed(person)); // false
Object.seal(person);
console.log(Object.isSealed(person)); // true
Object.freeze()
使对象冻结，对象冻结也是扩展对象的一种方法，一个被冻结的对象只为可读，被冻结的对象无法解冻。
参数
- obj：任意一个对象。
返回值
返回被冻结的对象
- 示例
var person = {
name: '熊大'
}
Object.freeze(person);
person.age = 11;
person.name = '熊二';
delete person.name;
console.log(person); // {name: '熊大'}
Object.isFrozen()
判断一个对象是否被冻结
参数
- obj：任意一个对象。
返回值
返回Boolean，如果被冻结，返回true，否则为false。
- 示例
var person = {
name: '熊大'
}
console.log(Object.isFrozen(person)); // false
Object.freeze(person);
console.log(Object.isFrozen(person)); // true
Object.create()
创建一个新对象。
参数
proto：创建对象的原型对象。
propertiesObject(可选)：为新创建的对象设置属性描述。
返回值
返回带有指定原型对象和属性的新对象。
- 示例
var person = Object.create(Object.prototype);
console.log(person); // 输出结果为图1
var person1 = Object.create(Object.prototype, {
name: {
configurable: true,
enumerable: true,
value: '小红',
writable: true,
}
})
console.log(person1); // 输出结果为图2
Object.defineProperty()
直接在一个对象上定义一个新属性，或者修改一个对象的现有属性。
参数
obj：要定义属性的对象。
prop：要定义或修改的属性名称。
descriptor：要定义或修改的属性描述。
返回值
返回新对象。
- 示例
var person = {};
var person1 = Object.defineProperty(person, "name", {
configurable: true,
enumerable: true,
value: '小红',
writable: true,
})
console.log(person1); // {name: '小红'}
Object.defineProperties()
在一个对象上定义新的属性或修改现有属性。
参数
obj：要定义属性的对象。
props：要定义其可枚举属性或修改的属性描述符的对象。
configurable
enumerable
value
writable
get
set
返回值
返回新对象。
- 示例
var person = {};
var person1 = Object.defineProperties(person, {
name: {
configurable: true,
enumerable: true,
value: '小红',
writable: true,
},
age: {
configurable: true,
enumerable: true,
value: 11,
writable: true,
}
})
console.log(person, person1); // { name: '小红', age: 11 } { name: '小红', age: 11 }
Object.setPrototypeOf()
设置一个指定的对象的原型到另一个对象或null。
参数
obj：要设置其原型的对象。
prototype：该对象的新原型。
示例
var person = Object.create({}, {name: {value: '小红'}});
var person1 = {};
Object.setPrototypeOf(person1, person);
console.log(person1);
Object.getPrototypeOf()
获取指定对象的原型。
参数
- obj：要返回原型的对象。
返回值
给定对象的原型。如果没有，返回null。
- 示例
var person = Object.create(null);
var person1 = {};
console.log(Object.getPrototypeOf(person));
console.log(Object.getPrototypeOf(person1));
Object.keys()
获取对象的自身可枚举属性。
参数
- obj：要获取自身可枚举属性的对象。
返回值
返回一个对象的自身可枚举属性数组。
- 示例
var person = Object.defineProperties({}, {
name: {
value: '小红',
enumerable: true
},
age: {
value: 11
}
});
var person1 = {name: '小丽', age: 11};
console.log(Object.keys(person)); // ["name"]
console.log(Object.keys(person1)); // ["name", "age"]
Object.entries()
获取一个给定对象自身可枚举属性的键值对。
参数
- obj：要获取自身可枚举属性键值对的对象。
返回值
返回一个对象的自身可枚举属性键值对的数组。
- 示例
var person = Object.defineProperties({}, {
name: {
value: '小红',
enumerable: true
},
age: {
value: 11
}
});
var person1 = {name: '小丽', age: 11};
console.log(Object.entries(person)); // [["name", "小红"]]
console.log(Object.entries(person1)); // [["name", "小丽"] ["age", 11]]
Object.fromEntries()
该方法将键值对列表转换为一个对象。
参数
- iterable：可迭代对象
返回值
返回一个由该迭代对象条目提供对应属性的新对象。
- 示例
var person = {name: '小丽', age: 11};
var entries = Object.entries(person);
console.log(Object.fromEntries(entries)); // {name: "小丽", age: 11}
Object.values()
获取一个给定对象自身的所有可枚举属性值。
参数
- obj：要获取的对象
返回值
一个包含对象自身的所有可枚举属性值的数组。
- 示例
var person = {name: '小红', age: 11};
console.log(Object.values(person)); // ["小红", 11]
Object.hasOwnProperty()
判断一个对象自身属性中是否具有指定的属性。
参数
- prop：要判断的属性。
返回值
返回Boolean值，如果包含，返回true，如果不包含，返回false。
- 示例
var person = {name: '小红'};
console.log(person.hasOwnProperty("name")); // true
console.log(person.hasOwnProperty("age")); // false
Object.isPrototypeOf()
该方法用于测试一个对象是否存在于另一个对象的原型链上。
参数
- obj：要检测的对象。
返回值
返回Boolean值，如果包含，返回true，如果不包含，返回false。如果被检测对象是null或undefined，则会报错（TypeError）。
- 示例
var person = {};
console.log(person.isPrototypeOf(Object)); // false
var person1 = null;
console.log(person1.isPrototypeOf(Object));
Object.propertyIsEnumerable()
判断指定属性是否可枚举。
参数
- prop：要检测的属性名。
返回值
返回Boolean值，如果可枚举，返回true，如果不，返回false。
- 示例
var person = Object.defineProperties({}, {
name: {
value: '小红',
enumerable: true
},
age: {
value: 11
}
});
console.log(person.propertyIsEnumerable("name")); // true
console.log(person.propertyIsEnumerable("age")); // false
Object.toString()
将对象转换为字符串格式。
- 返回值
返回对象的字符串格式。
- 示例
var person = {name: '小红'};
console.log(person.toString()); // "[object Object]"
Object.valueOf()
获取一个对象的原始值。
- 返回值
返回对象的字符串格式。
| 对象 | 返回值 |
|---|---|
| Object | 对象本身 |
| Array | 数组本身 |
| Boolean | 布尔值 |
| Date | 返回至1970.1.1 00:00:00的毫秒数 |
| Function | 函数本身 |
| Number | 数字值 |
| String | 字符串值 |
| Math | 无valueOf方法 |
| Error | 无 valueOf 方法 |
示例
var person = {name: '小红'};
var bool = true;
var date = new Date();
var func = function() {
console.log(1);
}
var str = '前端开发';
var num = 1;
console.log(person.valueOf());
console.log(bool.valueOf());
console.log(date.valueOf());
console.log(func.valueOf());
console.log(str.valueOf());
console.log(num.valueOf());
Object.toLocaleString()
返回一个对象的字符串表示，在特定语言环境中使用。
- 返回值
调用Object.toString()的结果，返回对象的字符串格式。
- 示例
var person = {name: '小红'};
var num = 78930207;
....
console.log(person.toLocaleString()); // "[object Object]"
console.log(num.toLocaleString()); // 78,930,207
....
写在最后
上一篇文章，我们总结了数组的所有方法，需要查看的小伙伴可以移步这里。传送门：【殷实基础系列】请查收，所有的数组方法都在这里了…。
到这里，对象方法已经整理完毕，希望这些对大家能有所帮助~有哪里写错的地方，也请大家指点出来，我们共同学习，共同进步~
最后，分享一下我的公众号「web前端日记」，小伙伴们可以关注一波~
