diff --git a/JavaScript/defineProperty/1.js b/JavaScript/defineProperty/1.js index 1537d2f..92cd90d 100644 --- a/JavaScript/defineProperty/1.js +++ b/JavaScript/defineProperty/1.js @@ -1,16 +1,16 @@ -let VchatInfo = {}; -let Input = document.getElementById('input'); -let introduceDom = document.getElementById('introduce'); -Object.defineProperty(VchatInfo, "introduce", { - get: function(){ - return introduceDom.innerHTML; - }, - set: function(introduce){ - introduceDom.innerHTML = introduce; - } -}); -VchatInfo.introduce = Input.value = "vchat是一个社交聊天系统"; -Input.oninput = function() { - VchatInfo.introduce = Input.value; - console.log(VchatInfo.introduce); -}; \ No newline at end of file +// let VchatInfo = {}; +// let Input = document.getElementById('input'); +// let introduceDom = document.getElementById('introduce'); +// Object.defineProperty(VchatInfo, "introduce", { +// get: function(){ +// return introduceDom.innerHTML; +// }, +// set: function(introduce){ +// introduceDom.innerHTML = introduce; +// } +// }); +// VchatInfo.introduce = Input.value = "vchat是一个社交聊天系统"; +// Input.oninput = function() { +// VchatInfo.introduce = Input.value; +// console.log(VchatInfo.introduce); +// }; \ No newline at end of file diff --git a/vue/mvvm/1.md b/vue/mvvm/1.md index 87a7408..11283a1 100644 --- a/vue/mvvm/1.md +++ b/vue/mvvm/1.md @@ -110,6 +110,7 @@ Object.keys(obj).forEach(k => { obj.say = '后来我试玩了一下,哇,好热血,蛮好玩的'; console.log(obj.name + obj.say); // 成龙大哥:其实我之前是拒绝拍这个游戏广告的,后来我试玩了一下,哇,好热血,蛮好玩的 +obj.eat = '香蕉'; // ** 没有响应 ``` 可以看见,`Object.defineProperty` 是对已有属性进行的劫持操作,所以 Vue 才要求事先将需要用到的数据定义在 data 中,同时也无法响应对象属性的添加和删除。被劫持的属性会有相应的 get、set 方法。 @@ -127,7 +128,7 @@ arr[0] = 'oh nanana'; // set ### Vue 源码实现 > 以下代码 Vue 版本为:2.6.10。 -#### observer +#### Observer 我们知道了数据劫持的基础实现,顺便再看看 Vue 源码是如何做的。 ``` javascript // observer/index.js @@ -1021,6 +1022,7 @@ Vue 提供的指令还有很多,比如:v-if,实际是将 dom 元素添加 ## 参考文章 * [剖析Vue实现原理 - 如何实现双向绑定mvvm](https://github.com/DMQ/mvvm) * [Vue 源码分析](https://github.com/HcySunYang/vue-design) +* **关于正则,推荐老姚的[《老姚 - JavaScript正则迷你书》](https://zhuanlan.zhihu.com/p/29707385),讲得非常易读** ## 交流群 > qq前端交流群:960807765,欢迎各种技术交流,期待你的加入