题解 | #监听对象#

监听对象

https://www.nowcoder.com/practice/2cd8f8421e9b42b98152f56ef5e0ac79

思路:遍历对象obj的每一个键,然后对该键设置Object.defineProperty方法进行监听,其中处理对象中,get方法直接返回键所对应的值,set方法直接将键设置为新值,并且触发_render函数进行渲染。

<script>
   var ul = document.querySelector('ul');
   var person = { sex: '男', age: '25', name: '王大锤', height: 28, weight: 32 };
   const _render = element => {
      var str = `<li>姓名:<span>${person.name}</span></li>
                 <li>性别:<span>${person.sex}</span></li>
                 <li>年龄:<span>${person.age}</span></li>
                 <li>身高:<span>${person.height}</span></li>
                 <li>体重:<span>${person.weight}</span></li>`
      element.innerHTML = str;
  }
  _render(ul);
  function observe(obj)
  {
      for(let key in obj)
      {
          let value=obj[key]
          Object.defineProperty(obj,key,{
          get()
          {
              return value
          },
          set(newValue)
          {
              value=newValue
              _render(ul)
           }
         })
      }
 }
 observe(person)
</script>

总结:Object.defineProperty是js内置的定义对象属性的方法,用来监听对象属性。Object.defineProperty(对象,要定义或者修改的属性名,描述对象),其中描述对象一般包含get函数获取属性值、set函数设置属性值。

#监听对象#
前端js面试 文章被收录于专栏

前端js面试,帮助你更好的理解js。

全部评论

相关推荐

06-10 23:36
已编辑
首都经济贸易大学 C++
点赞 评论 收藏
分享
07-01 23:23
郑州大学 Java
否极泰来来来来:牛客迟早有高三的
点赞 评论 收藏
分享
07-17 12:14
门头沟学院 Java
点赞 评论 收藏
分享
评论
4
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务