14.proxy.html 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <script>
  10. /**
  11. * proxy 代理
  12. * const proxy = new Proxy(target,handler)
  13. * target 目标值
  14. * handler 代理过程中的一系列操作
  15. */
  16. let obj = {
  17. name:"Lucy"
  18. };
  19. const vase = new Proxy(obj,{
  20. get(target,key,prototype) {
  21. // target 代理值
  22. // key 修改的方法
  23. // phototype 原型对象
  24. console.log(target,'1')
  25. console.log(key,'2')
  26. console.log(prototype,'3')
  27. },
  28. set(target,key,prototype) {
  29. // target 代理值
  30. // key 要修改的项
  31. // phototype 代理的新对象
  32. console.log(target,'11')
  33. console.log(key,'22')
  34. console.log(prototype,'33')
  35. }
  36. })
  37. vase.name = "LiLi"
  38. console.log(vase.set)
  39. // console.log(vase.get);
  40. </script>
  41. </body>
  42. </html>