本文為大家分享了javascript創建物件的9種方式,供大家參考,具體內容如下
【1】使用Object建構子
[缺點]使用同一個介面創建許多對象,會產生大量重複程式碼
var person = new Object(); person.name = "Nicholas"; person.age = 29; person.job = "Software Engineer"; person.sayName = function(){ alert(this.name); }
【2】使用物件字面量
[缺點]使用同一個介面創建許多對象,會產生大量重複程式碼
var person = { name: "Nicholas", age : 29, job: "Software Engineer", sayName: function(){ alert(this.name); } };
【3】工廠模式:抽象了創建具體物件的過程,考慮到ECMAScript中無法創建類,開發人員就發明了一種函數,用函數來封裝以特定接口創建對象的細節
[缺點]解決了創建多個相似物件的問題,但沒有解決物件辨識的問題
function createPerson(name,age,job){ var o = new Object(); o.name = name; o.age = age; o.job = job; o.sayname = function(){ alert(this.name); } return o; } var person1 = createPerson('Nicholas',29,'software Engineer'); var person2 = createPerson('greg',27,'doctor');
【4】建構子模式:沒有明確地建立對象,直接將屬性和方法賦給了this對象,沒有return語句
[缺點]每個方法都要在每個實例上重新建立一遍
function Person(name,age,job){ this.name = name; this.age = age; this.jog = job; this.sayName = function(){ alert(this.name); }; //与声明函数在逻辑上是等价的 //this.sayName = new Function('alert(this.name)'); } var person1 = new Person("Nicholas",29,"software Engineer"); var person2 = new Person("Greg",27,"doctor");
【4.1】建構子拓展模式:把函數定義轉移到建構子外部
[缺點1]在全域作用域中定義的函數實際上只能被某個物件調用,這讓全域作用域有點名不副實
[缺點2]若物件需要定義很多方法,就要定義很多全域函數,這個自訂引用型別就沒有封裝性可言
function Person(name,age,job){ this.name = name; this.age = age; this.job = job; this.sayName = sayName; } function sayName(){ alert(this.name); } var person = new Person('小火柴','20','student') person.sayName(); console.log(Person);
【5】原型模式:我們創建的每個函數都有一個prototype(原型)屬性,這個屬性是一個指針,指向一個對象,而這個對象的用途是包含可以由特定類型的所有實例共享的屬性和方法。如果按照字面意思來理解,prototype就是透過呼叫建構函式而創建的物件實例的原型物件
function Person(){ Person.prototype.name = "Nicholas"; Person.prototype.age = 29; Person.prototype.job = "software Engineer"; Person.prototype.sayName = function(){ alert(this.name); } } var person1 = new Person(); person1.sayName();//"Nicholas" var person2 = new Person(); person2.sayName();//"Nicholas" alert(person1.sayName == person2.sayName);//true
【5.1】更簡單的原型模式:為了減少不必要的輸入,也為了從視覺上更好地封裝原型的功能,用一個包含所有屬性和方法的物件字面量來重寫整個原型物件。
[缺點]以這種方式重設constructor屬性會導致它的[[Enumerable]]特性被設定為true,預設情況下原生的constructor屬性是不可枚舉的
function Person(){}; Person.prototype = { constructor : Person, name: "Nicholas", age: 29, job: "software Engineer", sayName : function(){ alert(this.name); } };
【5.2】解決enumerable問題的原型模式
function Person(){}; Person.prototype = { name: "Nicholas", age: 29, job: "software Engineer", sayName : function(){ alert(this.name); } }; Object.defineProperty(Person.prototype,"constructor",{ enumerable : false, value : Person });
[原型模式缺點1]重寫原型物件切斷了現有原型與已存在物件實例之間的聯繫,它們所引用的仍是最初的原型。
function Person(){} var friend = new Person(); Person.prototype = { constructor: Person, name: "Nicholas", age: 29, job: "Software Engineer", sayName: function(){ alert(this.name); } }; friend.sayName();//error
[原型模式缺點2]引用型態屬性的共享性問題突出
function Person(){} Person.prototype = { constructor: Person, name: "Nicholas", age: 29, job: "Software Engineer", friend : ["shelby","Court"], sayName: function(){ alert(this.name); } }; var person1 = new Person(); var person2 = new Person(); person1.friends.push("Van"); alert(person1.friends);//["shelby","Court","Van"]; alert(person2.friends);//["shelby","Court","Van"]; alert(person1.friends === person2.friends);//true
【6】組合模式:組合使用建構函式模式和原型模式是建立自訂類型最常見的方式。建構函數模式用於定義實例屬性,而原型模式用於定義方法和共享的屬性。這種混成模式也支援向建構函式傳遞參數,是用來定義參考類型的一種預設模式
function Person(name,age,job){ this.name = name; this.age = age; this.job = job; this.friends = ["shelby","Court"]; } Person.prototype = { constructor: Person, sayName : function(){ alert(this.name); } } var person1 = new Person("Nicholas",29,"Software Engineer"); var person2 = new Person("Greg",27,"Doctor"); person1.friends.push("Van"); alert(person1.friends);// ["shelby","Court","Van"]; alert(person1.friends);// ["shelby","Court"]; alert(person1.friends === person2.friends);//false alert(person1.sayName === person2.sayName);//true
【7】動態原型模式:把所有資訊都封裝在建構函式中,透過在建構函式中初始化原型(僅在必要情況下),又保持了同時使用建構函式和原型的優點。換句話說,可以透過檢查某個存在的方法是否有效,來決定是否要初始化原型。
[注意]使用動態原型模式時,不能使用物件字面量來重寫原型。如果在已經創建了實例的情況下重寫原型,那麼就會切斷現有實例與新實例之間的聯繫
function Person(name,age,job){ //属性 this.name = name; this.age = age; this.job = job; //方法 if(typeof this.sayName != "function"){ Person.prototype.sayName = function(){ alert(this.name); }; } } var friend = new Person("Nicholas",29,"Software Engineer"); friend.sayName();
【8】寄生建構函數模式:建立一個函數,該函數的作用只是封裝建立物件的程式碼,然後再傳回新建立的物件
function Person(name,age,job){ var o = new Object(); o.name = name; o.age = age; o.job = job; o.sayName = function(){ alert(this.name); }; return o; } var friend = new Person("Nicholas",29,"Software Engineer"); friend.sayName();//"Nicholas"
【寄生建構函式模式應用】建立一個具有額外方法的特殊陣列。由於不能直接修改Array建構函數,因此可以使用這個模式
function SpecialArray(){ //创建数组 var values = new Array(); //添加值 values.push.apply(values,arguments); //添加方法 values.toPipedString = function(){ return this.join('|'); }; //返回数组 return values; } var colors = new SpecialArray("red","blue","green"); alert(colors.toPipedString());//"red|blue|green"
【9】穩健建構子模式:所謂穩健物件指沒有公共屬性,其方法也不引用this的物件。穩妥物件最適合在一些安全環境中(這些環境會禁止使用this和new)或在防止資料被其他應用程式改動時使用。
function Person(name,age,job){ //创建要返回的对象 var o = new Object(); //可以在这里定义私有变量和函数 //添加方法 o.sayName = function(){ alert(name); }; //返回对象 return o; } //在稳妥模式创建的对象中,除了使用sayName()方法之外,没有其他方法访问name的值 var friend = Person("Nicholas",29,"Software Engineer"); friend.sayName();//"Nicholas"
以上就是javascript創建物件的九種方式,希望對大家的學習有所幫助。

Python更適合初學者,學習曲線平緩,語法簡潔;JavaScript適合前端開發,學習曲線較陡,語法靈活。 1.Python語法直觀,適用於數據科學和後端開發。 2.JavaScript靈活,廣泛用於前端和服務器端編程。

Python和JavaScript在社區、庫和資源方面的對比各有優劣。 1)Python社區友好,適合初學者,但前端開發資源不如JavaScript豐富。 2)Python在數據科學和機器學習庫方面強大,JavaScript則在前端開發庫和框架上更勝一籌。 3)兩者的學習資源都豐富,但Python適合從官方文檔開始,JavaScript則以MDNWebDocs為佳。選擇應基於項目需求和個人興趣。

從C/C 轉向JavaScript需要適應動態類型、垃圾回收和異步編程等特點。 1)C/C 是靜態類型語言,需手動管理內存,而JavaScript是動態類型,垃圾回收自動處理。 2)C/C 需編譯成機器碼,JavaScript則為解釋型語言。 3)JavaScript引入閉包、原型鍊和Promise等概念,增強了靈活性和異步編程能力。

