实现一个extend函数

Posted 一只菜鸟攻城狮啊

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了实现一个extend函数相关的知识,希望对你有一定的参考价值。

NOW,今天让我们来实现一个extend函数。

具体思路: 使用Object.defineProperty()对属性的特性进行设置,然后通过Object.getOwnPropertyDescriptor()获取到属性描述符,并赋值给新创建的对象

下面我们把代码拉出来溜溜

    Object.defineProperty(Object.prototype,
        "extend",
        {
            writable: true,
            enumerable: false,
            configurable: true,
            value: function(o){
                // 获取所有的自有属性
                var names = Object.getOwnPropertyNames(o);
                for(var i =0;i< names.length;i++){
                    // 如果属性已存在则跳过
                    if(names[i] in this) continue;
                    // 获取该属性的属性描述符ss
                    var desc = Object.getOwnPropertyDescriptor(o,names[i]);
                    Object.defineProperty(this,names[i],desc)
                }
            }
        }            
    )   

使用示例:

  // 定义一个新对象
    var a = {
        itemA: 1
    }
    // 新建一个属性,并设置属性描述符
    Object.defineProperty(a,"itemB",{
        writable: true,
        enumerable: false,
        configurable: true,
        value: 2
    })
    // 再定义一个新对象
    var b = {}
    b.extend(a)
    // 此时我们可以看到静态属性已经继承过去了
    console.log(b)  // 结果为{itemA: 1,itemB: 2}
    //再来看看属性描述符是不是也过去了
    let extendDesc = Object.getOwnPropertyDescriptor(b,"itemB")
    console.log(extendDesc)  // 结果为{value: 2, writable: true, enumerable: false, configurable: true}

好了,结束,有机会我们一起来模拟实现一下Object.create()函数

 

以上是关于实现一个extend函数的主要内容,如果未能解决你的问题,请参考以下文章

SQLite 片段函数实现不会在 TextView 中将文本格式化为 HTML

C#常用代码片段备忘

从零实现jQuery的extend

我的Android进阶之旅NDK开发之在C++代码中使用Android Log打印日志,打印出C++的函数耗时以及代码片段耗时详情

Vue利用Vue.extend()实现自定义弹出框

实用代码片段将json数据绑定到html元素 (转)