JS中this各种指向小结

2020-08-22 16:33:52 阅读：184 来源： 互联网

标签：obj name 指向小结 JS let times zhangsan undefined

此处分普通函数和箭头函数两种形式展开说明

01.在定义或调用对象时

let obj = {
  name: "zhangsan",
  showname() {
    return this.name;
  },
};

console.log(obj.showname()); //zhangsan

在对象的方法中，普通函数的this指向的是对象本身；

let obj = {
  name: "zhangsan",
  showname: () => {
    return this.name;
  },
};

console.log(obj.showname()); //undefined

箭头函数指向的是其父级所在作用域的this---windows，打印结果为undefined;

02.多层函数嵌套的时

let obj = {
  name: "zhangsan",
  printName: function (times) {
    function start(times) {
      for (let i = 0; i < 4; i++) {
        console.log(this.name);
        //undefined
        //undefined
        //undefined
        //undefined
      }
    }
    start(times);
  },
};

obj.printName(4);

此时普通函数指向的是window，所以打印了四次undefined，接下来试试箭头函数;

let obj = {
  name: "zhangsan",
  printName: function (times) {
    let start = (times) => {
      for (let i = 0; i < times; i++) {
        console.log(this.name);
        //zhangsan
        //zhangsan
        //zhangsan
        //zhangsan
      }
    };
    start(times);
  },
};

obj.printName(4);

由于this的父级作用域为printName所在作用域，此时的this指向obj，成功打印出zhangsan；

需要注意的是，有些系统提供的方法中，会让我们传如this，例如map和forEach等，下面是MDN的一些说明

标签：obj,name,指向,小结,JS,let,times,zhangsan,undefined
来源： https://www.cnblogs.com/dokom666/p/13546145.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

JS中this各种指向小结