1. 程式人生 > >JavaScript裡建立物件的三種方法

JavaScript裡建立物件的三種方法

JavaScript把幾乎一切都當做物件,因此語言中所有的元素都可以被建立、賦予屬性以及被連結到原型鏈中。僅有的例外是null和undefined。在JavaScript中物件是被創建出來的,它們不是憑空產生的。

1. 物件字面量

字面量語法可以用內聯的方式描述一個物件,外面有一個大括號,裡面的程式碼是一系列由逗號隔開的屬性。不像 new Object()語法,字面量語法不會被顯示呼叫,因為在特定的上下文中,字面量實際上是使用Object.create方法的快捷方式。舉個例子:

var foo = { bar: 'baz'};var foo2 = Object.create(Object.prototype
,{ bar:{ writable: true, configurable: true, value: 'baz' }});console.log(foo.bar); //bazconsole.log(foo2.bar); //baz

字面量語法很清晰,表現力強而且很緊湊。你可以使用內聯的方式同時描述和建立物件。這種特質讓字面量語法成為建立簡單的一次性物件的最佳選擇。這種一次性物件可以用來處理事件、整理物件間狀態的改變或者劃分功能,同時可以保持程式碼在視覺上的聚合。字面量語法和new Object()的另一個細小區別是,字面量語法的建構函式不能被重新定義。不過,原生物件的建構函式屬於全域性名稱空間,如果修改可能會導致意想不到的行為,很難追蹤。字面量語法被隱式呼叫這一點,給程式碼提供了一點防禦性。

var foo = new Object();var bar = {};console.log(typeof(foo)); //objectconsole.log(typeof(bar)); //objectwindow.Object = function(){ arguments.callee.call();}
//Uncaught RangeError: Maximun call stack size exceedvar foo = new Object();

這種字面量語法並不是在所有情況下都適用,例如,你不能建立一個原型不是內建物件的物件。而且因為字面量語法是隱式呼叫的,所以它沒有顯式的建構函式。另外,很多JSON直譯器需要屬性使用雙引號來定義,而字面量語法並沒有這種要求。

2. new Object()

當談到new Object()時,其實討論的是new運算子。這個運算子根據需求來建立物件的例項。它接受一個建構函式和一系列初始化過程中使用的可選引數。物件建立完成後,新建立的物件繼承自建構函式的原型。

var Animal,cat,dog;Animal = function(inLove){ this.lovesHumans = inLove || false;};cat = new Animal();dog = new Animal(true);console.log(cat.lovesHumans); //falseconsole.log(dog,lovesHumans); //true

new運算子是一種JavaScript試圖讓自己類似於Java的退化結構。很多人都會對new運算子感到很疑惑,因為它強加了一種偽類動詞到JavaScript中,但JavaScript並不是一種正規的基於繼承方法的語言。為了更好的理解new關鍵字在幕後做了什麼,讓我們看一下前面的例子,來剖析new都為我們做了什麼。希望這可以清除掉由它的語義帶來的潛在的歧義。

1. JavaScript建立一個新的物件

    這相當於建立了一個物件自變數{}。

2. JavaScript將新建立的物件的建構函式連結到函式Animal上
console.log(cat.constructor);
3. JavaScript講物件的原型連結到Animal.prototype

    在物件構造過程中,新建立的物件會獲得前一個建構函式屬性的引用。它們是一個淺拷貝,如果以後修改的話,實際情況是原建構函式屬性的引用會被一個本地的引用覆蓋。

var Animal,cat,dog;Animal = function(inLove){ this.lovesHumans = inLove || false;};cat = new Animal();dog = new Animal(true);//捕獲異常try { console.log(cat.jump());} catch (error) { //something}Animal.prototype.jump = function(){ return 'how high ?';};console.log(cat.jump()); //how high ?console.log(dog,jump()); //how high ?cat.jump = function(){ return 'no';}console.log(cat.jump()); //noconsole.log(dog.jump()); //how high ?
4. JavaScript將傳入的引數賦給新建立的物件

    new運算子在新物件建立時,將任意數量的屬性初始化到物件中。它們會作為引數傳入到建構函式中。

