欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

this是怎么使用的?

程序员文章站 2022-03-19 18:00:55
...
(1)全局环境

在全局环境使用this,它指的就是顶层对象window

this === window // truefunction f() {  console.log(this === window); // true}
不管是不是在函数内部,只要是在全局环境下运行,this就是指顶层对象window

(2)构造函数

构造函数中的this,指的是实例对象。

var Obj = function (p) {  this.p = p;};Obj.prototype.m = function() {  return this.p;};

上面代码定义了一个构造函数Obj。由于this指向实例对象,所以在构造函数内部定义this.p,就相当于定义实例对象有一个p属性;然后m方法可以返回这个p属性。

(3)对象的方法

当A对象的方法被赋予B对象,该方法中的this就从指向A对象变成了指向B对象。所以要特别小心,将某个对象的方法赋值给另一个对象,会改变this的指向。

var obj ={  foo: function () {console.log(this);  }};obj.foo() // obj

obj.foo方法执行时,它内部的this指向obj

但是,只有这一种用法(直接在obj对象上调用foo方法),this指向obj;其他用法时,this都指向代码块当前所在对象(浏览器为window对象)。

// 情况一(obj.foo = obj.foo)() // window// 情况二(false || obj.foo)() // window// 情况三(1, obj.foo)() // window

obj.foo先运算再执行,即使它的值根本没有变化,this也不再指向obj了。

可以这样理解,在JavaScript引擎内部,objobj.foo储存在两个内存地址,简称为M1M2。只有obj.foo()这样调用时,是从M1调用M2,因此this指向obj。但是,上面三种情况,都是直接取出M2进行运算,然后就在全局环境执行运算结果(还是M2),因此this指向全局环境。

// 情况一(obj.foo = function () {  console.log(this);})()// 情况二(false || function () {  console.log(this);})()// 情况三(1, function () {  console.log(this);})()

同样的,如果某个方法位于多层对象的内部,这时为了简化书写,把该方法赋值给一个变量,往往会得到意料之外的结果。
var a = {  b: {m: function() {      console.log(this.p);},p: 'Hello'  }};var hello = a.b.m;hello() // undefined
上面代码中,m是多层对象内部的一个方法。为求简便,将其赋值给hello变量,结果调用时,this指向了顶层对象。为了避免这个问题,可以只将m所在的对象赋值给hello,这样调用时,this的指向就不会变。
var hello = a.b;hello.m() // Hello

(4)Node

在Node中,this的指向又分成两种情况。全局环境中,this指向全局对象global;模块环境中,this指向module.exports。

// 全局环境this === global // true// 模块环境this === module.exports // true




 

以上就是this是怎么使用的?的详细内容,更多请关注其它相关文章!

相关标签: this 使用