JavaScript對象的深入理解（一）

UCloud 發布于2019-08-22 11:11 / 1415人閱讀

摘要：構造函數模式如果要創建許多對象，傳統方法存在以下問題對象名太多，容易搞重復新建一個對象就要全部重寫屬性和方法，過于復雜無法發揮的面向對象優勢繼承由于本身沒有類的概念，因此誕生了構造函數模式來創建對象，該方法利用函數創建對象。

對象，一種數據類型。對象是屬性(變量)和方法(函數)結合在一起的數據實體

對象的出現，就是為了解決封裝的問題?？梢詫⒃S多屬性與方法封裝在一個對象里，方便調用，也符合人的思考方式。

JavaScript中創建對象的基本方法

創建Object實例，再添加屬性和方法

var person = new Object();
    person.name = "Jonathan";
    person.age = 23;
    person.job = "Developer";
    person.sayName = function () {
    console.log(this.name);
};

對象字面量方法
由于上述寫法繁瑣，故出現了對象字面量方法創建對象。

var person = {
    name: "Jonathan",
    age: 23,
    job: "Developer",
    sayName: function () {
        console.log(this.name);
    }
};

console.log(person.name); //Jonathan
person.sayName(); //Jonathan

這樣一來，就把屬性和方法封裝進了一個對象中，方便調用。

構造函數模式

如果要創建許多對象，傳統方法存在以下問題

對象名太多，容易搞重復

新建一個對象就要全部重寫屬性和方法，過于復雜

無法發揮JavaScript的面向對象優勢（繼承）

由于JavaScript本身沒有類的概念，因此誕生了構造函數模式來創建對象，該方法利用函數創建對象。由于函數本身也是對象，因此可以這么操作。
構造函數創建對象的方法是：

function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.sayName = function(){
                       console.log(this.name);
                   };    
}
        
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");

要點：

構造函數命名應以大寫字母開頭（約定俗成的規矩）

構造函數本身也是函數，只不過是用來創建對象的

要創建對象的實例，必須要用new操作符，否則跟調用函數無異。

任何函數，只要通過new操作符來調用，它就可以作為構造函數。

至此，一個Person對象的創建就完成了，它有以下優點：

新建對象只用給函數提供參數，簡化了創建。

有了實例的概念，如Person1就是Person的實例。無形之中給對象歸了類。

更好的體現了封裝，創建對象只用給參數，不用關心對象內部細節。

但用構造函數模式的方法創建對象并不是完美的，它存在以下問題，即：
每個方法（對象內置函數）都要在實例上重新創建一遍
構造函數也可以用以下方法定義，方便我們發現問題

function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.sayName = new Function(console.log(this.name));
    };    
}
        
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");

console.log(person1.sayName == person2sayName); //false

在新建對象person1和person2時，分別新建了兩個不同的方法person1.sayName()和person2.sayName()。
但這很沒有必要，只需要公用一個sayName()方法就好了。為了解決上述問題，誕生了原型模式

云服務器 GPU云服務器深入理解javascript 深入理解系列深入理解linux 深入理解webrtc

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/91946.html

深入理解JavaScript

摘要：深入之繼承的多種方式和優缺點深入系列第十五篇，講解各種繼承方式和優缺點。對于解釋型語言例如來說，通過詞法分析語法分析語法樹，就可以開始解釋執行了。 JavaScript深入之繼承的多種方式和優缺點 JavaScript深入系列第十五篇，講解JavaScript各種繼承方式和優缺點。寫在前面本文講解JavaScript各種繼承方式和優缺點。但是注意：這篇文章更像是筆記，哎，再讓我...

myeveryheart 2019-08-22 13:46 評論0 收藏0
JavaScript深入淺出

摘要：理解的函數基礎要搞好深入淺出原型使用原型模型，雖然這經常被當作缺點提及，但是只要善于運用，其實基于原型的繼承模型比傳統的類繼承還要強大。中文指南基本操作指南二繼續熟悉的幾對方法，包括，，。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。怎樣使用 this 因為本人屬于偽前端，因此文中只看懂了 8 成左右，希望能夠給大家帶來幫助....（據說是阿里的前端妹子寫的） this 的值到底...

blair 2019-08-21 18:26 評論0 收藏0
編寫高質量Javascript的要點-Review深入理解Javascript系列(一)

摘要：編寫高質量的要點深入理解系列一知識點最小全局變量全局變量命名易與第三方的腳本引起沖突所以盡可能少的使用全局變量是很重要的相關策略有命名空間模式或是函數立即自動執行，但是要想讓全局變量少最重要的還是始終使用來聲明變量。 Title: 編寫高質量Javascript的要點-Review深入理解Javascript系列(一)date: 2017-6-9 14:14:20 status: p...

wh469012917 2019-08-21 11:44 評論0 收藏0
ES6-7

摘要：的翻譯文檔由的維護很多人說，阮老師已經有一本關于的書了入門，覺得看看這本書就足夠了。前端的異步解決方案之和異步編程模式在前端開發過程中，顯得越來越重要。為了讓編程更美好，我們就需要引入來降低異步編程的復雜性。 JavaScript Promise 迷你書（中文版）超詳細介紹promise的gitbook，看完再不會promise...... 本書的目的是以目前還在制定中的ECMASc...

mudiyouyou 2019-08-21 18:40 評論0 收藏0
深入理解JavaScript系列9:S.O.L.I.D五大原則之接口隔離原則

摘要：前言本章我們要講解的是五大原則語言實現的第篇，接口隔離原則。接口隔離原則和單一職責有點類似，都是用于聚集功能職責的，實際上可以被理解才具有單一職責的程序轉化到一個具有公共接口的對象。與我們下面討論的一些小節是里關于違反接口隔離原則的影響。前言本章我們要講解的是S.O.L.I.D五大原則JavaScript語言實現的第4篇，接口隔離原則ISP（The Interface Segreg...

piglei 2019-08-19 17:22 評論0 收藏0
深入理解JavaScript系列11:根本沒有“JSON對象”這回事

摘要：更多資料如果你想了解更多關于的資料，下面的連接對你絕對有用關于本文本文轉自大叔的深入理解系列。深入理解系列文章，包括了原創，翻譯，轉載，整理等各類型文章，原文是大叔的一個非常不錯的專題，現將其重新整理發布。前言寫這篇文章的目的是經常看到開發人員說：把字符串轉化為JSON對象，把JSON對象轉化成字符串等類似的話題，所以把之前收藏的一篇老外的文章整理翻譯了一下，供大家討論，如有錯誤，...

darryrzhong 2019-08-19 17:23 評論0 收藏0