最早认识这个函数,源于对vue双向绑定的探索,vue通过这个函数实现属性挟持并结合发布者-订阅者模式实现双向绑定

先看一个实例:

var o= {name: 'a'}
Object.defineProperty(o, 'value', {
value: 3,
writable: true,
enumerable: true,
cofigurable: true
})
console.log(o.value) //3 

三个参数,分别是目标对象、属性名称、参数对象

value:属性值

writable:属性是否可改写,默认false

enumerable:是否可在for..in循环中被列举或通过Object.keys列举,默认false

cofigurable:总开关,设为false后其他属性无效,默认false

而此函数最主要的用法,在于其可以设置get、set函数对取值、赋值行为进行监控并操作,(可称之为属性挟持,这个属性被此函数强制掌控了!)

Object.defineProperty(o, 'value1', {
get: function(){
console.log("我挟持了获取操作")
return value1
},
set: function(newValue){
console.log("我挟持了赋值操作")
value1= newValue
}
})
o.value1= '1'
console.log(o.value1)

 

1

Object.defineProperty小解的更多相关文章

  1. javascript之Object.defineProperty的奥妙

    直切主题 今天遇到一个这样的功能: 写一个函数,该函数传递两个参数,第一个参数为返回对象的总数据量,第二个参数为初始化对象的数据.如: var o = obj (4, {name: 'xu', age ...

  2. Object.defineproperty实现数据和视图的联动

    Object.defineproperty语法 var o = {}; // 创建一个新对象 // Example of an object property added with definePro ...

  3. Vue 双向数据绑定原理分析 以及 Object.defineproperty语法

    第三方精简版实现 https://github.com/luobotang/simply-vue Object.defineProperty 学习,打开控制台分别输入以下内容调试结果 userInfo ...

  4. Object.defineProperty vs __defineGetter__ vs normal

    Testing in Chrome 31.0.1650.63 32-bit on Windows Server 2008 R2 / 7 64-bit Test Ops/sec Object.defin ...

  5. Object.defineProperty

    属性类型ECMA-262第5版在定义只有内部才用的特性(attribute)时,描述了属性(property)的各种特征.ECMA-262定义这些特性是为了实现JavaScript引擎用的,因此在Ja ...

  6. Object.defineproperty实现数据和视图的联动 ------是不是就是 Angular 模型和视图的同步的实现方式???

    参考:http://www.cnblogs.com/oceanxing/p/3938443.html https://developer.mozilla.org/zh-CN/docs/Web/Java ...

  7. 20+行代码使用es5 Object.defineProperty 实现简单的watch功能

    /** * 一个简单的demo 帮助理解defineProperty,只对Object类型参数有效 */ $watch=function(myObject,callback){ function in ...

  8. Object.defineProperty()方法的用法详解

    Object.defineProperty()函数是给对象设置属性的. Object.defineProperty(object, propertyname, descriptor); 一共有三个参数 ...

  9. 理解Object.defineProperty()

    理解Object.defineProperty() Object.defineProperty() 方法直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象. 基本语法:Obj ...

随机推荐

  1. Unity3D学习笔记——NGUI之UISlider

    UISlider:用于创建简单的滑动块和进度条,并且可以添加一个拇指按钮. 效果图如下: 一:使用步骤 1.从上面的效果看出,这个工具由四部分组成:背景图,进度图,进度lable显示,拇指按钮. 2. ...

  2. SlidingMenu官方实例分析4——AttachExample

    AttachExample这个类没有继承BaseActivity,而是FragmentActivity,写到这好像感悟到了 为什么官方现在都推荐使用Fragment而不是Activity,因为Frag ...

  3. 爬虫-python调用百度API/requests

    from urllib.request import urlopen import requests import json url = "http://apis.baidu.com/txa ...

  4. Laravel5.1 响应

    上篇笔记刚刚记录完请求 这节就来说说响应,一般来说啊 一个请求对应一个响应,用户都请求咱了 咱必须做一些逻辑后给人家反馈是不是,这就是响应. 1 基本的响应 我们前几篇笔记已经用过很多响应了,其中包括 ...

  5. 误: Apache shutdown unexpectedly解决办法

    from:http://www.wopus.org/wordpress-basic/getting-started/2536.htmlXAMPP错  2015年10月20日15:58:19 新手上路发 ...

  6. Charles常用设置

    一.软件说明 Charles 通过将自己设置成系统的网络访问代理服务器,使得所有的网络访问请求都通过它来完成,从而实现了网络封包的截取和分析. 二.mock数据 场景说明: 使用步骤: 1.保存待测试 ...

  7. hdu 4262(线段树)

    题目:有一个圈,可以从某个位置取球,给出原有的顺序,有三种操作,左旋一次,右旋一次,取球,要求按顺序取球,问需要操作多少次 显然操作是确定的,每次将目标球旋转过来,找出左旋和右旋操作少的,然后取球. ...

  8. [Spring Data MongoDB]学习笔记--牛逼的MongoTemplate

    MongoTemplate是数据库和代码之间的接口,对数据库的操作都在它里面. 注:MongoTemplate是线程安全的. MongoTemplate实现了interface MongoOperat ...

  9. 【转】哈希(Hash)与加密(Encrypt)的基本原理、区别及工程应用

    0.摘要 今天看到吉日嘎拉的一篇关于管理软件中信息加密和安全的文章,感觉非常有实际意义.文中作者从实践经验出发,讨论了信息管理软件中如何通过哈希和加密进行数据保护.但是从文章评论中也可以看出很多朋友对 ...

  10. 学习华为云SWR(CCE)服务的使用方法

    1.购买CCE服务-完成 SWR:https://www.huaweicloud.com/product/swr.html 2.购买ubuntu机器 https://console.huaweiclo ...