console.log(d2)//{ configurable: true, enumerable: false, value: 8675309, wriTable: false }b).Object.defineProperty() 该方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回这个对象。 参数: obj 需要添加新属性的对象 prop 要修改或创建的属性的名称 descrIPtor 将被定义或修改的描述符对象 let o = {};
let d = Object.getOwnPropertydescriptor(o, “foo”);
let o1 = { bar: 42 };
let d1 = Object.getOwnPropertyDescriptor(o1, “bar”);
let o2 = {};
Object.defineProperty(o2, “baz”, {
value: 8675309,
writable: false,
enumerable: false
});
let d2 = Object.getOwnPropertyDescriptor(o2, “baz”);
console.log(d)// undefined
console.log(d1)//{configurable: true, enumerable: true, value: 42, writable: true}
console.log(d2)//{ configurable: true, enumerable: false, value: 8675309, writable: false }c).Object.defineProperties() 这个方法可以同时定义多个属性。 参数: obj 需要添加新属性的对象 proPS 包含定义的属性描述符对象的对象 let o = {};
let descs = {
foo: { value: 1, writable: false },
bar: { value: 2, writable: true }
};
Object.defineProperties(o, descs);
console.log(o.foo); // 1
console.log(o.bar); // 2
console.log(Object.getOwnPropertyDescriptor(o, “foo”)); // {value: 1, writable: false, enumerable: true, configurable: true}
console.log(Object.getOwnPropertyDescriptor(o, “bar”)); // {value: 2, writable: true, enumerable: true, configurable: true}d).Object.getOwnPropertyDescriptors() 这个方法返回指定对象所有自身(非继承)属性的属性描述符的拷贝。 参数: obj 需要获取其所有属性描述符的对象 let o = {
foo: { value: 1, writable: false },
bar: { value: 2, writable: true }
};
let descs = Object.getOwnPropertyDescriptors(o);
console.log(descs); // {foo: {…}, bar: {…}}
console.log(Object.getOwnPropertyDescriptor(descs, “foo”)); // {value: 1, writable: false, enumerable: true, configurable: true}
console.log(Object.getOwnPropertyDescriptor(descs, “bar”)); // {value: 2, writable: true, enumerable: true, configurable: true}e).Object.create() 创建一个新对象,可以选择性地将现有值添加到新创建的对象中。 参数: proto 新创建对象的原型 propertiesObject 一个可选参数,如果提供,它应该是一个包含一组属性的字典。 let o = Object.create({x:1,y:2}, { getFoo: { value: function() { return this.x + this.y; } } });
console.log(o.getFoo()); // 3
摘要:JavaScript中的对象操作是编程的基础,包括创建、访问、修改和删除对象及其属性,以及对象的枚举和作为函数参数等操作。
在JavaScript中,对象操作是一个非常重要的概念,因为几乎所有的操作都与对象有关,本文将详细介绍如何对JavaScript对象进行各种操作,从对象的创建到属性的访问、修改、删除,以及对象的枚举和作为函数参数的使用等。
创建对象并添加属性
在JavaScript中,有多种方式可以创建对象,其中最常见的方法是使用对象字面量和构造函数,对象字面量是一种简洁的语法,可以直接定义一个对象的结构并初始化它的属性。
const obj = {
uname: 'dengke',
fn: function() {
console.log('ggg');
}
};
可以使用Object.create()
方法创建一个新对象,并将现有值添加到新创建的对象中,创建一个以另一个空对象为原型,并拥有一个属性p的对象:
var o = Object.create({}, { p: { value: 42 } });
有时可能需要浅拷贝一个已存在的对象,这时,Object.assign()
方法非常有用,它可以用于复制对象,也可以用于合并多个对象的属性到一个新的对象中。
var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { c: 3 };
var obj = Object.assign({}, o1, o2, o3); // { a: 1, b: 2, c: 3 }
需要注意的是,Object.assign()
不会拷贝对象的继承属性和不可枚举属性。
访问和修改对象属性
访问对象属性通常有两种方式:点表示法和方括号表示法,这两种方式都可以用来访问对象的属性,但方括号还可以用于访问属性名包含特殊字符或空格的情况。
const obj = {
info: 'wakaka',
inner: {
a: 10,
b: 20
}
};
console.log(obj.info); // wakaka
console.log(obj['inner']); // {a: 10, b: 20}
当试图访问一个不存在的属性时,为了避免错误,可以使用逻辑运算符||
来指定默认值,或使用可选链式操作符?.
来避免报错并返回undefined
。
console.log(obj.age || 18); // 18
let a = obj.name?.toUpperCase(); // undefined
修改对象属性的值也是常见的操作,可以直接通过赋值来完成。
obj.uname = 'new name';
使用Object.defineProperty()
可以更细粒度地控制属性的特性,如是否可写、可枚举等。
let o = {};
Object.defineProperty(o, 'baz', {
value: 8675309,
writable: false,
enumerable: false
});
删除对象属性
在某些情况下,可能需要从对象中删除某个属性,这可以通过delete
操作符来实现。
const o = {
p: 10,
m: 20
};
delete o.p;
console.log(o); // { m: 20 }
删除对象的属性后,再次访问该属性将返回undefined
。
对象作为函数参数
对象经常作为函数参数传递,这使得函数可以处理复杂的数据结构,可以创建一个接收对象作为参数的函数,然后访问或修改这些对象的属性。
const displayPerson = (person) => {
console.log(name: ${person.name || '无名氏'}
); console.log(age: ${person['age'] || 0}
); }; displayPerson({ name: 'dengke', age: 18 }); // name: dengke // age: 18
这种方式在处理用户输入、配置文件或其他结构化数据时尤为有用。
枚举对象的属性
有时需要遍历对象的所有属性,在JavaScript中,可以使用for...in
循环、Object.keys()
和Object.getOwnPropertyNames()
方法来枚举对象的属性。
const obj = {
foo: 'bar',
baz: 42
};
for (let prop in obj) {
console.log(prop); // 输出属性名
}
console.log(Object.keys(obj)); // ['foo', 'baz'],只返回可枚举的自有属性
console.log(Object.getOwnPropertyNames(obj)); // ['foo', 'baz'],返回所有自有属性,无论是否可枚举
for...in
循环可以枚举对象自身的和继承的属性,而Object.keys()
只返回对象自身的可枚举属性。Object.getOwnPropertyNames()
则返回对象自身的所有属性,包括不可枚举的。
JavaScript对象操作涵盖了从创建、访问、修改、删除到枚举对象属性的各种方面,掌握这些操作对于编写有效的JavaScript代码至关重要,每种操作都有其适用场景,合理使用可以大大提高代码的效率和可读性。