📜  js 对象一些 - Javascript (1)

📅  最后修改于: 2023-12-03 15:32:23.125000             🧑  作者: Mango

JS 对象一些

在 Javascript 中,对象是一种非常重要和常用的数据类型。对象是键-值对的集合,其中的键是字符串类型,值可以是任何类型,包括对象本身。本文将介绍 JS 对象的一些基本操作和高级用法。

创建对象
对象字面量

对象字面量是一种创建对象的简单方式,它通过一组花括号 {} 来描述对象的键值对,多个键值对之间用逗号分隔。

const obj = {
  name: 'Alice',
  age: 18,
  sayHi() {
    console.log(`Hi, my name is ${this.name}.`);
  }
};
构造函数

构造函数是一种通过函数来创建对象的方式,在函数体内通过 this 关键字引用新创建的对象。通过 new 关键字调用构造函数来创建对象。

function Person(name, age) {
  this.name = name;
  this.age = age;
  this.sayHi = function() {
    console.log(`Hi, my name is ${this.name}.`);
  };
}

const alice = new Person('Alice', 18);
Object.create()

Object.create() 方法是一种基于现有对象创建新对象的方式,它的第一个参数指定新对象的原型对象。

const person = {
  sayHi() {
    console.log(`Hi, my name is ${this.name}.`);
  }
};

const alice = Object.create(person, {
  name: {
    value: 'Alice',
    writable: true,
    enumerable: true
  },
  age: {
    value: 18,
    writable: true,
    enumerable: true
  }
});
访问对象属性
点表示法

可使用点符号 . 来访问对象属性。

const obj = {
  name: 'Alice',
  age: 18
};

console.log(obj.name); // 输出 "Alice"
方括号表示法

也可使用方括号 [] 来访问对象属性,其中方括号内是字符串类型的属性名。

const obj = {
  name: 'Alice',
  age: 18
};

console.log(obj['name']); // 输出 "Alice"

方括号内也可以是变量,动态访问对象属性。

const obj = {
  name: 'Alice',
  age: 18
};

const prop = 'name';
console.log(obj[prop]); // 输出 "Alice"
修改对象属性

对象的属性可以通过赋值来修改。

const obj = {
  name: 'Alice',
  age: 18
};

obj.age = 19;
console.log(obj.age); // 输出 19
删除对象属性

删除对象属性可以使用 delete 关键字。

const obj = {
  name: 'Alice',
  age: 18
};

delete obj.age;
console.log(obj.age); // 输出 undefined
遍历对象属性

遍历对象属性可以使用 for...in 循环,循环中的变量为属性名。

const obj = {
  name: 'Alice',
  age: 18
};

for (let prop in obj) {
  console.log(prop + ':' + obj[prop]);
}
访问器属性

访问器属性是指由 getter 和 setter 方法组成的属性,用于在对象属性的读取和设置时进行额外的操作。

const obj = {
  _name: '',
  get name() {
    return this._name;
  },
  set name(value) {
    this._name = value;
  }
};

obj.name = 'Alice';
console.log(obj.name); // 输出 "Alice"
合并对象

可以使用 Object.assign() 方法合并对象,将后面的对象的属性复制到第一个对象中,若属性名相同则后者覆盖前者。

const obj1 = {
  name: 'Alice',
  age: 18
};

const obj2 = {
  age: 19,
  gender: 'female'
};

Object.assign(obj1, obj2);
console.log(obj1); // 输出 { name: 'Alice', age: 19, gender: 'female' }
Object.keys()

Object.keys() 方法返回一个数组,其中包含对象自身所有可枚举属性的属性名。

const obj = {
  name: 'Alice',
  age: 18
};

console.log(Object.keys(obj)); // 输出 ["name", "age"]
Object.values()

Object.values() 方法返回一个数组,其中包含对象自身所有可枚举属性的属性值。

const obj = {
  name: 'Alice',
  age: 18
};

console.log(Object.values(obj)); // 输出 ["Alice", 18]
Object.entries()

Object.entries() 方法返回一个数组,其中包含对象自身所有可枚举属性的属性名和属性值组成的数组。

const obj = {
  name: 'Alice',
  age: 18
};

console.log(Object.entries(obj)); // 输出 [["name", "Alice"], ["age", 18]]
总结

JS 对象是一种非常重要和常用的数据类型,可以通过对象字面量、构造函数、Object.create() 等方式来创建对象。访问和修改对象属性可以使用点表示法和方括号表示法,也可以使用 getter 和 setter 来定义访问器属性。遍历对象属性可以使用 for...in 循环,合并对象可以使用 Object.assign() 方法。Object.keys()、Object.values() 和 Object.entries() 方法分别用于获取对象的属性名、属性值和属性名和属性值组成的数组。