JavaScript學習之Object(下)相關方法

amuqiao 發布于2019-08-23 12:15 / 1224人閱讀

摘要：它不區分該屬性是對象自身的屬性，還是繼承的屬性。那么我們要遍歷對象所有屬性，包括繼承以及不可遍歷的屬性，用加原型遍歷實現類似的用遞歸

Object靜態方法

Object自身方法，必須由Object調用，實例對象并不能調用

Object.getPrototypeOf()

作用是獲取目標對象的原型

function F() {};
var obj = new F();
console.log(Object.getPrototypeOf(obj) === F.prototype);

其等同于求obj.__proto__ = obj.[[prototype]]的值
需要注意的是普通函數也是Function的實例對象，所以function f() {}; Object.getPrototypeOf(f); // Function.prototype

Object.setPrototypeOf()

作用是為目標對象設置原型

var sub = {a : 1};
var super = {b : 1};
Object.setPrototypeOf(sub, super);  //sub.__proto__ = super

Object.setPrototypeOf要實現的效果就是sub.__proto__ = super，也就是Object.getPrototypeOf(sub)等于 super，返回值是sub
模擬new的實現

function F() {
    this.a = 123;
};
var o = new F();
//等價于
//var o1 = Object.setPrototypeOf({}, F.prototype);  創建一個空對象并且以F.prototype為原型的實例對象
//F.call(o1);                                       并將this的屬性以及方法給o1

Object.create()

作用與setPrototypeOf類似，創建一個空對象并以參數對象為原型的實例對象，第一個參數必須是對象或者null

var o = new Object();
//var o = Object.create({});
//var o = Object.create(Object.prototype);

看起來Object.prototype等同于空對象，我的理解是這邊因為賦值都是

{constructor: ?, __defineGetter__: ?, __defineSetter__: ?, hasOwnProperty: ?, __lookupGetter__: ?,?…}

所以這三者等價
create的創建模擬如下：

function creat(obj) {
    function F() {};
    F.prototype = obj;   //prototype的作用就是將值放入o.__proto__中(o = new F())
    return new F();
}

因為{}與Object.prototype賦值給F.prototype值一樣，所以結果一樣
當參數為null時，返回的實例對象，是比空值還空的對象，不繼承Object的原型
還可以填入第二個參數，參數為屬性描述對象，并將其屬性添加到實例對象中

var supe = {b : 2};
var obj = Object.create(supe, {
    a : {
        value : 123,
        writable : true,
        enumerable　: true,
        configurable : true, 
    }

});
//obj
//{a: 123}
//a: 123
//    __proto__: 
//        b: 2                  //這邊是prototype賦入的b
//        __proto__: Object

Object.assign()

Object.assign(target,sources...sources)
作用是將源對象的自身可遍歷屬性淺拷貝到目標對象中，并返回最終的目標對象
注意點是：

可遍歷屬性

自身(OwnProperty)屬性

相同且可修改屬性會覆蓋，不可修改屬性覆蓋會報錯

string或者Symbol類型是可以被直接分配的（Symbol還未接觸，暫且放放）

var suber = Object.create({a : 1}, {
    a : {
        value : 0,
        writable : true,   //false時，target為suber時會報錯
        enumerable : false,
        configurable : true,
    },
    b : {
        value : 1,
        writable : true,
        enumerable : true,
        configurable : true,
    },
    c : {
        value : "c",
        writable : true,
        enumerable : true,
        configurable : true,
    },
});
var suber1 = Object.create({t : 1}, {
    b : {
        value:2,
        writable : false,
        enumerable : true,
        configurable : true,
    }
});
var suber2 = Object.create({a : 1}, {
    b : {
        value : 3,
        writable : true,
        enumerable : true,
        configurable : true,
    }
});
console.log(Object.assign(suber, suber1,suber2));       //{b: 3, c: "c", a: 0}
//console.log(Object.assign({}, suber, suber1,suber2)); //{b: 3, c: "c"}

從代碼中可看出：

判斷是否只讀是以target對象的屬性描述對象為基準，當target為{}時，b的所有enumerable為false，也能賦值上去

屬性描述對象并不會拷貝

只有原始類型為string才可以被直接分配的,（Symbol還未接觸，暫且放放）

console.log(Object.assign({},"asd"));  //{0: "a", 1: "s", 2: "d"}

Object的實例方法 Object.prototype.isPrototypeOf()

