js obj对象|极客笔记

js obj对象

1. 介绍

JavaScript是一种强大的脚本编程语言，它的核心是对象。对象在JavaScript中扮演着非常重要的角色，可以说，几乎一切都是对象。在本文中，我们将详细讨论JavaScript中的对象。

2. 对象的定义

在JavaScript中，对象是一种复合数据类型，可以包含多个属性和方法。对象是通过花括号 {} 来定义的，其中属性和方法以键值对的形式存储。

以下是一个简单的JavaScript对象的示例：

let person = {
  name: "John",
  age: 30,
  gender: "male",
  sayHello: function() {
    console.log("Hello!");
  }
};

在上面的示例中，person 对象有三个属性 name、age 和 gender，以及一个方法 sayHello。我们可以通过点标记法或方括号来访问对象的属性和方法。

console.log(person.name);       // 输出 "John"
console.log(person.age);        // 输出 30
console.log(person["gender"]);  // 输出 "male"
person.sayHello();              // 输出 "Hello!"

3. 构造对象

除了字面量方式创建对象外，还可以使用构造函数创建对象。构造函数是用于创建特定类型对象的函数。

例如，我们可以创建一个 Car 类型的对象：

function Car(brand, model, year) {
  this.brand = brand;
  this.model = model;
  this.year = year;

  this.startEngine = function() {
    console.log("Engine started!");
  };
}

let myCar = new Car("Ford", "Mustang", 2022);

在上面的示例中，Car 是一个构造函数，它具有 brand、model 和 year 三个属性以及 startEngine 方法。通过 new 关键字，我们可以创建一个新的 Car 对象，并为其设置相应的属性值。

console.log(myCar.brand);      // 输出 "Ford"
console.log(myCar.model);      // 输出 "Mustang"
console.log(myCar.year);       // 输出 2022
myCar.startEngine();           // 输出 "Engine started!"

4. 对象属性的增删改查

JavaScript中的对象属性可以动态增加、修改和删除。我们可以使用赋值运算符来增加或修改属性的值。同时，可以使用 delete 关键字删除对象的属性。

以下是一些示例：

4.1 增加属性

let person = {};
person.name = "John";
person.age = 30;

console.log(person.name);  // 输出 "John"
console.log(person.age);   // 输出 30

4.2 修改属性

let person = {
  name: "John",
  age: 30
};

person.name = "Tom";
person.age = 40;

console.log(person.name);  // 输出 "Tom"
console.log(person.age);   // 输出 40

4.3 删除属性

let person = {
  name: "John",
  age: 30
};

delete person.age;

console.log(person.age);  // 输出 undefined

4.4 查询属性

可以使用 in 运算符来检查对象是否具有特定属性。此外，还可以使用 hasOwnProperty() 方法来检查对象自身是否具有特定属性。

let person = {
  name: "John",
  age: 30
};

console.log("name" in person);                         // 输出 true
console.log(person.hasOwnProperty("age"));             // 输出 true
console.log(person.hasOwnProperty("toString"));        // 输出 false

5. 对象方法

对象的方法是以函数的形式定义在对象的属性中的，并且可以调用这些方法来执行特定的操作。

以下是一个简单的示例，展示了如何在对象中定义方法并进行调用：

let person = {
  name: "John",
  age: 30,
  sayHello: function() {
    console.log("Hello, my name is " + this.name + ".");
  }
};

person.sayHello();  // 输出 "Hello, my name is John."

在上面的示例中，sayHello 是 person 对象的一个方法，它可以访问对象的属性 name。注意到在方法内部访问属性时，需要使用 this 关键字来引用当前的对象。

6. 对象迭代

JavaScript提供了几种方式来迭代对象的属性。以下是其中的两种常用方式：

6.1 for…in 循环

for...in 循环可以用来遍历对象的属性。它会遍历对象所有可枚举的属性，包括对象自身的属性和继承的属性。

let person = {
  name: "John",
  age: 30,
  gender: "male"
};

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

输出：

name: John
age: 30
gender: male

6.2 Object.keys() 方法

Object.keys() 方法返回一个包含对象自身可枚举属性的数组。我们可以使用 forEach() 方法遍历该数组来获取对象的属性。

let person = {
  name: "John",
  age: 30,
  gender: "male"
};

Object.keys(person).forEach(function(key) {
  console.log(key + ": " + person[key]);
});

输出与前面相同：

name: John
age: 30
gender: male

7. 内置对象

除了自定义对象之外，JavaScript还提供了许多内置对象，可以直接使用。

以下是一些常见的内置对象示例：

7.1 Math 对象

Math 对象是一个内置的数学库，提供了一系列数学相关的方法和属性。

console.log(Math.PI);          // 输出 3.141592653589793
console.log(Math.abs(-5));     // 输出 5
console.log(Math.floor(3.9));  // 输出 3
console.log(Math.random());    // 输出随机数

7.2 Date 对象

Date 对象用于操作日期和时间。

let currentDate = new Date();
console.log(currentDate);              // 输出当前日期和时间
console.log(currentDate.getFullYear()); // 输出当前年份

7.3 Array 对象

Array 对象是用于存储和操作多个值的有序集合。

let numbers = [1, 2, 3, 4, 5];
console.log(numbers.length);       // 输出数组长度
console.log(numbers[0]);           // 输出数组的第一个元素

numbers.push(6);                   // 在数组末尾添加新元素
console.log(numbers);              // 输出数组 [1, 2, 3, 4, 5, 6]

numbers.pop();                     // 删除数组末尾的元素
console.log(numbers);              // 输出数组 [1, 2, 3, 4, 5]

8. JSON

JSON（JavaScript Object Notation）是一种用于存储和交换数据的文本格式。

在JavaScript中，可以使用 JSON.parse() 方法将 JSON 字符串解析为对象

let jsonData = '{"name": "John", "age": 30, "gender": "male"}';
let parsedData = JSON.parse(jsonData);
console.log(parsedData.name);    // 输出 "John"
console.log(parsedData.age);     // 输出 30
console.log(parsedData.gender);  // 输出 "male"

let person = {
  name: "John",
  age: 30,
  gender: "male"
};

let jsonString = JSON.stringify(person);
console.log(jsonString);  // 输出 '{"name":"John","age":30,"gender":"male"}'

在上面的例子中，我们使用 JSON.parse() 将一个 JSON 字符串解析为 JavaScript 对象，并可以访问解析后的对象的属性。同时，我们使用 JSON.stringify() 将一个 JavaScript 对象转换为 JSON 字符串。

9. 总结

JavaScript对象是JavaScript编程中不可或缺的一部分。对象是一种复合数据类型，可以包含属性和方法。我们可以使用对象字面量或构造函数的方式创建对象，并可以动态增加、修改和删除对象的属性。对象的方法是以函数的形式定义在对象的属性中的，并且可以通过调用这些方法来执行特定的操作。此外，JavaScript还提供了一些内置对象，如Math、Date和Array等，用于处理常见的数学、日期和数组操作。最后，我们还介绍了JSON，它是一种常用的数据交换格式，可以将JavaScript对象转换为JSON字符串，以及将JSON字符串解析为JavaScript对象。