返回

前端开发必备，JS对象及增删改查快速上手

前端

观点：JS对象及其CURD应用备忘录




1. JavaScript对象简介

JavaScript对象是一种数据结构，它可以存储一组相关的属性。每个属性由一个名称和一个值组成，名称用于标识属性，值则存储实际的数据。对象可以嵌套，即对象的值也可以是另一个对象。

2. JavaScript对象属性

JavaScript对象属性的名称可以是字符串或符号。如果属性名不加方括号[]，则会自动转换为字符串。如果属性名加了方括号[]，则会当做变量求值。值得注意的是，JavaScript中每一个对象都有一个隐藏属性，这个隐藏属性储存着其共有属性组成的对象的地址，这个共有属性组成的对象叫做原型，也就是说，隐藏属性储存着原型的地址。

3. JavaScript对象CURD

增删改查（CRUD）是数据库操作中最基本的操作，JavaScript对象也提供了相应的增删改查方法。

3.1 创建对象

可以使用new Object()来创建一个新的对象，也可以使用字面量语法来创建对象。字面量语法是一种更简洁的方式来创建对象，如下所示：

const person = {
  name: 'John Doe',
  age: 30,
  occupation: 'Software Engineer'
};

3.2 读取对象属性

可以使用点(.)运算符或方括号[]运算符来读取对象属性。点(.)运算符用于读取直接属于对象的属性，而方括号[]运算符用于读取原型链上的属性。

console.log(person.name); // John Doe
console.log(person['age']); // 30

3.3 添加对象属性

可以使用点(.)运算符或方括号[]运算符来添加对象属性。与读取属性类似，点(.)运算符用于添加直接属于对象的属性，而方括号[]运算符用于添加原型链上的属性。

person.email = 'john.doe@example.com';
person['phone'] = '0123456789';

3.4 更新对象属性

可以使用点(.)运算符或方括号[]运算符来更新对象属性。

person.name = 'Jane Doe';
person['age'] = 31;

3.5 删除对象属性

可以使用delete运算符来删除对象属性。

delete person.email;
delete person['phone'];

4. JavaScript对象原型

原型是JavaScript对象的一个重要概念。原型是所有对象共享的属性和方法的集合。原型是通过Object.prototype属性访问的。

console.log(Object.prototype);

原型是一个对象，它本身也有属性和方法。例如，原型有一个toString()方法，可以将对象转换为字符串。

console.log(person.toString());

5. 结论

JavaScript对象是JavaScript中一种重要的数据结构，它可以存储一组相关的属性。JavaScript对象提供了增删改查（CRUD）方法，可以轻松地操作对象中的数据。JavaScript对象还具有原型机制，原型是所有对象共享的属性和方法的集合。理解JavaScript对象及其CURD应用，是前端开发人员必备的基础知识。