《javascript語言精粹》學習筆記 - 對象

LoftySoul 發布于2019-08-21 10:27 / 845人閱讀

摘要：對象適用于匯集和管理數據。一個對象字面量就是包圍在一對花括號的多個名值對。嘗試從對象里取值將會導致異常。亦不會觸及原型鏈中的任何對象。嚴格模式下，不能用刪除顯式聲明的標識符，名稱或具名函數。

Javascirpt里的對象是無類型的。它對新屬性的名字和屬性的值沒有任何的限制。對象適用于匯集和管理數據。對象可以包括其他對象，所以它們可以容易地表示成樹狀或者圖形結構。

對象字面量

創建一個自定義對象最簡單的方式就是創建一個Object的實例,然后為它添加屬性和方法：

var person = new Object();
    person.name = "john";
    person.age = 16;
    person.say = function(){
        console.log(this.name + " " + this.age);
    };

后來對象字面量成為一個創建這種對象的首選方式。對象字面量提供一種非常方便的創建新對象的表示法。

var Person = {},
    Person2 = {
        name: "john",
        age: 16,
        say: function(){
            console.log(this.name + " " + this.age);
        }
    };

一個對象字面量就是包圍在一對花括號（{}）的多個名/值對。對象字面量可以出現任何允許表達式出現的地方。

屬性名可以包括空字符串在內的任何字符。屬性名是一個合法的js標示符而且不是保留字的話就不用引號括起來。特殊情況例如："my-name"這種的話，因為js中的標示符中包含連接符（-）是不合法的，所以要用引號去包住，如果用下劃線（_）就不用了。

對象字面量屬性值里面可以在嵌套對象的。

var Person = {
    name: "john",
    Person2: {
        age: 16
    }
}；

檢索

要檢索的對象包含的值，可以采用[]后綴中括住一個字符串表達式方式。也可以用.方法，但是前提要是一個合法的js標示符且不是保留字。

person["name"];
person.name;

如果屬性值沒有的話，我們可以用||充當默認值。

var name = person["name"] || "john";

嘗試從undefind對象里取值將會導致TypEerror異常。可以通過&&運算符來避免錯誤。

flight.equipment // undefined
flight.equipment.model // TypeError
flight.equipment && flight.equipment.model// undefined

引用

對象是通過引用來傳遞的，而不是復制。

// 例子一
var stooge = {},
    x = stooge;
x.nickname = "john";
var nick = stooge.nickname;
alert(nick); // john

// 例子二
var a = {}, b = {}, c = {};
// a = b = c = {};

例子一的代碼因為x和stooge是指向同一個對象的引用。

例子二的代碼其實a、b和c都引用同一個對象。

更新

對象可以使用賦值語句來更新值。如果屬性名已經存在的話，就回去被替換掉。如果值不存在，就擴充到對象中。

var person = {
    name: "Ada"
}
person.name = "john"; // john
person.age = 16 // 16

原型

每個對象都能連接到一個原型對象，并且它可以從中繼承屬性。

當你創建一個新的對象的時候，你可以有選擇性的某個對象作為它的原型。js給我們的機制是很復雜的，但是可以被明顯的簡化，來給Object添加一個create方法。

if (typeof Object.beget !== "function") {
    Object.create = function(o){
        var F = function(){};
        F.prototype = o;
        return new F;
    };
}
var person = Object.create(person);

注意：原型連接在更新時是不會起作用的。當對某個對象做出改變的時候，不會觸及該對象的原型。

原型鏈接只有在檢索值的時候才會用到。如果我們嘗試去獲取對象的某個值的時候，如果對象沒有該屬性名，那么js會嘗試去原型對象中獲取屬性值。如果那個原型也沒有的話，就會一直從它的原型里面找。如果最后還是找不到的話機會返回一個undfined。這個過程稱為委托

原型關系是一種動態的關系。如果添加到一個新的屬性值到原型中，該屬性會立即對所有基于這個原型創建的對象可見。

反射

檢查對象并且確定對象有什么屬性是一件很容易的事情，只要嘗試的去檢索那個屬性并且驗證取得的值。使用typeof來對確定屬性的類型。

var person = {
    name: "john",
    age: 16,
    say: function(){
        console.log(this.name + " - " + this.age);
    }
};
alert(typeof person.name); // string
alert(typeof person.age); // number
alert(typeof person.say); // function

另外一種方法是使用hasOwnProperty方法，如果對象擁有獨有的屬性值，它將會放回true。注意：hasOwnProperty方法不會檢查原型鏈。

alert(person.hasOwnProperty("name")); // true
alert(person.hasOwnProperty("sex")); // false

枚舉

for in循環可以用來遍歷一個對象中的說有屬性名。
注意：使用for in循環過程中也會列出那些你不關心的原型中的屬性，如果想要過濾掉那些你不需要的值。你可以使用hasOwnProperty方法，以及typeof來排除函數。

for (var name in person) {
    if (typeof person[name] !== "function") {
        alert(person[name]);
    }
};

