Object.create()介紹

Zachary 發布于2019-08-23 13:59 / 983人閱讀

摘要：我們可以利用它們去實現數據的過濾和數據的綁定。實現一些簡單的的效果繼承的應用的實例繼承了的屬性劃重點相對于構造函數的繼承繼承實現了將的原型完美分隔。雙方不會互相影響。

Object.create(null) 創建的對象是一個空對象，在該對象上沒有繼承 Object.prototype 原型鏈上的屬性或者方法
例如：toString(), hasOwnProperty()等方法

參數	說明
obj	創建對象的原型，表示要繼承的對象
propertiesObject(可選 )	也是一個對象，用于對新創建的對象進行初始化

我們來看看底層實現

    Object.create =  function (o) {
        var F = function () {};
        F.prototype = o;
        return new F();
    };

下面我們來看具體應用：

    //創建一個Obj對象
    var Obj ={
        name:"mini",
        age:3,
        show:function () {
            console.log(this.name +" is " +this.age);
        }
    }

    //MyObj 繼承obj, prototype指向Obj
    var MyObj = Object.create(Obj,{
        like:{
            value:"fish",        // 初始化賦值
            writable:true,       // 是否是可改寫的
            configurable:true,   // 是否能夠刪除，是否能夠被修改
            enumerable:true      //是否可以用for in 進行枚舉
        },
        hate:{
            configurable:true,
            get:function () { console.log(111);  return "mouse" }, // get對象hate屬性時觸發的方法
            set:function (value) {                                 // set對象hate屬性時觸發的方法 
                console.log(value,2222);
                return value;
            }    
        }
    });

劃重點：這里get和set 方法似乎還蘊含更大的潛力。我們可以利用它們去實現數據的過濾和數據的綁定。實現一些簡單的mvvm的效果

Object.create繼承的應用：

    var A = function () { };
    A.prototype.sayName=function () {
        console.log("a");
    }

    // B的實例繼承了A的屬性
    var B = function () { };
    B.prototype = Object.create(A.prototype);
    var b = new B();
    b.sayName();  // a

劃重點：相對于構造函數的繼承Object.create繼承實現了將A,B的原型完美分隔 。雙方不會互相影響。這是Object.create亮點所在

GPU云服務器云服務器自我介紹平臺介紹相關介紹指令介紹

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

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

JavaScript ES5之Object.create函數詳解

介紹在創建對象的時候，我們有2種常用方法一個是文本標記法(var obj = {}),一種是運用Object函數進行對象的創建(new Object()). 但是這兩種方式并不是創建的一個完完全全干干凈凈的對象,這里的干凈只得是沒有繼承鏈. 幸運的是，ES5為我們提供了一種創建完全干凈的對象的方法，Object.create函數,接下我將向大家介紹Obje...

zhaofeihao 2019-08-21 10:35 評論0 收藏0
JS核心知識點梳理——原型、繼承（下）

摘要：引言上篇文章介紹原型，這篇文章接著講繼承，嘔心瀝血之作，大哥們點個贊呀明確一點并不是真正的面向對象語言，沒有真正的類，所以我們也沒有類繼承實現繼承有且僅有兩種方式，和原型鏈在介紹繼承前我們先介紹下其他概念函數的三種角色一個函數，有三種角色。 showImg(https://segmentfault.com/img/bVbo4hv?w=1800&h=1000); 引言上篇文章介紹原型，...

joyqi 2019-08-26 13:53 評論0 收藏0
犀牛書——CHAP6：對象

摘要：對象是屬性的無序集合。使用對象直接量創建的對象的原型就是，使用運算符創建的對象的原型是構造函數的的值。主要目的是將對象鎖定，避免外界干擾。判斷對象是否封閉。刪除屬性可刪除對象的自有屬性且為的屬性。對象是屬性的無序集合。因此，這一章主要從對象和屬性兩個方面來闡述。showImg(https://box.worktile.com/view/c8f5f376fe314aeca69d9b4c...

philadelphia 2019-08-19 18:40 評論0 收藏0
基于原型的JavaScript繼承 - 面向對象的JavaScript - JavaScript核心

摘要：基于原型的繼承誠惶誠恐的寫下這篇文章。無論是還是，都是面向對象的。將這個新對象作為構造函數的執行上下文其指向這個對象，并執行構造函數返回這個對象原型繼承我們來定義一個簡單的類和它的原型我們在原型上定義了一個方法。源碼： https://github.com/RobinQu/Programing-In-Javascript/blob/master/chapters/JavaScr...

Acceml 2019-08-19 14:51 評論0 收藏0
【JS基礎】Object 對象的原型概念詳解

摘要：使用操作符，創建一個對象，并且執行構造函數方法。使用可以返回一個字典型對象對象原型每一個對象都有一個內置的屬性指向構造它的函數屬性而構造函數的則指向構造函數本生。對象概念在 javascript 中, 一切引用類型均為對象。如 function Foo () {} 中，Foo本身就是一個對象的引用。創建對象方式字面量方式 new 構造函數函數聲明 Object.creat...

appetizerio 2019-08-22 14:05 評論0 收藏0