资讯专栏INFORMATION COLUMN

使用JavaScript给对象修改注册监听器

妤锋シ / 2125人阅读

摘要:测试一下,在浏览器里执行上述代码,发现断点按照我们期望的被触发了从调用栈也能发现确实是这一行代码触发的断点,我们自己注册的属性修改监听器确实工作了。

我们在开发一些大型前端项目时,会遇到这样一种情况,某个变量上有个字段。我们想知道是哪一段程序修改了这个变量上的字段。比如全局变量window上我们自定义了一个新字段_name,我们想知道到底有哪些程序给这个字段赋了值。

一行行地调试肯定太费时间了。如果window这个变量的_name字段被程序赋值时,能执行我们自己实现的一个监听器,这样不就方便多了么?

监听器的实现很简单:



使用Object对象自带的方法defineProperty, 第一个参数为要监听的对象window,第二个参数为要监听的对象字段名称,_name。

第三个参数是一个对象,属性为set,意思是我们想监听window._name被赋值的这个事件。属性set的值为一个JavaScript函数,即我们自己定义的监听器。这个监听器,当window._name被其他JavaScript函数修改之后,就会触发。

测试一下,在浏览器里执行上述代码,发现断点按照我们期望的被触发了:

从调用栈也能发现确实是window._name = "2"这一行代码触发的断点,我们自己注册的属性修改监听器确实工作了。

要获取更多Jerry的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/108558.html

相关文章

  • 使用JavaScript对象修改注册听器

    摘要:测试一下,在浏览器里执行上述代码,发现断点按照我们期望的被触发了从调用栈也能发现确实是这一行代码触发的断点,我们自己注册的属性修改监听器确实工作了。 我们在开发一些大型前端项目时,会遇到这样一种情况,某个变量上有个字段。我们想知道是哪一段程序修改了这个变量上的字段。比如全局变量window上我们自定义了一个新字段_name,我们想知道到底有哪些程序给这个字段赋了值。 一行行地调试肯定太...

    snowLu 评论0 收藏0
  • 聊聊DOM中很重要的一个知识点:事件

    摘要:事件事件就是浏览器告知程序,用户的行为,用户点击了页面中的某个按钮或者用户输入用户名或密码等操作可以称为事件事件的类型事件根据使用的场景不同,可以分为如下几种依赖于设备的输入事件键盘事件和鼠标事件,这些事件都是直接和设备相关的独立于设备的输 事件 事件就是浏览器告知JavaScript程序,用户的行为,用户点击了HTML页面中的某个按钮或者用户输入用户名或密码等操作可以称为事件 事件的...

    church 评论0 收藏0
  • 理解vue中的组件(二)

    摘要:往往定义组件的构造器后,不需要手动的进行初始化,而是在其他组件的模板中当成标签来使用,这时候需要调用注册成组件。这样设计的目的是防止从子组件意外改变父级组件的状态,从而导致应用的数据流向难以理解。 上节说到组件https://segmentfault.com/a/1190000009236700,这一节继续来学习组件: 原文博客地址,欢迎学习交流:点击预览从github上获取本文代码:...

    Nino 评论0 收藏0
  • 浏览器内核之 HTML 解释器和 DOM 模型

    摘要:书接上文浏览器内核之资源加载与网络栈本文介绍的模型之后,深入的核心部分,剖析的解释器是如何将从网络或者本地文件获取的字节流转成内部表示的结构树。事件处理最重要就是事件捕获和事件冒泡这两种机制。 showImg(https://segmentfault.com/img/remote/1460000016215814); 微信公众号:爱写bugger的阿拉斯加如有问题或建议,请后台留言,我...

    Carbs 评论0 收藏0
  • 客户端的js js脚本的引入 js的解析过程

    摘要:浏览器中的浏览器中的通常称为客户端的客户端对象是所有客户端特性和的主要接入点。浏览器不会执行之间的代码中的事件处理程序当脚本所在的文件被载入的时候。可以达到延迟脚本的执行,直到文档载入和解析完成,才方可操作。 web浏览器中的JavaScriptweb浏览器中的js通常称为客户端的JavaScript 客户端 JavaScript window对象是所有客户端JavaScript特性和...

    李文鹏 评论0 收藏0

发表评论

0条评论

妤锋シ

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<