今天看代码的时候,发现在js中对对象的一些基本使用还有欠缺,来补补基础写下这篇笔记。
在 JavaScript 中,对象是一种无序的数据集合,它由键值对组成。下面是在js中对对象常见用法和方法的介绍。
1、对象的创建
1)对象字面量
使用大括号 { } 来创建一个对象,键值对之间用逗号隔开。
const person = {
name: 'John',
age: 18,
gender: '男'
};
2)Object 构造函数
使用 new Object( ) 来创建一个空对象,然后可以动态添加属性。
const person = new Object();
person.name = 'John';
person.age = 18;
person.gender = '男';
3)Object.create( ) 方法
用于创建一个新对象,该对象继承自指定的原型对象。
const sayHello = {
name: 'John',
say: function() {
console.log(`大家好,我叫 ${this.name}`);
},
};
const zs = Object.create(sayHello);
zs.name = '张三';
zs.say(); // 输出 大家好,我叫张三
2、对象的属性的访问和修改
1)点号表示法
使用点号 . 来访问和修改对象的属性。
const person = {
name: 'John',
age: 18,
};
console.log(person.name); // 输出 John
console.log(person.age); // 输出 18
2)方括号表示法
使用方括号 [ ] 来访问和修改对象的属性,方括号内可以是变量或字符串。
const person = {
name: 'John',
age: 18,
};
const key = 'name';
console.log(person[key]); // 输出 John
person[age] = 20;
console.log(person[age]); // 输出 20
3、对象属性的删除
使用 delete 关键字来删除对象的属性。
const person = {
name: 'John',
age: 18,
};
delete person.age;
console.log(person); // 输出 {name: 'John'}
4、对象方法
对象的属性值可以是函数,这样的属性称为方法。
const person = {
name: 'John',
age: 18,
greet: function() {
console.log(`大家好,我叫 ${this.name},刚满${this.age}岁`);
},
};
person.greet(); // 输出 大家好,我叫John,刚满18岁
5、对象的遍历
1)for ... in 循环
用于遍历对象的可枚举属性。
const person = {
name: 'John',
age: 18,
greet: function() {
console.log(`大家好,我叫 ${this.name},刚满${this.age}岁`);
},
};
for(const key in person){
console.log(key);
};
// 输出
// John
// 18
2)Object.keys()、Object.values()和Object.entries()
Object.keys():返回一个由对象的可枚举属性名组成的数组。
Object.values():返回一个由对象的可枚举属性值组成的数组。
Object.entries():返回一个由对象的可枚举属性的键值对数组组成的数组。
const person = {
name: 'John',
age: 18,
greet: function() {
console.log(`大家好,我叫 ${this.name},刚满${this.age}岁`);
},
};
const keys = Object.keys(person);
console.log(keys); // 输出 ['name', 'age', 'greet']
const values = Object.values(person);
console.log(keys); // 输出 ['John', 18, f( )]
const entries= Object.entries(person);
console.log(entries); // 输出 [ [John, 'John'], [age, 18], [greet, f( )] ]
6、对象的合并
1)Object.assign() 方法
用于将一个或多个源对象的所有可枚举属性复制到目标对象。
const target = {a: 1};
const source= {b: 2};
const merged = Object.assign(target, source);
console.log(merged); // 输出 { a: 1, b: 2}
2)扩展运算符 ...
可以使用扩展运算符来合并对象。
const obj1= {a: 1};
const obj2= {b: 2};
const mergedObj = {...obj1, ...obj2};
console.log(mergedObj); // 输出 {a: 1,b: 2}
7、对象的原型
每个对象都有一个原型,可以使用 Object.getPrototypeOf() 方法获取对象的原型,使用 Object.setPrototypeOf() 方法设置对象的原型。
const prototypeObj = {
sayHello: function() {console.log('Hello!');
}
};
const newObj = {};
newObj.setPrototypeOf(newObj,prototypeObj);
newObj.sayHello(); // 输出 Hello!
const prototype = Object.getPrototypeOf(newObj);
console.log(prototype); // 输出 { sayHello: [ Function: sayHello ] }
好记性不如烂笔头,在学习的路上留下点痕迹。希望能给大家带来帮助,也期待你的点赞和讨论。
若有不足之处,还请斧正。