JavaScript 对象方法全面解析
JavaScript 是一种基于对象的编程语言,对象是 JavaScript 中最基本的数据结构之一。对象可以包含属性和方法,方法是对象的行为。本文将全面介绍 JavaScript 对象的所有常用方法,帮助你更好地理解和使用 JavaScript 对象。
文章目录
- 1. 对象的基本方法
- 1.1 `Object.assign()`
- 1.2 `Object.create()`
- 1.3 `Object.defineProperty()`
- 1.4 `Object.defineProperties()`
- 1.5 `Object.getOwnPropertyDescriptor()`
- 1.6 `Object.getOwnPropertyNames()`
- 1.7 `Object.getPrototypeOf()`
- 1.8 `Object.setPrototypeOf()`
- 1.9 `Object.is()`
- 1.10 `Object.keys()`
- 1.11 `Object.values()`
- 1.12 `Object.entries()`
- 1.13 `Object.freeze()`
- 1.14 `Object.seal()`
- 1.15 `Object.isFrozen()`
- 1.16 `Object.isSealed()`
- 1.17 `Object.preventExtensions()`
- 1.18 `Object.isExtensible()`
- 2. 对象的原型方法
- 2.1 `hasOwnProperty()`
- 2.2 `isPrototypeOf()`
- 2.3 `propertyIsEnumerable()`
- 2.4 `toLocaleString()`
- 2.5 `toString()`
- 2.6 `valueOf()`
- 3. 对象的迭代方法
- 3.1 `Object.keys()`
- 3.2 `Object.values()`
- 3.3 `Object.entries()`
- 4. 对象的扩展方法
- 4.1 `Object.fromEntries()`
- 4.2 `Object.groupBy()`
- 5. 总结
1. 对象的基本方法
1.1 Object.assign()
Object.assign()
方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象,并返回目标对象。
const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
const returnedTarget = Object.assign(target, source);
console.log(target); // { a: 1, b: 4, c: 5 }
console.log(returnedTarget); // { a: 1, b: 4, c: 5 }
1.2 Object.create()
Object.create()
方法创建一个新对象,使用现有的对象作为新对象的原型。
const person = {
isHuman: false,
printIntroduction: function() {
console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
}
};
const me = Object.create(person);
me.name = 'Matthew';
me.isHuman = true;
me.printIntroduction(); // My name is Matthew. Am I human? true
1.3 Object.defineProperty()
Object.defineProperty()
方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。
const obj = {};
Object.defineProperty(obj, 'property1', {
value: 42,
writable: false
});
obj.property1 = 77; // Throws an error in strict mode
console.log(obj.property1); // 42
1.4 Object.defineProperties()
Object.defineProperties()
方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象。
const obj = {};
Object.defineProperties(obj, {
'property1': {
value: true,
writable: true
},
'property2': {
value: 'Hello',
writable: false
}
});
console.log(obj.property1); // true
console.log(obj.property2); // Hello
1.5 Object.getOwnPropertyDescriptor()
Object.getOwnPropertyDescriptor()
方法返回指定对象上一个自有属性对应的属性描述符。
const obj = {
property1: 42
};
const descriptor = Object.getOwnPropertyDescriptor(obj, 'property1');
console.log(descriptor.value); // 42
console.log(descriptor.writable); // true
1.6 Object.getOwnPropertyNames()
Object.getOwnPropertyNames()
方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括 Symbol 值作为名称的属性)组成的数组。
const obj = {
a: 1,
b: 2,
c: 3
};
console.log(Object.getOwnPropertyNames(obj)); // ['a', 'b', 'c']
1.7 Object.getPrototypeOf()
Object.getPrototypeOf()
方法返回指定对象的原型(内部 [[Prototype]]
属性的值)。
const prototype1 = {};
const object1 = Object.create(prototype1);
console.log(Object.getPrototypeOf(object1) === prototype1); // true
1.8 Object.setPrototypeOf()
Object.setPrototypeOf()
方法设置一个指定的对象的原型(即内部 [[Prototype]]
属性)到另一个对象或 null
。
const obj = {};
const prototype = {};
Object.setPrototypeOf(obj, prototype);
console.log(Object.getPrototypeOf(obj) === prototype); // true
1.9 Object.is()
Object.is()
方法判断两个值是否为同一个值。
console.log(Object.is('foo', 'foo')); // true
console.log(Object.is({}, {})); // false
1.10 Object.keys()
Object.keys()
方法返回一个由一个给定对象的自身可枚举属性组成的数组。
const obj = {
a: 1,
b: 2,
c: 3
};
console.log(Object.keys(obj)); // ['a', 'b', 'c']
1.11 Object.values()
Object.values()
方法返回一个给定对象自身的所有可枚举属性值的数组。
const obj = {
a: 1,
b: 2,
c: 3
};
console.log(Object.values(obj)); // [1, 2, 3]
1.12 Object.entries()
Object.entries()
方法返回一个给定对象自身可枚举属性的键值对数组。
const obj = {
a: 1,
b: 2,
c: 3
};
console.log(Object.entries(obj)); // [['a', 1], ['b', 2], ['c', 3]]
1.13 Object.freeze()
Object.freeze()
方法可以冻结一个对象。一个被冻结的对象再也不能被修改。
const obj = {
prop: 42
};
Object.freeze(obj);
obj.prop = 33; // Throws an error in strict mode
console.log(obj.prop); // 42
1.14 Object.seal()
Object.seal()
方法封闭一个对象,阻止添加新属性并将所有现有属性标记为不可配置。当前属性的值只要原来是可写的就可以改变。
const obj = {
prop: 42
};
Object.seal(obj);
obj.prop = 33;
console.log(obj.prop); // 33
delete obj.prop; // Cannot delete when sealed
console.log(obj.prop); // 33
1.15 Object.isFrozen()
Object.isFrozen()
方法判断一个对象是否被冻结。
const obj = {
prop: 42
};
Object.freeze(obj);
console.log(Object.isFrozen(obj)); // true
1.16 Object.isSealed()
Object.isSealed()
方法判断一个对象是否被密封。
const obj = {
prop: 42
};
Object.seal(obj);
console.log(Object.isSealed(obj)); // true
1.17 Object.preventExtensions()
Object.preventExtensions()
方法让一个对象变的不可扩展,也就是永远不能再添加新的属性。
const obj = {};
Object.preventExtensions(obj);
obj.newProp = 'new'; // Throws an error in strict mode
console.log(obj.newProp); // undefined
1.18 Object.isExtensible()
Object.isExtensible()
方法判断一个对象是否是可扩展的(是否可以在它上面添加新的属性)。
const obj = {};
console.log(Object.isExtensible(obj)); // true
Object.preventExtensions(obj);
console.log(Object.isExtensible(obj)); // false
2. 对象的原型方法
2.1 hasOwnProperty()
hasOwnProperty()
方法返回一个布尔值,指示对象自身属性中是否具有指定的属性。
const obj = {
prop: 42
};
console.log(obj.hasOwnProperty('prop')); // true
console.log(obj.hasOwnProperty('toString')); // false
2.2 isPrototypeOf()
isPrototypeOf()
方法用于测试一个对象是否存在于另一个对象的原型链上。
function Foo() {}
function Bar() {}
Bar.prototype = Object.create(Foo.prototype);
const bar = new Bar();
console.log(Foo.prototype.isPrototypeOf(bar)); // true
console.log(Bar.prototype.isPrototypeOf(bar)); // true
2.3 propertyIsEnumerable()
propertyIsEnumerable()
方法返回一个布尔值,表示指定的属性是否可枚举。
const obj = {
prop: 42
};
console.log(obj.propertyIsEnumerable('prop')); // true
console.log(obj.propertyIsEnumerable('toString')); // false
2.4 toLocaleString()
toLocaleString()
方法返回一个该对象的字符串表示。此方法旨在派生对象为了特定语言环境的目的而重载使用。
const date = new Date();
console.log(date.toLocaleString()); // "7/25/2023, 2:30:00 PM"
2.5 toString()
toString()
方法返回一个表示该对象的字符串。
const obj = {};
console.log(obj.toString()); // "[object Object]"
2.6 valueOf()
valueOf()
方法返回指定对象的原始值。
const obj = {
value: 42,
valueOf: function() {
return this.value;
}
};
console.log(obj.valueOf()); // 42
3. 对象的迭代方法
3.1 Object.keys()
Object.keys()
方法返回一个由一个给定对象的自身可枚举属性组成的数组。
const obj = {
a: 1,
b: 2,
c: 3
};
console.log(Object.keys(obj)); // ['a', 'b', 'c']
3.2 Object.values()
Object.values()
方法返回一个给定对象自身的所有可枚举属性值的数组。
const obj = {
a: 1,
b: 2,
c: 3
};
console.log(Object.values(obj)); // [1, 2, 3]
3.3 Object.entries()
Object.entries()
方法返回一个给定对象自身可枚举属性的键值对数组。
const obj = {
a: 1,
b: 2,
c: 3
};
console.log(Object.entries(obj)); // [['a', 1], ['b', 2], ['c', 3]]
4. 对象的扩展方法
4.1 Object.fromEntries()
Object.fromEntries()
方法把键值对列表转换为一个对象。
const entries = [
['a', 1],
['b', 2],
['c', 3]
];
const obj = Object.fromEntries(entries);
console.log(obj); // { a: 1, b: 2, c: 3 }
4.2 Object.groupBy()
Object.groupBy()
方法根据提供的回调函数对对象的属性进行分组。
const obj = {
a: 1,
b: 2,
c: 3
};
const grouped = Object.groupBy(obj, (value, key) => {
return value % 2 === 0 ? 'even' : 'odd';
});
console.log(grouped); // { odd: [1, 3], even: [2] }
5. 总结
JavaScript 对象提供了丰富的方法来操作和管理对象的属性和行为。通过掌握这些方法,你可以更高效地处理对象数据,编写出更加健壮和可维护的代码。希望本文对你理解和使用 JavaScript 对象方法有所帮助。
如果你有任何问题或建议,欢迎在评论区留言讨论!
参考文献:
- MDN Web Docs: Object
- JavaScript: The Definitive Guide
版权声明: 本文为原创文章,版权归作者所有。转载请注明出处!