isPrototypeOf作用判斷目標對象是否為參數對象的原型o1.isPrototypeOf(o2)==> o1 === o2.__proto__ ? true : false
由這個全等符號也可以看出原型鏈就是對象之間的鏈接就是對象引用(地址)的賦值

in與for-in

in運算符返回一個布爾值，表示一個對象是否具有某個屬性。它不區分該屬性是對象自身的屬性，還是繼承的屬性。
不管是否可以遍歷
for-in:遍歷對象所有可遍歷屬性。它不區分該屬性是對象自身的屬性，還是繼承的屬性。
那么我們要遍歷對象所有屬性，包括繼承以及不可遍歷的屬性，
用getOwnPropertyNames加原型遍歷實現

function getAllPropertyNames(target) {
    //var arr = [];
    var props = {};
    while(target) {
        Object.getOwnPropertyNames(target).forEach(function(p) {
            
                props[p] = true;
        });
        target = Object.getPrototypeOf(target);
        
    }
    
    return Object.getOwnPropertyNames(props);
}
var o = {a : 1};
console.log(getAllPropertyNames(o));

類似的用遞歸

function getAllPropertyNames(n) {
    var sup = Object.getPrototypeOf(n);
    if (sup == null) {
        return Object.getOwnPropertyNames(n);
    }
    return Object.getOwnPropertyNames(n).concat(getAllPropertyNames(sup));
}

Array.prototype.unique = function() {
    var obj = {};
    this.forEach(function (elem) {
        obj[elem] = true;
    });
    return Object.getOwnPropertyNames(obj);
}
console.log(getAllPropertyNames(Date).unique());

GPU云服務器云服務器學習之substr() 深度學習之概要 webrtc學習之九 linux學習之centos

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

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

JavaScript學習之Object(下)new命令

摘要：命令作用作用是執行構造函數，返回實例對象上面例子是自定義一個構造函數，其最大的特點就是首字母大寫，用執行構造函數其中，在的執行下，代表了實例化后的對象，這個也就有屬性注意點如果不用執行構造函數，那么指向的是全局有兩種方式可以避免內部定義嚴格 new命令 new作用作用是執行構造函數，返回實例對象 function F() { this.name = object } var ...

Salamander 2019-08-23 12:14 評論0 收藏0
JavaScript學習之對象原型及繼承

摘要：原型要掌握這三者之間的關系，通過代碼例子記錄一下自身屬性的這里就是通過代碼看一下做了什么默認情況下，將的所有屬性包括繼承的賦值給有什么東西呢自己的原型鏈，添加一個屬性，用來指明對象的誰構造的自身全部屬性，這邊構建一個空對象原型，所以沒有自有原型要掌握這三者之間的關系prototype，constructor,__proto__通過代碼例子記錄一下 function F() { ...

妤鋒シ 2019-08-23 12:16 評論0 收藏0
JavaScript學習之JSON對象

摘要：原始類型的值只有四種字符串數值必須以十進制表示布爾值和不能使用和。字符串必須使用雙引號表示，不能使用單引號。數組或對象最后一個成員的后面，不能加逗號。 JSON對象補充記錄一下，有些方法很需要熟練記憶的 JSON對象的規定 JSON對象對值有嚴格的規定復合類型的值只能是數組或對象，不能是函數、正則表達式對象、日期對象。原始類型的值只有四種：字符串、數值（必須以十進制表示）、布爾值和...

banana_pi 2019-08-23 12:43 評論0 收藏0
Javascript學習之繼承

摘要：繼承是面向對象編程語言中的一個重要的概念，繼承可以使得子類具有父類的屬性和方法或者重新定義追加屬性和方法等。但是在中沒有類的概念，是基于原型的語言，所以這就意味著對象可以直接從其他對象繼承。繼承是面向對象編程語言中的一個重要的概念，繼承可以使得子類具有父類的屬性和方法或者重新定義、追加屬性和方法等。但是在Javascript中沒有類的概念，是基于原型的語言，所以這就意味著對象可以直接...

CHENGKANG 2019-08-21 15:34 評論0 收藏0
javaScript學習之隱式轉換

摘要：搬家篇三開胃菜因為大于等于的比較，不是相等的比較，所以值得注意的操作符一元操作符通過進行轉換其中包括號運算符，號運算符，都是經轉換邏輯運算符等價于將操作數進行布爾值類型轉換位操作當一邊操作數為時，可等價于操作數為由以下變化可以證得加號運算搬家篇三開胃菜 [] == ![] //true ==> == false 123 ^ [] ...

peixn 2019-08-23 12:04 評論0 收藏0