js 箭头函数中的this

最新推荐文章于 2022-10-28 08:45:28 发布

大海里没有水

最新推荐文章于 2022-10-28 08:45:28 发布

阅读量84

点赞数

本文链接：https://blog.csdn.net/Anna_Liqi/article/details/123340411

版权

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <botton>天选之子</botton>
  </body>
  <script>
    let Dom = {
      site: "陈秀",
      bind: function () {
        const button = document.querySelector("botton");
        // // 方式一：
        button.addEventListener("click", (event) => {
          console.log(this); //{site: '陈秀', bind: ƒ}
          console.log(event.target); //<botton>天选之子</botton>
          console.log(this.site + event.target.innerHTML);
        });

        console.log("============");
        // 方式二：
        const self = this;
        button.addEventListener("click", function () {
          console.log(self.site + this.innerHTML);
        });
      },
    };
    Dom.bind();
  </script>
</html>