详解Javascript中的Object对象

详解Javascript中的Object对象

什么是Object对象？

在Javascript中，Object是一种非常常见的数据类型。可以说，Object是Javascript中最重要的一个对象之一。 它是由一组无序的键值对组成的，其中键必须是字符串类型，值可以是任意类型，包括数字、字符串、布尔型、函数、内置对象等。

创建Object对象

创建一个空的Object对象可以使用Object的构造函数或字面量方式：

//使用构造函数创建空的Object对象
let obj1 = new Object();

//使用字面量方式创建空的Object对象
let obj2 = {};

可以看到，使用两种方式得到的结果是一样的。

向Object对象添加属性和方法

向Object对象添加属性和方法非常容易，只需要使用“点”或“中括号”语法即可。

//向Object对象添加属性和方法
let person = {};

//使用“.”语法添加属性
person.name = "John";
person.age = 26;

//使用“[]”语法添加属性
person["gender"] = "male";

//使用“.”语法添加方法
person.sayHello = function() {
    console.log("Hello World!");
};

//使用“[]”语法添加方法
person["sayHi"] = function() {
    console.log("Hi, I'm " + this.name);
};

访问Object对象的属性和方法

访问Object对象的属性和方法同样也很容易。

//访问Object对象的属性和方法
let person = {
    name: "John",
    age: 26,
    gender: "male",
    sayHello: function() {
        console.log("Hello World!");
    },
    sayHi: function() {
        console.log("Hi, I'm " + this.name);
    }
};

//使用“.”语法访问属性和方法
console.log(person.name);
console.log(person.age);
console.log(person.gender);
person.sayHello();
person.sayHi();

//使用“[]”语法访问属性和方法
console.log(person["name"]);
console.log(person["age"]);
console.log(person["gender"]);
person["sayHello"]();
person["sayHi"]();

Object对象的常见操作

Object对象有很多有用的方法，这里介绍其中的一些。

1. 获取Object对象所有的属性和方法

可以使用Object.keys()、Object.values()和Object.entries()方法获取Object对象所有的属性和方法。

//获取Object对象所有的属性和方法
let person = {
    name: "John",
    age: 26,
    gender: "male",
    sayHello: function() {
        console.log("Hello World!");
    },
    sayHi: function() {
        console.log("Hi, I'm " + this.name);
    }
};

//获取Object对象所有的属性
console.log(Object.keys(person));

//获取Object对象所有的属性和值
console.log(Object.values(person));

//获取Object对象所有的属性和值的数组形式
console.log(Object.entries(person));

2. 判断属性是否存在和删除属性

可以使用in运算符或hasOwnProperty()方法判断属性是否存在，使用delete运算符删除属性。

//判断属性是否存在和删除属性
let person = {
    name: "John",
    age: 26,
    gender: "male",
    sayHello: function() {
        console.log("Hello World!");
    },
    sayHi: function() {
        console.log("Hi, I'm " + this.name);
    }
};

//判断属性是否存在
console.log("name" in person);
console.log("height" in person);
console.log(person.hasOwnProperty("name"));
console.log(person.hasOwnProperty("height"));

//删除属性
delete person.age;
console.log(person);

示例

示例1：合并多个Object对象

//合并多个Object对象
let obj1 = {a: 1, b: 2, c: 3};
let obj2 = {d: 4, e: 5, f: 6};
let obj3 = {g: 7, h: 8, i: 9};

let newObj = Object.assign({}, obj1, obj2, obj3);
console.log(newObj);
//输出结果：{a: 1, b: 2, c: 3, d: 4, e: 5, f: 6, g: 7, h: 8, i: 9}

示例2：判断两个Object对象是否相等

//判断两个Object对象是否相等
let obj1 = {a: 1, b: 2, c: 3};
let obj2 = {a: 1, b: 2, c: 3};
let obj3 = {a: 1, b: 2, c: 4};

console.log(JSON.stringify(obj1) === JSON.stringify(obj2));
console.log(JSON.stringify(obj1) === JSON.stringify(obj3));
//输出结果：true false

结语

Object对象是Javascript中非常重要的一个对象，掌握了Object对象的操作方法，可以更加灵活地使用Javascript编程。