var Animal,dog;Animal = function(inLove){ this.lovesHumans = inLove || false;};dog = new Animal(true);
/** * new 運算子做了以下動作 * dog = {}; * dog.lovesHumans = true */

3. Object.create

在ECMAScript 5 中引入Object.create方法之前,只能使用new運算子來實現原型鏈繼承。總而言之,Object.create()和字面量物件應該替換new Object()這種方法。Object.create()給開發者提供了new運算子的優點,而且方法簽名與語言其他部分還能保持一致。Object.create的好處已經超越了僅僅提升語義本身,實際上它在對繼承的支援方面更加強大。Object.create可以接收兩個引數:一個是提供原型的物件,另一個是可選屬性物件,這個物件包含對新建立物件的配置。

var car = { drive: function(miles){ return this.odometer += miles; }};var tesla = Object.create(car,{ 'odometer':{ value: 0, enumerable: true }});console.log(tesla.drive(10)); //10

相關推薦

JavaScript建立物件方法

JavaScript把幾乎一切都當做物件,因此語言中所有的元素都可以被建立、賦予屬性以及被連結到原型鏈中。僅有的例外是null和undefined。在JavaScript中物件是被創建出來的,它們不是憑空產生的。1. 物件字面量字面量語法可以用內聯的方式描述一個物件,外面有一

JavaScript遍歷物件4方法和遍歷陣列的3方式 程式碼

//遍歷物件 4種方法 //Object.keys(obj).forEach() console.log("keys...遍歷</br>") var obj1 = { '0': 'a', '1': 'b', '2': 'c' }; Object.key

JS 之函式定義 & 建立物件 方式

JS函式建立三種方式 JS建立物件三種方式 一、javaScript 函式建立的三種方式 <html> <head> <meta http-equiv="Content-Type" content="text/htm

JavaScript - 建立物件方法