不同JavaScript引擎在解析和執行JavaScript代碼時,效果會有所不同,因為每個引擎的實現原理和優化策略各有差異。 1.詞法分析:將源碼轉換為詞法單元。 2.語法分析:生成抽象語法樹。 3.優化和編譯:通過JIT編譯器生成機器碼。 4.執行:運行機器碼。 V8引擎通過即時編譯和隱藏類優化,SpiderMonkey使用類型推斷系統,導致在相同代碼上的性能表現不同。

JavaScript在現實世界中的應用包括服務器端編程、移動應用開發和物聯網控制:1.通過Node.js實現服務器端編程,適用於高並發請求處理。 2.通過ReactNative進行移動應用開發,支持跨平台部署。 3.通過Johnny-Five庫用於物聯網設備控制,適用於硬件交互。

我使用您的日常技術工具構建了功能性的多租戶SaaS應用程序(一個Edtech應用程序),您可以做同樣的事情。 首先,什麼是多租戶SaaS應用程序? 多租戶SaaS應用程序可讓您從唱歌中為多個客戶提供服務

本文展示了與許可證確保的後端的前端集成,並使用Next.js構建功能性Edtech SaaS應用程序。 前端獲取用戶權限以控制UI的可見性並確保API要求遵守角色庫

JavaScript是現代Web開發的核心語言,因其多樣性和靈活性而廣泛應用。 1)前端開發:通過DOM操作和現代框架(如React、Vue.js、Angular)構建動態網頁和單頁面應用。 2)服務器端開發:Node.js利用非阻塞I/O模型處理高並發和實時應用。 3)移動和桌面應用開發:通過ReactNative和Electron實現跨平台開發,提高開發效率。


熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

AI Hentai Generator
免費產生 AI 無盡。

熱門文章

熱工具

SAP NetWeaver Server Adapter for Eclipse
將Eclipse與SAP NetWeaver應用伺服器整合。

Dreamweaver CS6
視覺化網頁開發工具

禪工作室 13.0.1
強大的PHP整合開發環境

EditPlus 中文破解版
體積小,語法高亮,不支援程式碼提示功能

MinGW - Minimalist GNU for Windows
這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。