JavaScript - ES5 Object Methods

Hai在那里，未来的JavaScript巫师们！今天，我们将要深入ES5对象方法的神奇世界。如果你是编程新手，不用担心——我会成为你这次冒险中的友好向导，我们会一步步来。在本教程结束时，你将能够像专业人士一样操作对象！

JavaScript ES5 Object Methods

在我们开始之前，让我们快速回顾一下JavaScript中的对象是什么。想象一个对象是一个包含相关信息的容器。例如，一个“汽车”对象可能包含颜色、品牌和年份等属性。

let car = {
color: "merah",
brand: "Toyota",
year: 2020
};

现在，ES5引入了几个强大的方法来操作这些对象。让我们一个一个地探索它们！

JavaScript Object.create() Method

Object.create() 方法允许我们使用一个现有的对象作为原型来创建一个新的对象。就像说，“嘿，JavaScript，给我一个继承自这个其他对象的新对象！”

let animal = {
makeSound: function() {
console.log("Suara binatang umum");
}
};

let dog = Object.create(animal);
dog.makeSound(); // Output: Suara binatang umum

dog.bark = function() {
console.log("Woof woof!");
};

dog.bark(); // Output: Woof woof!

在这个例子中，我们创建了一个继承自 animal 对象的 dog 对象。dog 可以使用 animal 的 makeSound 方法，但它也有自己的 bark 方法。

JavaScript Object.defineProperty() Method

Object.defineProperty() 允许我们添加或修改对象的属性。就像在你买下汽车后能够给汽车添加一个新特性！

let person = {};

Object.defineProperty(person, "name", {
value: "John",
writable: false,
enumerable: true,
configurable: true
});

console.log(person.name); // Output: John
person.name = "Jane"; // This won't change the name
console.log(person.name); // Output: John

在这里，我们给 person 对象添加了一个 name 属性。我们将其设置为不可写，这意味着在设置后无法更改其值。

JavaScript Object.defineProperties() Method

Object.defineProperties() 类似于 defineProperty()，但更加强大！它允许我们一次性定义多个属性。

let book = {};

Object.defineProperties(book, {
title: {
value: "The Great Gatsby",
writable: true
},
author: {
value: "F. Scott Fitzgerald",
writable: false
}
});

console.log(book.title); // Output: The Great Gatsby
console.log(book.author); // Output: F. Scott Fitzgerald

book.title = "Gatsby"; // This works
book.author = "Scott"; // This doesn't work

console.log(book.title); // Output: Gatsby
console.log(book.author); // Output: F. Scott Fitzgerald

在这个例子中，我们一次性为我们的 book 对象定义了两个属性。title 是可写的，但 author 不是。

JavaScript Object.getOwnPropertyDescriptor() Method

这个方法允许我们获取属性的描述。就像询问你的汽车某个特定功能的规格。

let car = {
brand: "Toyota"
};

let descriptor = Object.getOwnPropertyDescriptor(car, "brand");

console.log(descriptor);
// Output:
// {
//   value: "Toyota",
//   writable: true,
//   enumerable: true,
//   configurable: true
// }

在这里，我们获取了我们 car 对象的 brand 属性的描述符。它告诉我们值以及属性是否可写、可枚举和可配置。

JavaScript Object.getOwnPropertyNames() Method

这个方法返回一个数组，包含在给定对象中直接找到的所有属性（无论是可枚举的还是不可枚举的）。就像获取你的汽车的 所有功能列表，包括隐藏的！

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

Object.defineProperty(person, "ssn", {
value: "123-45-6789",
enumerable: false
});

console.log(Object.getOwnPropertyNames(person));
// Output: ["name", "age", "ssn"]

尽管我们将 ssn 设置为不可枚举，getOwnPropertyNames() 仍然将其包含在列表中。

JavaScript Object.getPrototypeOf() Method

这个方法返回指定对象的原型。就像问，“你的父母是谁？”

let animal = {
eats: true
};

let rabbit = Object.create(animal);

