【JavaScript】创建和访问对象

文章目录

    • 1. 对象的创建
      • 字面量表示法
      • 构造函数
      • Object.create()
    • 2. 对象的访问
      • 点表示法
      • 方括号表示法
      • this 关键字
    • 3. 对象的遍历
      • for...in 循环
      • Object.keys()
      • Object.values()
    • 4. 总结

在 JavaScript 中,**对象是一种复合值,可以包含多个属性和方法。**本篇博客将介绍 JavaScript 中对象的创建和访问,以帮助你更好地理解和运用这些概念。

1. 对象的创建

字面量表示法

let person = {
  name: "Cheney",
  age: 11,
  address: {
    city: "大连市",
    province: "辽宁省"
  },
  sayHello: function() {
    console.log("Hello, I'm " + this.name);
  }
};

在上述例子中,使用字面量表示法创建了一个名为 person 的对象,包含了 nameageaddresssayHello 等属性。

构造函数

function Car(brand, model) {
  this.brand = brand;
  this.model = model;
  this.start = function() {
    console.log("车的品牌是: " + this.brand + " " + this.model);
  };
}

let myCar = new Car("奔驰", "迈巴赫");

在上述例子中,通过构造函数 Car 创建了一个名为 myCar 的对象,构造函数定义了对象的结构和方法。

Object.create()

let animal = {
  sound: "undefined",
  makeSound: function() {
    console.log(this.sound);
  }
};

let cat = Object.create(animal);
cat.sound = "喵喵喵";
cat.makeSound(); // 输出:喵喵喵

在上述例子中,使用 Object.create() 方法创建了一个名为 cat 的对象,继承了 animal 对象的属性和方法。

2. 对象的访问

点表示法

console.log(person.name); // 输出:Cheney

在上述例子中,使用点表示法访问了 person 对象的 name 属性。

方括号表示法

console.log(person["age"]); // 输出:11

在上述例子中,使用方括号表示法同样可以访问对象的属性,这对于包含特殊字符或动态属性名的情况非常有用。

this 关键字

在对象的方法中,this 关键字引用当前对象。

person.sayHello(); // 输出:Hello, I'm Cheney

在上述例子中,sayHello 方法中的 this 指向 person 对象本身。

3. 对象的遍历

for…in 循环

for (let key in person) {
  console.log(key + ": " + person[key]);
}

在上述例子中,使用 for...in 循环遍历了 person 对象的所有属性,并输出属性名和对应的值。

Object.keys()

let keys = Object.keys(person);
console.log(keys); // 输出:["name", "age", "address", "sayHello"]

在上述例子中,使用 Object.keys() 方法获取了 person 对象的所有属性名。

Object.values()

let values = Object.values(person);
console.log(values); // 输出:["Cheney", 11, {city: "大连市", province: "辽宁省"}]

在上述例子中,使用 Object.values() 方法获取了 person 对象的所有属性值。

4. 总结

对象是 JavaScript 中非常重要的数据结构,可以用于组织和存储复杂的数据。通过字面量表示法、构造函数和 Object.create() 方法,你可以灵活地创建对象。对象的访问可以使用点表示法、方括号表示法和 this 关键字,根据不同的需求选择不同的方式。同时,通过 for...in 循环、Object.keys()Object.values() 方法,你能够方便地遍历对象的属性。希望通过本篇博客,你对 JavaScript 中对象的创建和访问有了更深入的理解。

你可能感兴趣的:(JavaScript,javascript,开发语言,前端)