JavaScript中怎么利用字面量創(chuàng)建對象？下面本篇文章帶大家了解一下字面量，介紹一下JavaScript中如何利用對象字面量來創(chuàng)建對象，希望對大家有所幫助！

什么是字面量

字面量（literal）是表達一個固定值的表示法，又叫常量，用來為變量賦值時的常數(shù)量

通俗的理解，字面就是所見即所得，js 程序執(zhí)行到代碼中的字面量，會立即知道它是什么類型的數(shù)據(jù)，值是多少

可以用于表示固定值，比如：數(shù)字、字符串、undefined、布爾類型、對象的字面值等

對象字面量創(chuàng)建對象

對象字面量的方式是最常用的創(chuàng)建對象的方式之一，它用內(nèi)含屬性的花括號{...}快速創(chuàng)建對象。

var 對象名={      ..... };

對象字面值是封閉在花括號對({})中的一個對象的零個或多個“屬性名:值”列表。

示例：

var person={      name:"Jack",      age:10,     5:true   };

• 在這個例子中，左邊的花括號（{）表示對象字面量的開始，因為它出現(xiàn)在了表達式上下文（expression context）中。

• JavaScript 中的表達式上下文（expression context）指的是能夠返回一個值（表達式）。

• 賦值操作符（=）表示后面是一個值，所以左花括號在這里表示一個表達式的開始。

• 同樣的花括號，如果出現(xiàn)在一個語句上下文（statement context）中，例如跟在 if 語句條件的后面，則表示一個語句塊的開始。

• 例子中定義了 name屬性，之后是一個冒號，再后面是這個屬性的值（name:"Jack"）。在對象字面量中，使用逗號來分隔不同的屬性，因此”Jack”后面是一個逗號。但是，在 age屬性的值 10 的后面不能添加逗號，因為 age 是這個對象的最后一個屬性。在最后一個屬性后面添加逗號，會在 IE7 及更早版本和Opera 中導致錯誤。

• 不要忘記結(jié)束大括號右邊的（;）

對象字面量的值的類型

對象字面量的值可以是任何數(shù)據(jù)類型包括數(shù)組字面量，函數(shù)，嵌套的對象字面量

var Swapper = {             // 數(shù)組字面量（用逗號分隔，所有都要加引號）     images: ["smile.gif", "grim.gif", "frown.gif", "bomb.gif"],     pos: {              //嵌套對象字面量         x: 40,         y: 300     },     onSwap: function() {              //函數(shù)     } };

• 如果有任何的語法規(guī)則被打破，如缺少逗號或冒號或大括號，將會觸發(fā)JavaScript錯誤。
• 瀏覽器的錯誤信息在指出對象字面量語法錯誤的位置一般有幫助，但他們不一定會在指出錯誤的性質(zhì)完全準確。

在使用對象字面量時，屬性名也可以用字符串

var person={     "name":"Jack",     "age":29,     5:true };

• 上述例子會創(chuàng)建一個對象，包含三個屬性，但這里的數(shù)值屬性名會自動轉(zhuǎn)換為字符串。

• 在通過對象字面量定義對象時，實際上不會調(diào)用Object構造函數(shù)（Firefox 2及更早版本會調(diào)用Object構造函數(shù)；但Firefox3之后就不會了）
  這是因為字面量法創(chuàng)建對象強調(diào)該對象僅是一個可變的hash映射，而不是從對象中提取的屬性或方法。

屬性名和變量名相同時可簡寫

var obj = { name: name, age: age };  // ES2015中，屬性名和變量名相同時可簡寫為： var obj = { name, age };

擴展屬性

// 擴展屬性，ES2018新特性，可用于克隆或合并對象，淺拷貝，不包括原型 var obj2 = { ...obj3 };

以字面量方式創(chuàng)建的對象屬性默認是可寫，可枚舉和可配置的

對象的調(diào)用

對象里面的屬性調(diào)用 : 對象.屬性名 ，這個小點 . 就理解為“ 的 ”

對象里面屬性的另一種調(diào)用方式 : 對象['屬性名']，注意方括號里面的屬性必須加引號，我們后面會用 ? 對象里面的方法調(diào)用：對象.方法名() ，注意這個方法名字后面一定加括號

var obj1 = {     dogName: '可可',     type: '阿拉斯加犬',     age: 5 + '歲',     color: 'red',     skill: function () {         console.log('技能' + ':' + 'bark' + ',' + 'showFilm');     } } console.log(obj1.dogName); obj1.skill();

說明：

對象的原型默認為Object.prototype。通過定義屬性__proto__（只能使用冒號標記的屬性定義）的值來變更原型。只有給出的值是對象或null，對象的原型才會被設置為給出的值，否則原型不會改變。

var obj1 = {}; Object.getPrototypeOf(obj1) === Object.prototype;	// true  var obj2 = { __proto__: null }; Object.getPrototypeOf(obj2) === null;				// true  var __proto__= {}; var obj3 = { "__proto__": __proto__ }; Object.getPrototypeOf(obj3) === __proto__;			// true // 不使用冒號標記的屬性定義，不會變更對象的原型，只是名字為__proto__的普通屬性 var obj4 = { __proto__ }; Object.getPrototypeOf(obj4) === __proto__;			// false obj4.hasOwnProperty("__proto__");					// true Object.getPrototypeOf(obj4) === Object.prototype;	// true  var obj5 = { __proto__: "not an object or null" }; obj5.hasOwnProperty("__proto__");					// false Object.getPrototypeOf(obj5) === Object.prototype;	// true

【