屬性名出現的順序是不確定的，因此要對所有的可能出現的順序有所準備。如果想要確保屬性以特定的順序出現，最好的辦法就是完全避免使用for in語句，而是創建一個數組，在其中以正確的順序包含屬性名。

var i = 0,
    properties = [
        "name",
        "age"
    ];
for (; i < properties.length; i++) {
    alert(person[properties[i]]);
};

通過使用for循環而不是for in循環，就可以得到想要的值，也不用擔心可能發掘出原型鏈中的屬性。

刪除

delete運算符可以用來刪除對象的屬性。如果對象包含這個屬性，那么該屬性就會被移除。亦不會觸及原型鏈中的任何對象。

var Person = function(name, age){
    this.name = name;
    this.age = age;
};
Person.prototype.name = "Ada";

var person = new Person("john", 16);

alert(person.name); // john
delete person.name;
alert(person.name); // Ada

刪除對象的屬性可能會讓來自原型鏈中的屬性透現出來。

嚴格模式下，不能用delete 刪除顯式聲明的標識符，名稱或具名函數。

減少全局變量污染

js可以很隨意去定義全局變量來容納你的應用的所有的資源。不好的是，全局變量削弱了程序的靈活性，應該都要避免使用。

最小化使用全局變量的方法之一就是為你的應用只創建一個唯一的全局變量。

var MyApp = {};

這個變量就會成為你的應用的容器了。

MyApp.person = {
    name: "john",
    age: 16
};

MyApp.person2 = {
    name: "Age",
    age: 14,
    sayName: function(){
        alert("name: " + this.name);
    }
};

只要把全局性的資源都納入一個名稱空間下，自己寫的程序與其他的程序、組件或者類庫之間發生的沖突就會大大的減少。自己寫的程序也會變得更加容易的閱讀。還有另外一種方法也是可以有效的減少全局污染，那就是閉包。

GPU云服務器云服務器 javascript語言精粹 javascript學習筆記 javascript精粹 javascript編程精粹

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

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

《javascript語言精粹》學習筆記 - 繼承

摘要：但采用構造器調用模式，即是使用了前綴去調用一個函數時，函數執行的方式會改變。對象包含構造器需要構造一個新的實例的所有信息。構造器的變量和內部函數變成了該實例的私有成員。 JavaScript 是一門弱類型語言，從不需要類型轉換。對象繼承關系變得無關緊要。對于一個對象來說重要的時它能夠做什么，而不是它從哪里來。閱讀《javascript語言精粹》筆記！偽類 js的原型存...

harriszh 2019-08-21 10:27 評論0 收藏0
《javascript語言精粹》學習筆記 - 數組方法實現

摘要：在中數組是經常被使用到的，我們除了要學習數組的方法，還需要了解誒一下某一些方法是如何來實現的。然而我看了語言精粹中方法的一章，想記錄下書上的代碼，以便加深印象。方法移除數組中的第一個元素并且放回該元素。在js中數組是經常被使用到的，我們除了要學習數組的方法，還需要了解誒一下某一些方法是如何來實現的。然而我看了《javascript語言精粹》中方法的一章，想記錄下書上的代碼，以便加深印...

felix0913 2019-08-21 10:28 評論0 收藏0
【閱讀筆記】javascript 語言精粹

摘要：前言由于最近的項目用到了一些的代碼，所以我帶著好奇心，認真閱讀了這本書，粗略地了解語言的基本結構和特性，對于一些不熟悉的新概念，以記錄的形式加強印象，也是對學習的反思總結。前言由于最近的項目用到了一些js的代碼，所以我帶著好奇心，認真閱讀了這本書，粗略地了解js語言的基本結構和特性，對于一些不熟悉的新概念，以記錄的形式加強印象，也是對學習的反思總結。一、字面量(literals...

tangr206 2019-08-23 11:38 評論0 收藏0
《javascript語言精粹》學習筆記 - 遞歸函數

摘要：遞歸函數就是會直接或者間接地調用自身的一種函數。一般來說，一個遞歸函數調用自身去解決它的子問題。書上第二個例子是說遞歸函數可以非常高效率的操作樹形結構，比如。有一些語言提供了尾遞歸的優化。好運的是，給我們帶來了尾遞歸，詳細迎接使用尾遞歸。遞歸函數就是會直接或者間接地調用自身的一種函數。遞歸是一種強大的編程技術，它把一問題分解為一組相似的子問題，每一個都用一個尋常解去解決。一般來...

Ryan_Li 2019-08-21 10:28 評論0 收藏0
《JavaScript 語言精粹》讀書筆記 - 函數

摘要：語言精粹讀書筆記第四章函數函數字面量函數字面量包含個部分第一部分，保留字第二部分，函數名，它可以被忽略。這個超級延遲綁定使得函數對高度復用。構造器調用模式一個函數，如果創建的目的就是希望結合的前綴來調用，那它就被稱為構造器構造。《JavaScript 語言精粹》讀書筆記第四章函數 Functions 函數字面量函數字面量包含4個部分：第一部分，保留字 function...

wdzgege 2019-08-22 14:54 評論0 收藏0