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函数的更多相关文章

  1. 图片放大功能插件及jquery.extend函数理解

    前端时间,产品提出社区评论中的图片需要有放大功能.感觉可以共用,所以就想整合一个插件,过程中也借鉴了一些例子. 分析下自己的代码思路: var scaleImg = function(opts) { ...

  2. Jquery揭秘系列:实现$.fn.extend 和$.extend函数

    前面我们扩展了bind方法和ready函数,这次我要讲一下$.fn.extend 和$.extend函数. 其他的不多说,直接切入主题吧! 先来看看这两个函数的区别: $.fn.extend是为查询的 ...

  3. 解读jQuery中extend函数

    $.extend.apply( null, [ true, { "a" : 1, "b" : 2 } ] );//console.log(window.a); ...

  4. jquery的扩展之extend函数

    1.$.extend()使用 作用:扩展全局的函数 $.extend({ sayHellow:function(pram){ alert(pram+"hellow"); } }) ...

  5. jQuery.extend函数详细用法!

    最近在研究jQuery.把jQuery.extend扩展函数的用法记录下来. 1.扩展jQuery静态方法. }) 用法: $.test() 2.合并多个对象.为jQuery.extend(css1, ...

  6. 实现$.fn.extend 和$.extend函数

    Jquery揭秘系列:实现$.fn.extend 和$.extend函数   前面我们扩展了bind方法和ready函数,这次我要讲一下$.fn.extend 和$.extend函数. 其他的不多说, ...

  7. jQuery.extend 函数

    jQuery.extend 函数详解 JQuery的extend扩展方法: Jquery的扩展方法extend是我们在写插件的过程中常用的方法,该方法有一些重载原型,在此,我们一起去了解了解. 一.J ...

  8. 【转载】jQuery.extend 函数详解

    转载自:http://www.cnblogs.com/RascallySnake/archive/2010/05/07/1729563.html jQuery.extend 函数详解 JQuery的e ...

  9. jQuery.fn.extend() 函数详解

    jQuery.fn.extend()函数用于为jQuery扩展一个或多个实例属性和方法(主要用于扩展方法). jQuery.fn是jQuery的原型对象,其extend()方法用于为jQuery的原型 ...

随机推荐

  1. 记一次Linux修改MySQL配置不生效的问题

    背景 自己手上有一个项目服务用的是AWS EC2,最近从安全性和性能方面考虑,最近打算把腾讯云的MySQL数据库迁移到AWS RDS上,因为AWS的出口规则和安全组等问题,我需要修改默认的3306端口 ...

  2. 使用 media 实现响应式布局

    最近工作有一个需求是将一个界面改为响应式布局,由于UI还没有给设计,于是自己先查了一下资料做了一个demo.其实实现响应式布局的方式有很多,利用media实现就是其中一种,但是他也有一些缺点,比如说要 ...

  3. Git 实用技巧:git stash

    我们经常会遇到这样的情况: 正在dev分支开发新功能,做到一半时有人过来反馈一个bug,让马上解决,但是新功能做到了一半你又不想提交,这时就可以使用git stash命令先把当前进度保存起来.然后切换 ...

  4. property修饰关键字

    修饰符按作用区分:线程安全相关,内存相关,读写权限相关,set=和get=,是否可为空, class 一.默认值 @property NSArray *dataArray; 默认的是:atomic,s ...

  5. 如何使用python records 库优雅的操作数据库

    今天要介绍的这个python第三方库非常厉害,完美操作各种数据库.名字叫 records, 在网上很少有这个库的相关资料,但是在开源社区可是很火热的哦.如果这还不能打消你的顾虑,再告诉你一件事:如果你 ...

  6. Cassandra查询操作趟坑记录

    例子表 CREATE TABLE employee ( name TEXT, age SMALLINT, phone TEXT, bornDate DATE, createDate timestamp ...

  7. CentOS -- RocketMQ 4.3.2 standalone Installation and Configuration

    1 Download RockeMQ Package: You need to download it and put it to the OS Image. wget http://apache.c ...

  8. 一行js代码实现时间戳转时间格式

    javascript时间戳转换,支持自定义格式,可以显示年,月,周,日,时,分,秒多种形式的日期和时间. 推荐一个JavaScript常用函数库 jutils jutils - JavaScript常 ...

  9. txt 文件的归并和分割

    1.归并 import os # 1.获取需要整合的文件目录下的 filepath = "G:\\我的python\\尹成\\python基础\\day13\\详细分类\\详细地区" ...

  10. xcode7中搭建python开发环境

    1. 双击打开Xcode 2. 点击File->New->New Project 3. 在左边的面板选择Other,右边选择External Build Sytem,点击Next 4. 输 ...