欢迎来到代码驿站!

JavaScript代码

当前位置:首页 > 网页前端 > JavaScript代码

JavaScript中的this关键词指向

时间:2022-11-11 09:43:40|栏目:JavaScript代码|点击:

1、es5中的this的指向

  • thisJavaScript的一个关键字,他是函数执行过程中,自动生成的一个内部对象,指当前的对象,只在当前函数内部使用。
  • es5this的指向取决于函数运行时的环境。
  • 没有直接挂载者(或称调用者)的函数中this,非严格模式下指向window,在use strict严格模式下,默认为undefined。以下都是在非严格模式下讨论
var name = 'hello window!';
var obj = {
  name: 'hello obj!',
  fn: function() {
    console.log(this.name);
  }
};
var fn = obj.fn;
fn();     // hello window!
obj.fn(); // hello obj!

obj.fn()在执行时,fn中的this指向的是当前的调用对象objfn()执行时,this指向的是window对象。

var fn = obj.fn; // 等价于 window.fn = obj.fn;
fn();            // 等价于 window.fn();

匿名函数的执行环境是全局的

var name = 'hello window!';
var obj = {
  name: 'hello obj!',
  fn: function() {
    console.log(this.name); // 'hello obj!'
    return function() {
      console.log(this.name); // 'hello window!'
    };
  }
};
obj.fn()();

2、es6中的this

  • es6箭头函数的特点
  • 箭头函数没有自己的this
  • 函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象,即外层代码的this引用。
  • 不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。
  • 没有arguments对象。如果要用,可以用Rest参数代替。
  • 不可以使用yield命令,因此箭头函数不能用作Generator函数

示例说明,修改上述示例代码中的函数为箭头函数:

// 示例代码1
var name = 'hello window!';
var obj = {
  name: 'hello obj!',
  fn: () => {
    console.log(this.name);  // 这里的this指向的外层的this,即window对象,想当于上打印的是console.log(window.name);
  }
};
var fn = obj.fn;
fn();       // hello window!
obj.fn();   // hello window!

// 示例代码2
var name = 'hello window!';
var obj = {
  name: 'hello obj!',
  fn: function() {
    console.log(this.name);   // hello obj!
    return () => {
      console.log(this.name); // hello obj!  // this指向外层的this,即obj对象
    };
  }
};
obj.fn()();

总结:

  • es5中的this主要看运行的环境,指向的是调用它的对象。
  • 箭头函数中的this是在一开始就固定的,并不受调用对象

上一篇:微信小程序中使用自定义字体的实现与体验优化

栏    目:JavaScript代码

下一篇:JavaScript获取URL参数的方法分享

本文标题:JavaScript中的this关键词指向

本文地址:http://www.codeinn.net/misctech/218696.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有