console.log(Object.getPrototypeOf(rabbit) === animal); // Output: true

在这里，我们确认 rabbit 的原型确实是 animal 对象。

JavaScript Object.keys() Method

Object.keys() 返回一个数组，包含给定对象自己的可枚举属性名称。就像获取你的汽车所有可见功能的列表。

let car = {
brand: "Toyota",
model: "Corolla",
year: 2020
};

console.log(Object.keys(car));
// Output: ["brand", "model", "year"]

这个方法只返回可枚举的属性，而 getOwnPropertyNames() 返回所有属性。

JavaScript Object.freeze() Method

Object.freeze() 冻结一个对象。一个被冻结的对象不能再被改变。就像把你的汽车放在冰块里——你不能添加、删除或修改它的属性！

let car = {
brand: "Toyota",
model: "Corolla"
};

Object.freeze(car);

car.year = 2020; // This won't work
car.brand = "Honda"; // This won't work either

console.log(car); // Output: { brand: "Toyota", model: "Corolla" }

在冻结 car 对象后，我们不能添加 year 属性或更改 brand。

JavaScript Object.seal() Method

Object.seal() 封印一个对象，防止新属性被添加到它，并将所有现有属性标记为不可配置。就像封印你的汽车——你不能添加新功能，但你可以修改现有的。

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

Object.seal(person);

person.gender = "Male"; // This won't work
person.age = 31; // This works

delete person.name; // This won't work

console.log(person); // Output: { name: "John", age: 31 }

我们可以更改 age，但不能添加 gender 或删除 name。

JavaScript Object.isFrozen() Method

这个方法确定一个对象是否被冻结。就像检查你的汽车是否真的被困在冰块里！

let car = {
brand: "Toyota"
};

console.log(Object.isFrozen(car)); // Output: false

Object.freeze(car);

console.log(Object.isFrozen(car)); // Output: true

JavaScript Object.isSealed() Method

类似于 isFrozen()，这个方法检查一个对象是否被封印。

let person = {
name: "John"
};

console.log(Object.isSealed(person)); // Output: false

Object.seal(person);

console.log(Object.isSealed(person)); // Output: true

JavaScript Object.preventExtensions() Method

这个方法防止新属性被添加到对象。就像在汽车上贴上“不再添加功能”的标志。

let car = {
brand: "Toyota"
};

Object.preventExtensions(car);

car.model = "Corolla"; // This won't work

console.log(car); // Output: { brand: "Toyota" }

在防止扩展后，我们不能添加 model 属性。

JavaScript Object.isExtensible() Method

这个方法确定一个对象是否可扩展（是否可以添加新属性）。

let car = {
brand: "Toyota"
};

console.log(Object.isExtensible(car)); // Output: true

Object.preventExtensions(car);

console.log(Object.isExtensible(car)); // Output: false

这是我们涵盖的所有方法的总结：

方法	描述
Object.create()	使用指定的原型对象和属性创建一个新对象
Object.defineProperty()	将命名的属性和给定的描述符添加到对象
Object.defineProperties()	直接在对象上定义新的或修改现有的属性，返回该对象
Object.getOwnPropertyDescriptor()	返回对象自有属性的属性描述符
Object.getOwnPropertyNames()	返回直接在给定对象中找到的所有属性的数组
Object.getPrototypeOf()	返回指定对象的原型
Object.keys()	返回给定对象自有的可枚举属性名称的数组
Object.freeze()	冻结一个对象：其他代码不能删除或改变其属性
Object.seal()	封印一个对象，防止新属性被添加并标记所有现有属性为不可配置
Object.isFrozen()	确定一个对象是否被冻结
Object.isSealed()	确定一个对象是否被封印
Object.preventExtensions()	防止新属性被添加到对象
Object.isExtensible()	确定一个对象是否可扩展

就这样！你已经对ES5对象方法进行了一次精彩的旅行。记住，熟能生巧，所以不要犹豫在你自己的代码中尝试这些方法。祝编程愉快，未来的JavaScript大师们！

Credits: Image by storyset