JavaScript中創建對象的三種方式分別是什么，針對這個問題，這篇文章詳細介紹了相對應的分析和解答，希望可以幫助更多想解決這個問題的小伙伴找到更簡單易行的方法。

成都創新互聯是一家專業提供甌海企業網站建設,專注與成都網站制作、成都網站設計、H5開發、小程序制作等業務。10年已為甌海眾多企業、政府機構等服務。創新互聯專業網站設計公司優惠進行中。

Javascript中的一切幾乎都是對象，無論是數組還是函數。本文將教你使用JavaScript創建對象的三種方法。

對象字面量

JavaScript對象字面量是指用大括號括起來的用逗號分隔的名稱——值對列表。對象字面量用于封裝代碼并將其包裝在有序的包中。

let Person = {   name: "Foziya",   age: 20,   action: ["walk", " run"],   greeting: function() {     console.log("Hello");   } };

對象字面量的屬性值可以是任何數據類型，包括數組字面量、函數字面量和嵌套對象字面量。

let shape = {   name: "rectangle",   color: "red",   size: {     length: 10,     breadth: 20   } };   console.log(shape);  // { name:'rectangle',  // color: 'red',  // size: { length:10, breadth: 20 } }   console.log(shape.size.length) // 10

簡寫屬性名稱

假設必須將不同的變量放在一個對象內，有一種方法是：

let one = 1; let two = 2; let three = 3;   let numbers = {   one: one,   two: two,   three: three }; console.log(numbers);   //{ one: 1, two: 2, three: 3 }

使用ECMAScript 2015，可通過較短的表示法實現相同的目的：

let one = 1; let two = 2; let three = 3;   let numbers = { one, two, three };   console.log(numbers); //{ one: 1, two: 2, three: 3 }   console.log(numbers.one) // 1   console.log(numbers.one === { one }.one); // true

用戶定義的構造函數

你也可以使用函數在JavaScript中創建對象。仔細想，其實它們本身已經是對象了，因此對象用于創建更多對象。

通常，此方法優于對象構造函數。試想必須創建數百個具有相同屬性的對象，使用對象構造函數方法，必須手動將所有屬性添加到所有對象，但是使用構造函數可以預定義這些屬性。

functionmovies(name, releaseYear, genre, ratings) {   this.name = name;   this.releaseYear =releaseYear;   this.genre = genre;   this.ratings =ratings;   this.watch = () => {     console.log("WatchOnline");   }; }   let DPS = new movies("Dead Poets Society", 1989, ["Drama", "Teen"], {   IMDb: "8.1 /10",   Metacritic: "79%" });   console.log(DPS);movies { //     name: 'Dead Poets Society', //         releaseYear: 1989, //             genre: ['Drama','Teen'], //                 ratings: { IMDb:'8.1 / 10', Metacritic: '79%' }, //     watch: [Function] // }     let rocky = new movies("Rocky", 1976, ["Drama", "Sports"], {   IMDb: "8.1 /10",   Metacritic: "70%" });   console.log(rocky);   // movies { //     name: 'Rocky', //         releaseYear: 1976, //             genre: ['Drama','Sports'], //                 ratings: { IMDb:'8.1 / 10', Metacritic: '70%' }, //     watch: [Function] // }

使用相同的構造函數，可以創建任意數量的對象。

重復的屬性名稱

如果兩個屬性使用相同的名稱，則第二個屬性將覆蓋第一個屬性。

let Person = {   name: "NeyVatsa",   name: "Shashank" }; console.log(Person.name);   // Shashank

New關鍵字

對象構造函數為給定值創建一個對象封裝器。如果該值不存在或未定義，它將創建并返回至一個空對象。否則的話，它將返回至一個與給定值類型一致的對象。

也可以使用new關鍵字創建對象。使用Javascript中的內置對象構造函數，創建一個新的空對象;或者，此關鍵字可以與用戶定義的構造函數一起使用。首先來看一個例子：

let movies = newObject();   console.log(movies) //{}

下一步是向此空對象添加屬性和方法，可通過簡單的點標記來實現：

let movies = newObject();   console.log(movies) //{}   movies.name = "Dead Poets Society"; movies.releaseYear = 1989; movies.genre = ["Drama", "Teen"]; movies.ratings = {   IMDb: "8.1 /10",   Metacritic: "79%" }; movies.watch = () => {   console.log("WatchOnline"); };   console.log(movies); // { name: 'Dead Poets Society', //  releaseYear: 1989, //  genre: [ 'Drama', 'Teen' ], //  ratings: { IMDb: '8.1 / 10',Metacritic: '79%' }, //  watch: [Function] }   movies.watch(); // Watch Online

但我不建議這種做法，因為后臺有作用域解析，可以檢查構造函數是內置的還是用戶定義的。

使用ES6類創建對象

此方法與通過用戶定義的構造函數使用new關鍵字非常類似。類是面向對象編程(OOP)的主要組件，可以創建實際上是對象的許多類實例。在ES6規范的支持下，現在可以用類替換構造函數。

classMovies {   constructor(name,releaseYear, genre, ratings) {     this.name = name;     this.releaseYear = releaseYear;     this.genre = genre;     this.ratings =ratings;   }   watch() {     console.log("WatchOnline");   } } let rocky = new Movies("Rocky", 1976, ["Drama", "Sports"], {   IMDb: "8.1 /10",   Metacritic: "70%" }); console.log(rocky); // Movies { //     name: 'Rocky', //         releaseYear: 1976, //             genre: ['Drama','Sports'], //                 ratings: { IMDb:'8.1 / 10', Metacritic: '70%' } // }   rocky.watch(); //Watch Online

上面示例中，我已經定義了構造函數中的所有參數。方法可以是類的一部分，而聲明可以稍后添加到類的創建實例中，成為“對象”：

/* above example */ rocky.buy = function() {   console.log("Buy theMovie"); }; rocky.buy(); // Buy the Movie

而這里方法是對象的一部分，不會影響原始類。

圖源：unsplash

在JavaScript這一基于原型的繼承語言中，類和構造函數都模仿面向對象的繼承模型。熟悉類非常有幫助，React這樣的流行JavaScript庫會經常使用類句法。

關于JavaScript中創建對象的三種方式分別是什么問題的解答就分享到這里了，希望以上內容可以對大家有一定的幫助，如果你還有很多疑惑沒有解開，可以關注創新互聯行業資訊頻道了解更多相關知識。