如果说想打印出来年龄，但是有没有年龄的这个key值

把创建年龄写在一个按钮上面

通过一个事件来做。


点击创建年龄的按钮，给obj.age设置为18，但是页面的双向绑定并没有显示出来。

因为不响应式，为什么vue不能发现了我改了age呢？？？因为vue是通过另外一个api。Object.defineProperty来做响应式 的

vue发现你有个name属性，于是就给这个name创建Property，会根据你get和set的时候去更新页面上的值。因为默认没有age属性，所以就不会去age进行get和set的拦截。

Object.defineProperty这个api的缺点是必须给它一个key。就是没有办法拦截不存在的key

只要以开始有这个key就可以了。哪怕值是undefined。只要有这个key是age就可以了

如果用proxy，就不必，必须要定义这个age的值了。

模拟改变值时的变化

建议买的课程是js深入浅出，并不是这套ES6的课程

结束

ES6深入浅出-13 Proxy 与 Reflect-3.Vue 3 将用 Proxy 改写的更多相关文章

  1. ES6深入浅出-13 Proxy 与 Reflect-1.Reflect 反射

    阮一峰  http://es6.ruanyifeng.com/#docs/reflect MDN有一些简陋的介绍 https://developer.mozilla.org/zh-CN/docs/We ...

  2. ES6深入浅出-13 Proxy 与 Reflect-2.Proxy 代理

    阮一峰http://es6.ruanyifeng.com/#docs/proxy MDN https://developer.mozilla.org/zh-CN/docs/Web/JavaScript ...

  3. ES6深入浅出_汇总贴

    H:\BaiDu\ES6深入浅出-wjw ES 6 新特性一览:https://frankfang.github.io/es-6-tutorials/ 我用了两个月的时间才理解 let https:/ ...

  4. es6学习笔记-Proxy、Reflect、Promise

    Proxy Proxy 用于修改某些操作的默认行为,等同于在语言层面做出修改,所以属于一种“元编程”(meta programming),即对编程语言进行编程. Proxy 可以理解成,在目标对象之前 ...

  5. ES6学习笔记四：Proxy与Reflect

    一:Proxy 代理. ES6把代理模式做成了一个类,直接传入被代理对象.代理函数,即可创建一个代理对象,然后我们使用代理对象进行方法调用,即可调用被包装过的方法: 1)创建 var proxy = ...

  6. es6之Proxy，Reflect

    Proxy 可以理解成,在目标对象之前架设一层“拦截”,外界对该对象的访问,都必须先通过这层拦截,因此提供了一种机制,可以对外界的访问进行过滤和改写. var proxy = new Proxy(ta ...

  7. ES6入门：数据劫持、Proxy、Reflect

    什么是数据劫持 Object数据劫持实现原理 Array数据劫持的实现原理 Proxy.Reflect 一.什么是数据劫持 定义:访问或者修改对象的某个属性时,在访问和修改属性值时,除了执行基本的数据 ...

  8. ES6 Proxy和Reflect（下）

    construct() construct方法用于拦截new命令. var handler = { construct (target, args) { return new target(...ar ...

  9. ES6 Proxy和Reflect (上)

    Proxy概述 Proxy用于修改某些操作的默认行为,等同于在语言层面做出修改,所以属于一种"元编程"(meta programming),即对编程语言进行编程. Proxy可以理 ...

随机推荐

  1. python中的logging日志模块

    日志是程序不可或缺的一部分.它可以记录程序的运行情况,帮助我们更便捷地发现问题,而python中的logging日志模块给我们提供了这个机会. logging给我们提供了五种函数用来输出日志:debu ...

  2. Linux PXE 网络装机

    一.基础网络建设 Linux配置静态IP-192.168.5.1 # vim /etc/sysconfig/network-scripts/ifcfg-eth0 DEVICE=eth0 ONBOOT= ...

  3. JSONObject例子

    说起JSON,大家就谈不上陌生了,因为对于数据传输语言,各位只认json,即使有XML语言,但是各位很少用吧.我也是,但是之前用过的json转换工具各种各样,我记忆中有过GSON(google).fa ...

  4. JS AJAX和JSONP的基础功能封装以及使用示例；

    1.代码: function ajax(options){ options = options || {}; options.type = options.type || "get" ...

  5. Greenplum FTS故障检测原理

    前言 FTS(Fault Tolerance Serve)是GreenPlum中的故障检测服务,是保证GP高可用的核心功能.GreenPlum的Segment的健康检测及HA是由GP Master实现 ...

  6. AtCoder Grand Contest 010题解

    传送门 \(A\) 判一下奇数的个数就行了 const int N=1e5+5; int a[N],n,res; int main(){ scanf("%d",&n); f ...

  7. UOJ73 【WC2015】未来程序

    题目描述:给出输入和暴力程序,求输出.共10个测试点. 测试点1: 输入\(a,b,c\),求\(a\times b \ \mathrm{mod} \ c\) \(a,b,c\)属于long long ...

  8. Go程序员面试算法宝典-读后感2-链表

    链表作为最基本的数据结构,它不仅仅在实际应用中有着非常重要的作用,而且也是程序员面试笔试必考的内容. 详情请Google吧. 1.如何实现链表的逆序 就地逆序 package main import ...

  9. Learning a Discriminative Feature Network for Semantic Segmentation（语义分割DFN，区别特征网络）

    1.介绍 语义分割通常有两个问题:类内不一致性(同一物体分成两类)和类间不确定性(不同物体分成同一类).本文从宏观角度,认为语义分割不是标记像素而是标记一个整体,提出了两个结构解决这两个问题,平滑网络 ...

  10. kubernetes（K8S）创建自签TLS证书

    TLS证书用于进行通信使用,组件需要证书关系如下: 组件 需要使用的证书 etcd ca.pem server.pem server-key.pem flannel ca.pem server.pem ...