一.  構造器建立:var objName = new Object() 1.屬性(新增屬性:物件名.屬性名 = 屬性值   訪問屬性:物件名.屬性名)   2.方法(新增方法:物件名.方法名 = function ( )

JavaScript基礎-----建立物件方法

在 JavaScript 中我們知道無法通過類來建立物件,那麼如何建立物件呢? (1)通過“字面量”方式建立物件 將你的資訊寫到{ }中,並賦值給一個變數,此時這個變數就是一個物件,例: var game = { first : "吃雞", two :

JS建立物件方法

JS建立物件的三種方法 工廠模式: function person(name,age,job){ var obj = new Object(); obj.name = name; obj.age = age; obj.sayName = function(){ alert

c++ 建立物件方法

c++有三種方法建立物件 結合程式碼來看 1 #include <iostream> 2 using namespace std; 3 class Test { 4 5 private: 6 public:

Spring建立物件方法之一建構函式建立(原始碼)

Spring建立物件有三種方法,分別是: 1、建構函式建立 2、靜態工廠方法 3、例項工廠方法 這裡說下第一種方法,採用建構函式來建立,我這裡直接給原始碼,湊合著看看,能用就可以了,如果想要更深入的瞭解,那麼只有自己去找資料了。 第一個類:D1.java pa

Javascript面向物件程式設計,定義類(class)的方法

在面向物件程式設計中,類(class)是物件(object)的模板,定義了同一組物件(又稱"例項")共有的屬性和方法。 Javascript語言不支援"類",但是可以用一些變通的方法,模擬出"類"。 一、建構函式法 這是經典方法,也是教科書必教的方法。它用建構函式模

分針網——每日分享:JavaScript進階(四)js字符串轉換成數字的方法

加入職業技能圈 q群:272292492 更多文章:www.f-z.cn 在js讀取文本框或者其它表單數據的時候獲得的值是字符串類型的,例如兩個文本框a和b,如果獲得a的value值為11,b的value值為9 ,那麽a.valu

JavaScript中,有常用的綁定事件的方法

cti 能夠 自定義 結構 彈出 事件流 his 不同 標簽 要想讓 JavaScript 對用戶的操作作出響應,首先要對 DOM 元素綁定事件處理函數。所謂事件處理函數,就是處理用戶操作的函數,不同的操作對應不同的名稱。在JavaScript中,有三種常用的綁定事件的方法

Windows 10 應用建立模糊背景視窗的方法

原文 Windows 10 應用建立模糊背景視窗的三種方法 現代的作業系統中建立一張圖片的高斯模糊效果非常容易,不過如果要在視窗中獲得模糊支援就需要作業系統的原生支援了。iOS/Mac 和 Windows 系統都對此有支援。 本文將介紹三種建立模糊背景視窗的方法。有人可能喜歡稱之為毛玻璃視窗、亞克力視窗。

Javascript】JS遍歷陣列的方法:map、forEach、filter

前言   近一段時間,因為專案原因,會經常在前端對陣列進行遍歷、處理,JS自帶的遍歷方法有很多種,往往不加留意,就可能導致知識混亂的現象,並且其中還存在一些坑。前端時間在ediary中總結了js原生自帶的常用的對陣列遍歷處理的方法,分別為:map、forEach、filter,在講解知識點的同時,會類比相識

iOS開發(Swift):建立UINavigationView的方法

UINavigationController是iOS開發中很常用的一種元件,由於種種原因許多人喜歡從程式碼建立檢視控制元件,包括UINavigationController,但是有時候我們的螢幕控制元件太多,一方面使用storyboard可以方便設計,但是另一方面又需要用程式碼建立UINavi

url地址資料引數轉化JSON物件(js方法實現)

當我們用get方法提交表單時,在url上會顯示出請求的引數組成的字串,例如:http://localhost:3000/index.html?phone=12345678901&pwd=123123,在伺服器端我們要獲取其中的引數來進行操作,這種情況下,就要對請求過來的網址進行拆解了。下面將用3種方法

eclipse建立springboot專案的方法

方法一 安裝STS外掛 安裝外掛導向視窗完成後,在eclipse右下角將會出現安裝外掛的進度,等外掛安裝完成後重啟eclipse生效   新建spring boot專案   專案啟動   方法二 1.建立Maven專案 2.

獲取表單物件方法getElementById getElementsByName and getEl

分享一下我老師大神的人工智慧教程!零基礎,通俗易懂!http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識,造福人民,實現我們中華民族偉大復興!        

java 建立執行緒的方法

在java中使用Thread類代表執行緒,所有的執行緒物件都必須是Thread類或其子類的例項,建立執行緒有三種方式: 1.通過繼承Thread類建立執行緒; 2.通過實現Runnable介面建立執行緒; 3.通過使用Callable和Future建立執行緒。 建立執行緒demo

執行緒及建立執行緒的方法

基本概念 程式:是為了完成特定任務,用某種語言編寫的一組指令的集合.即指一段靜態程式碼。 程序:程序是程式的一次執行過程,是系統進行資源分配和處理機排程的一個獨立單位。 程式是一個靜態的概念,程序是一個動態的概念。一個程式多次執行,對應多個程序;不同的程序可以包含同一程式。 執行緒:

Linux軟體安裝——mysql5.7-安裝新手入門 6、MySQL建立使用者的方法

因測試工作需要,在Linux上自搭一個mysql服務。 但對入門linux的同志,剛開始最迫切想知道的,大概一個是中文輸入法,另一個就是怎麼安裝軟體。本文主要學習了LINUX安裝軟體的特點,並完成安裝mysql的安裝作為實踐。 一、Linux軟體安裝須知: &