首頁  >  文章  >  web前端  >  JavaScript中Object.create()的用法介紹

JavaScript中Object.create()的用法介紹

不言
不言轉載
2018-12-10 17:45:423476瀏覽

這篇文章帶給大家的內容是關於JavaScript中Object.create()的用法介紹,有一定的參考價值,有需要的朋友可以參考一下,希望對你有所幫助。

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亮點所在

以上是JavaScript中Object.create()的用法介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:segmentfault.com。如有侵權,請聯絡admin@php.cn刪除