JS中對象幾點需要注意的地方

willin 發布于2019-08-20 18:21 / 3450人閱讀

摘要：如何判斷對象中是否包含一個屬性刪除對象中一個屬性列舉對象中的屬性和值此方法可以枚舉自己和原型鏈中的內容還可以使用對象的方法，它返回一個數組，里面的內容就是由所有的對象的值構成的數組，但是不會包含原型鏈中的內容枚舉如果某個屬性的的設定為不可枚

如何判斷對象中是否包含一個屬性

    var Person = {
        name : "wenzhe",
        number : 91
    };
    
    // checks for both own properties and prototype properties
    console.log("number" in Person);  // true
    console.log("constructor" in Person);  // true
    
    //  only checks for own properties
    console.log(Person.hasOwnProperty("number"));  // true
    console.log(Person.hasOwnProperty("constructor"));  // false

刪除對象中一個屬性

    var Person = {
        name : "wenzhe",
        number : 91
    };
    
    delete Person.name;
    console.log("name" in Person) // false

列舉對象中的屬性和值

    var Person = {
        name : "wenzhe",
        number : "00"
    };
    
    for (pro in Person) {
        console.log(pro + " : " + Person[pro]);
    }
    
    // name : wenzhe
    // number : 00
    // 此方法可以枚舉自己和原型鏈中的內容
    
    
    
    // 還可以使用對象的keys方法，它返回一個數組，里面的內容就是由所有
    // 的對象的key值構成的數組， 但是不會包含原型鏈中的內容
    
    var properties = Object.keys(Person);
    var i = 0, len = properties.length;
    for (var i = 0, len = properties.length; i < len; i++) {
        console.log(properties[i] + " : " + Person[properties[i]]);
    }

枚舉
如果某個屬性的的設定為不可枚舉的，那么上面那兩種方法都不能顯示出那個屬性，但是對于keys返回的那個數組，仍然包含不可被枚舉的那個值

    //  properties是數組，每個數組都有自己的length屬性
    console.log("length" in properties) // true;
    console.log(Person.propertyIsEnumerable("length"));  // false

Get & Set(accessor properties)

var Person2 = {
    name : "wenze";
    
    get name() {
        console.log("Reading name");
        return this.name;
    }
    
    set name(value) {
        console.log("Setting name");
        this.name = value;
    }
}

Person2.name = "Chen";

在對象外面為對象添加屬性的方法

在對象外面添加一般的屬性（Data Property)--Object.defineProperty

var person = {};
Object.defineProperty(person, "name", {
    value : "wz", // 該屬性的值
    enumerable : true, // 是否可以被枚舉
    configurable : true,  //name可以由Data pro <-> accessor property
    writable : false //  不能在被更改，同類型也不行
    })

在對象外面添加 get&set

var person1 = {name : 1};
Object.defineProperty(person1, "name", {
    get: function() {
        console.log("Reading name");
        return this._name;
    },
    set: function(value) {
        console.log("Setting name to %s", value);
        this._name = value;
    },
    enumerable: true,
    configurable: true
})

添加多個屬性使用Object.defineProperty

var person1 = {};
Object.defineProperties(person1, {
   _name: {
       value: "Nicholas",
       enumerable: true,
       configurable: true,
       writable: true
    },
    name: {
           get: function() {
               console.log("Reading name");
               return this._name;
           },
           set: function(value) {
               console.log("Setting name to %s", value);
               this._name = value;
           },
           enumerable: true,
           configurable: true
   }
});

查看屬性值的設置情況

var person1 = {
    name: "WZ"
};
var descriptor = Object.getOwnPropertyDescriptor(person1,       "name");
 
console.log(descriptor.enumerable);
console.log(descriptor.configurable);
console.log(descriptor.writable);
console.log(descriptor.value);
// true
// true
  // true
  // "WZ"

云服務器 GPU云服務器 js包裝對象中的屬性 js，對象中增加數據的方法 js 獲取對象中的數據類型 js中數據和對象的關系圖

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

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

JS總結篇--[總結]JS操作DOM常用API詳解

摘要：文本整理了操作的一些常用的，根據其作用整理成為創建，修改，查詢等多種類型的，主要用于復習基礎知識，加深對原生的認識。方法主要是用于添加大量節點到文檔中時會使用到。文本整理了javascript操作DOM的一些常用的api，根據其作用整理成為創建，修改，查詢等多種類型的api，主要用于復習基礎知識，加深對原生js的認識。基本概念在講解操作DOM的api之前，首先我們來復習一下一些基...

malakashi 2019-08-20 16:52 評論0 收藏0
《編寫可維護的 JavaScript》讀書筆記

摘要：最近閱讀了編寫可維護的，在這里記錄一下讀書筆記。禁止使用，，，的字符串形式。避免使用級事件處理函數。讓事件處理程序成為接觸到對象的唯一函數。檢測函數是檢測檢測函數的最佳選擇。為特定瀏覽器的特性進行測試，并僅當特性存在時即可應用特性檢測。最近閱讀了《編寫可維護的 JavaScript》，在這里記錄一下讀書筆記。書中主要基于三個方向來講解怎么增加代碼的可維護性：編程風格、編程實踐、自動化...

tuniutech 2019-08-23 16:25 評論0 收藏0
一篇包含了react所有基本點的文章

摘要：今年我要挑戰自己，把它歸納為一篇文章。將忽略該函數并呈現常規的空按鈕。這是中唯一的約束只有表達式。將，，和視為沒有呈現任何內容的有效元素子元素。使用自己的對象將事件對象包裝起來，以優化事件處理的性能。任何已掛載元件的狀態可能會改變。去年，我寫了一本關于學習React.js的小書，原來是大約100頁。今年我要挑戰自己，把它歸納為一篇文章。本文不會涵蓋什么是React，或者為什么要學...

Chiclaim 2019-08-22 11:09 評論0 收藏0
js設計模式(一)-單例模式

摘要：雖然是弱類型的語言，但是也有構造函數和實例。也就是說，我們只在第一次調用構造函數時創建新對象，之后調用返回時返回該對象即可。而我不認為這是一個單例模式的原因如下我覺得既然兩次調用同一個構造函數，返回的不是同一個對象，那不就不能成為單例模式。寫在前面（度過一陣的繁忙期，又可以愉快的開始學習新知識了，一年來技術棧切來切去，卻總覺得js都還沒學完-_-）本文主要圍繞js的設計模式進行展...

AlexTuan 2019-08-22 18:17 評論0 收藏0
Vert.x入坑須知（1）

摘要：輕量級，部署簡單。此外，本文也不是入門文檔，而是為了預防陷坑而給出的指導意見，故在閱讀本文之前還請先仔細閱讀的文檔。可視作的一個最小部署和運行單元，簡單的說，可類比為。，主，負責部署程序中其他的。嚴格來講，之后，上述第一點并不完全正確。一直以來早有將這些年用Vert.x的經驗整理一下的想法，奈何天生不是勤快人，直到最近扶墻老師問起，遂成此文。選擇理由現在想想，我們應該算是國內用V...

Turbo 2019-08-14 17:35 評論0 收藏0