建站
咨詢
售后
建站咨詢
新聞中心
我們往往需要動態(tài)地給對象添加或刪除屬性和方法：// 添加新屬性person.gender = '男';2. 構造函數(shù)模式構造函數(shù)模式其實就是把相同類型（類）事物抽象出來。
- 本文目錄導讀：
- 1、 對象字面量
- 2、 構造函數(shù)模式
- 3、 原型模式
- 4、 Object.create() 方法
作為一名前端工程師，我們都知道 JavaScript 是基于對象的編程語言。在 JavaScript 中，萬物皆為對象。而理解和掌握 JavaScript 對象是成為一個優(yōu)秀的前端工程師必備技能之一。
那么，在本篇文章中，我們將深入了解并探討 JavaScript 對象的幾種創(chuàng)建方式。
1. 對象字面量
這是最常見、也是最簡單直接可行的方法。通過使用大括號（{}）來定義一個空對象，并可以在其中添加屬性和方法。
```javascript
var person = {
name: '張三',
age: 20,
sayHi: function() {
console.log('你好！');
}
};
```
上面代碼就定義了一個名叫 `person` 的對象，并且它有兩個屬性：`name` 和 `age` ，還有一個方法 `sayHi()` 。
當然，在實際開發(fā)過程中，我們往往需要動態(tài)地給對象添加或刪除屬性和方法：
// 添加新屬性
person.gender = '男';
// 刪除某個已存在的屬性
delete person.age;
2. 構造函數(shù)模式
構造函數(shù)模式其實就是把相同類型（類）事物抽象出來，形成藍圖（即構造函數(shù)），然后通過該藍圖去創(chuàng)建具體實例對象。
function Person(name, age) {
this.name = name;
this.age = age;
// 實例方法
this.sayHi = function() {
}
var person1 = new Person('張三', 20);
上面代碼中，我們定義了一個 `Person` 的構造函數(shù)，并在該函數(shù)內部定義了兩個屬性：`name` 和 `age` 。同時還有一個實例方法 `sayHi()` ，用于打招呼。
接著，通過使用關鍵字 `new` 來創(chuàng)建一個新的對象，即：
這樣就創(chuàng)建出了一個名叫 `person1` 的對象，并且它具有相應的屬性和方法。
3. 原型模式
原型模式是 JavaScript 中比較重要也比較難理解的概念之一。每個函數(shù)都有一個 prototype 屬性，這個屬性是指向原型對象（prototype object）的引用。而原型對象本身就是包含所有實例共享的屬性和方法。
function Person() {}
Person.prototype.name = '張三';
Person.prototype.age = '20';
// 實例化
var person1= new Person();
console.log(person1.name); // 張三
// 修改原型上某個公共變量或方法：
Person.prototype.gender='男';
console.log(person2.gender);//男
從上述代碼可以看到，在創(chuàng)建構造函數(shù)后，為其添加不同類型事物所需公共變量和方法，再通過實例化去調用。同時還可以在原型上添加公共變量或方法。
4. Object.create() 方法
Object.create() 是一種創(chuàng)建對象的新方式，它不使用構造函數(shù)也不使用類，而是直接基于現(xiàn)有的對象來創(chuàng)建新的對象。
var person1 = {
// 創(chuàng)建一個新的對象，并將其原型設置為 person1
var person2 = Object.create(person1);
從上面代碼中我們可以看到，在 `person2` 對象中并沒有定義屬性和方法，但是卻能夠訪問 `person1` 中已經定義好了屬性和方法。這就是因為 `person2` 的原型指向了 `person1` ，所以它們之間具有繼承關系。
以上就是 JavaScript 對象幾種常見創(chuàng)建方式。每一種方式都各有優(yōu)缺點，在具體開發(fā)過程中應當根據(jù)需求選擇最合適、最高效、最易讀懂的方式進行編碼設計。
掌握JavaScript 對象相關知識要點對前端工程師來說至關重要，因此建議大家多花時間學習與實踐，并注重理論與實踐相結合。
網(wǎng)站題目：深入了解JavaScript對象的幾種創(chuàng)建方式
URL標題：http://m.fisionsoft.com.cn/article/cdcjoio.html
