JS使用对象的defineProperty进行变量监控操作示例


Posted in Javascript onFebruary 02, 2019

本文实例讲述了JS使用对象的defineProperty进行变量监控操作。分享给大家供大家参考,具体如下:

以前觉得检测变量angular的$watch还挺好用的,但是一旦离开angular就无法下手了,今天看到一个方法,觉得挺好的,可能还

有别的办法,我会继续探索的

贴上代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
var data = {key:1};
Object.defineProperty(data, "key", {
set: function(value) {
value++
console.log(value)
}
});
// window.onload = function(){
// data.key = 2;
// data.key = 3;
// }
var num = 0;
var timer = setInterval(function(){
data.key = num;
num++;
},2000)
</script>
</body>
</html>

这样效果就出来了,截个图

JS使用对象的defineProperty进行变量监控操作示例

每隔两秒会打印一次,哈哈

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
用原生JavaScript实现jQuery的$.getJSON的解决方法
May 03 Javascript
在HTML代码中使用JavaScript代码的例子
Oct 16 Javascript
javascript制作的cookie封装及使用指南
Jan 02 Javascript
巧用Javascript的逻辑运算符
Dec 02 Javascript
VUE中使用Vue-resource完成交互
Jul 21 Javascript
解决vue-cli创建项目的loader问题
Mar 13 Javascript
vue移动端弹框组件的实例
Sep 25 Javascript
react-navigation之动态修改title的内容
Sep 26 Javascript
Vue传参一箩筐(页面、组件)
Apr 04 Javascript
微信小程序实现商城倒计时
Nov 01 Javascript
浅析JavaScript 函数柯里化
Sep 08 Javascript
JS前端轻量fabric.js系列物体基类
Aug 05 Javascript
详解Vue webapp项目通过HBulider打包原生APP(vue+webpack+HBulider)
Feb 02 #Javascript
通过cordova将vue项目打包为webapp的方法
Feb 02 #Javascript
用Cordova打包Vue项目的方法步骤
Feb 02 #Javascript
JS实现数组去重及数组内对象去重功能示例
Feb 02 #Javascript
JS实现的Object数组去重功能示例【数组成员为Object对象】
Feb 01 #Javascript
JavaScript动态创建二维数组的方法示例
Feb 01 #Javascript
Electron 如何调用本地模块的方法
Feb 01 #Javascript
You might like
PDO预处理语句PDOStatement对象使用总结
2014/11/20 PHP
php实现xml与json之间的相互转换功能实例
2016/07/07 PHP
PHP调试及性能分析工具Xdebug详解
2017/02/09 PHP
学习thinkphp5.0验证类使用方法
2017/11/16 PHP
PDO::lastInsertId讲解
2019/01/29 PHP
PHP封装mysqli基于面向对象的mysql数据库操作类与用法示例
2019/02/25 PHP
javascript 检测浏览器类型和版本的代码
2009/09/15 Javascript
关于可运行代码无法正常执行的使用说明
2010/05/13 Javascript
jQuery中prepend()方法用法实例
2014/12/25 Javascript
Javascript核心读书有感之类型、值和变量
2015/02/11 Javascript
JavaScript给url网址进行encode编码的方法
2015/03/18 Javascript
tuzhu_req.js 实现仿百度图片首页效果
2015/08/11 Javascript
JS实现可拖曳、可关闭的弹窗效果
2015/09/26 Javascript
Bootstrap布局方式详解
2016/05/27 Javascript
微信小程序 点击控件后选中其它反选实例详解
2017/02/21 Javascript
基于Bootstrap漂亮简洁的CSS3价格表(附源码下载)
2017/02/28 Javascript
JavaScript实现form表单的多文件上传
2020/03/27 Javascript
关于jquery form表单序列化的注意事项详解
2017/08/01 jQuery
Vue实例中生命周期created和mounted的区别详解
2017/08/25 Javascript
深入理解Vue父子组件生命周期执行顺序及钩子函数
2018/08/12 Javascript
微信小程序中上传图片并进行压缩的实现代码
2018/08/28 Javascript
详解python基础之while循环及if判断
2017/08/24 Python
windows下cx_Freeze生成Python可执行程序的详细步骤
2018/10/09 Python
在Pycharm中执行scrapy命令的方法
2019/01/16 Python
Python手绘可视化工具cutecharts使用实例
2019/12/05 Python
python游戏开发的五个案例分享
2020/03/09 Python
CSS3 选择器 基本选择器介绍
2012/01/21 HTML / CSS
CSS3实现多重边框的方法总结
2016/05/31 HTML / CSS
教学实验楼管理制度
2014/02/01 职场文书
师说教学反思
2014/02/07 职场文书
幼儿园课题实施方案
2014/05/14 职场文书
反腐倡廉警示教育活动心得体会
2014/09/04 职场文书
如何书写民事调解协议书?
2019/06/25 职场文书
MySQL数据库查询进阶之多表查询详解
2022/04/08 MySQL
Python日志模块logging用法
2022/06/05 Python