<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <meta http-equiv="X-UA-Compatible" content="ie=edge" />

        <title>Object.defineProperty 监听对象属性变化</title>

    </head>

    <body>

        <script type="text/javascript">

            let obj = {}

            let value = ''

            Object.defineProperty(obj, 'name', {

                get: () => {

                    return value

                },

                set: (newVal) => {

                    console.log('检测到变化', newVal);

                    value = newVal;

                }

            })

            console.log(obj.name, ' 1')

            obj.name = 'mfg'

            console.log(obj.name, ' 2')

        </script>

    </body>

</html>

Object.defineProperty 监听对象属性变化的更多相关文章

  1. js 数据监听--对象的变化

    class Observer { constructor(data) { this.data = data; this.filterObj(data); } static isObject(obj) ...

  2. JS监听对象属性改变

    设想这么一个需求: user.name = '张三' 对user数据进行操作的时候,同步的修改页面上的用户名为张三. 这就是个数据绑定的概念. 针对这类需求 ES5提供了Object.definePr ...

  3. vue2.0使用watch监听对象属性

    二话不说直接代码,找了一个百度都没找到.... var head=new Vue({ data:{ checkBoxState:{//监听设置开关勾选状态 notice:true, sound:tru ...

  4. vue 2.0 watch 监听对象的变化

  5. AngularJS - Watch 监听对象

    <body> <div ng-app="myApp"> <div ng-controller="firstController"& ...

  6. vue--》如何使用wacth监听对象的属性变化？

    在开发过程中,我们经常需要监听watch监听一个对象的变化,但是如何来实现     监听对象中属性的变化呢? 先回顾一下如何监听整个对象的变化,使用watch就行了 export default { ...

  7. Vue之watch监听对象中某个属性的方法

    新建 userinfo = { name: "小明",  age: "18", } vue中watch监听name的方法 1. 可以结合计算属性的方法实现 { ...

  8. Proxy监听对象的数据变化，处理绑定数据很有用

    Proxy可以监听对象身上发生了什么事情,并在这些事情发生后执行一些相应的操作.一下子让我们对一个对象有了很强的追踪能力,同时在数据绑定方面也很有用处. }; //interceptor 拦截 var ...

  9. watch监听对象的属性

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. Python入门,以及简单爬取网页文本内容

    最近痴迷于Python的逻辑控制,还有爬虫的一方面,原本的目标是拷贝老师上课时U盘的数据.后来发现基础知识掌握的并不是很牢固.便去借了一本Python基础和两本爬虫框架的书.便开始了自己的入坑之旅 言 ...

  2. git fetch, git pull 以及 FETCH_HEAD

    git push. 这个很简单, 其实和后面的差不多, 这里就不讲了. 唯一需要注意的地方是: git push origin :branch2, 表示将一个内容为空的同名分支推送到远程的分支.(说白 ...

  3. NSDictionary , NSMutableDictionary, NSMutableDictionary 和 NSMutableSet)相当于java的map、set

    1 NSDictionary 和 NSMutableDictionary NSDictionary  :就是java中的map; 放入对象是键值对 key-value  , 同样 秉持了一样的原则,只 ...

  4. Linux Kernel 4.9 & BBR

    https://www.mxgw.info/t/linux-kernel-4-9-bbr.html?utm_source=tuicool&utm_medium=referral

  5. Visual SVN 企业版代码管理平台的建设

    通常需要完整的SVN的代码管理平台系统的搭建,需要安装三个文件,Visual SVN server  , TortoiseSVN, Visual SVN. Visual SVN server  企业版 ...

  6. java序列化 SerializeUtil

    import java.io.ByteArrayInputStream; import java.io.ByteArrayOutputStream; import java.io.Closeable; ...

  7. Eclipse NDK 配置，不用安装Cygwin

    一.关于NDK:NDK全称:Native Development Kit.1.NDK是一系列工具的集合.NDK提供了一系列的工具,帮助开发者快速开发C(或C++)的动态库,并能自动将so和java应用 ...

  8. Gradle Android最新自动化编译脚本教程

    转自:http://blog.csdn.net/changemyself/article/details/39927381 一.前言 Gradle 是以 Groovy 语言为基础,面向Java应用为主 ...

  9. 使用富文本OHAttributedLabel

    OHAttributedLabel 富文本标签 https://github.com/AliSoftware/OHAttributedLabel 以下是我渲染出来的效果 OHAttributedLab ...

  10. Virtualbox虚拟机安装CentOS 6.5图文详细教程

    http://blog.csdn.net/risingsun001/article/details/37934975