对象的基础知识

2023-09-19 23:47:57

1. 对象的声明

语法

const obj = {};

2. 对象属性

对象字面量

使用对象字面量来声明对象，属性之间用逗号分隔，例如：

const person = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

属性访问

可以通过点运算符(.)或方括号运算符([])来访问对象属性，例如：

console.log(person.name); // Jack
console.log(person['age']); // 20

3. 对象属性符

属性符

每个对象属性都有一个属性描述符，描述符包含属性的可枚举性、可写性、可配置性以及该属性的getter和setter函数。例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

Object.getOwnPropertyDescriptor(obj, 'name');

这个代码将返回一个描述符对象，其中包含name属性的可枚举性、可写性、可配置性以及getter和setter函数。

不可枚举属性

不可枚举属性不会出现在Object.keys()和JSON.stringify()的输出结果中。例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

Object.defineProperty(obj, 'secret', {
  enumerable: false,
  value: 'I am a secret'
});

console.log(Object.keys(obj)); // [ 'name', 'age', 'gender' ]
console.log(JSON.stringify(obj)); // { "name": "Jack", "age": 20, "gender": "male" }

不可写属性

不可写属性不能被重新赋值。例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

Object.defineProperty(obj, 'age', {
  writable: false,
  value: 20
});

obj.age = 21; // TypeError: Cannot assign to read only property 'age'

不可配置属性

不可配置属性不能被重新定义或删除。例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

Object.defineProperty(obj, 'name', {
  configurable: false,
  value: 'Jack'
});

delete obj.name; // TypeError: Cannot delete property 'name' from object

getter和setter函数

getter和setter函数可以用来控制对属性的访问。例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male',

  get fullName() {
    return this.name + ' ' + this.gender;
  },

  set age(value) {
    if (value < 0 || value > 120) {
      throw new Error('Invalid age');
    }

    this.age = value;
  }
};

console.log(obj.fullName); // Jack male
obj.age = 21;
console.log(obj.age); // 21

4. 判断属性

in运算符

in运算符可以用来判断一个属性是否存在于对象中，例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

console.log('name' in obj); // true
console.log('secret' in obj); // false

hasOwnProperty方法

hasOwnProperty方法可以用来判断一个属性是属于对象本身还是继承自父对象，例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

console.log(obj.hasOwnProperty('name')); // true
console.log(obj.hasOwnProperty('secret')); // false

5. 遍历属性

Object.keys方法

Object.keys方法可以用来获取对象所有可枚举属性的名称，例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

console.log(Object.keys(obj)); // [ 'name', 'age', 'gender' ]

Object.values方法

Object.values方法可以用来获取对象所有可枚举属性的值，例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

console.log(Object.values(obj)); // [ 'Jack', 20, 'male' ]

Object.entries方法

Object.entries方法可以用来获取对象所有可枚举属性的名称和值，例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

console.log(Object.entries(obj)); // [ [ 'name', 'Jack' ], [ 'age', 20 ], [ 'gender', 'male' ] ]

6. 查找属性

Object.getPropertyNames方法

Object.getPropertyNames方法可以用来获取对象的所有属性的名称，包括不可枚举属性，例如：

const obj = {
  name: 'Jack',
  age: 20,
  gender: 'male'
};

Object.defineProperty(obj, 'secret', {
  enumerable: false,
  value: 'I am a secret'
});

console.log(Object.getOwnPropertyNames(obj)); // [ 'name', 'age', 'gender', 'secret' ]