面对对象（四）对象的方法中this

1fe1se 发布于2019-08-26 10:09 / 1646人阅读

摘要：但是，下面这几种用法，都会改变的指向。情况一情况二情况三上面代码中，就是一个值。等同于上面代码中，是多层对象内部的一个方法。为求简便，将其赋值给变量，结果调用时，指向了顶层对象。

var obj ={
foo: function () {

console.log(this);

}
};

obj.foo() // obj
上面代码中，obj.foo方法执行时，它内部的this指向obj。
但是，下面这几种用法，都会改变this的指向。

// 情况一
(obj.foo = obj.foo)() // window
// 情况二
(false || obj.foo)() // window
// 情况三
(1, obj.foo)() // window
上面代码中，obj.foo就是一个值。这个值真正调用的时候，运行环境已经不是obj了，而是全局环境，所以this不再指向obj。

可以这样理解，JavaScript 引擎内部，obj和obj.foo储存在两个内存地址，称为地址一和地址二。obj.foo()这样调用时，是从地址一调用地址二，因此地址二的运行环境是地址一，this指向obj。但是，上面三种情况，都是直接取出地址二进行调用，这样的话，运行环境就是全局环境，因此this指向全局环境。上面三种情况等同于下面的代码。

上面三种情况等同于下面的代码。

// 情况一
(obj.foo = function () {
console.log(this);
})()
// 等同于
(function () {
console.log(this);
})()

// 情况二
(false || function () {
console.log(this);
})()

// 情况三
(1, function () {
console.log(this);
})()

2.this所在的方法不在对象的第一层（一个函数一层）

这时this只是指向当前一层的对象，而不会继承更上面的层

var a = {
p: "Hello",
b: {

m: function() {
  console.log(this.p);
}

}
};

a.b.m() // undefined
上面代码中，a.b.m方法在a对象的第二层，该方法内部的this不是指向a，而是指向a.b，因为实际执行的是下面的代码。

var b = {
m: function() {
console.log(this.p);
}
};

var a = {
p: "Hello",
b: b
};

(a.b).m() // 等同于 b.m()

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

GPU云服务器云服务器 js，对象中增加数据的方法面对对象 python面对对象 php面对对象设计

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/105686.html

面对对象（四）对象的方法中this

摘要：但是，下面这几种用法，都会改变的指向。情况一情况二情况三上面代码中，就是一个值。等同于上面代码中，是多层对象内部的一个方法。为求简便，将其赋值给变量，结果调用时，指向了顶层对象。 var obj ={ foo: function () { console.log(this); }}; obj.foo() // obj上面代码中，obj.foo方法执行时，它内部的this指向obj。但...

Betta 2019-08-26 10:09 评论0 收藏0
面对对象编程

摘要：也就是说，构造函数内部，指的是一个新生成的空对象，所有针对的操作，都会发生在这个空对象上。上面代码中，构造函数的语句，返回的是一个新对象。一、创建对象 1.构造函数var Vehicle = function () { this.price = 1000;}; var v = new Vehicle();v.price // 1000 new命令本身就可以执行构造函数，所以后面的构...

leeon 2019-08-26 10:09 评论0 收藏0
原生 js 实现面对对象版瀑布流

摘要：一一些闲话作为一个写静态的切图仔，其实日常工作中根本用不上瀑布流这种小清新，毕竟营销页面都是要求抢眼吸睛高大上文案爸爸说啥都对。昨上午闲着没事看到别人写的瀑布流的帖子，觉得很好玩的样子，然后决定上午就写一个试试。。。一、一些闲话作为一个写静态的切图仔，其实日常工作中根本用不上瀑布流这种小清新，毕竟营销页面都是要求抢眼__、__吸睛__、 __高大上（文案爸爸说啥都对）。昨上...

tommego 2019-08-23 14:01 评论0 收藏0
面对对象（三）this 关键字

摘要：涵义实质使用场合使用注意点避免多层避免数组处理方法中的避免回调函数中的绑定的方法参考链接涵义就是属性或方法当前所在的对象。上面代码是一个文本输入框，每当用户输入一个值，就会调用回调函数，验证这个值是否在指定范围。涵义实质使用场合使用注意点避免多层 this避免数组处理方法中的 this避免回调函数中的 this绑定 this 的方法 Function.prototype.call...

shenhualong 2019-08-26 10:09 评论0 收藏0
面对对象（三）this 关键字

摘要：涵义实质使用场合使用注意点避免多层避免数组处理方法中的避免回调函数中的绑定的方法参考链接涵义就是属性或方法当前所在的对象。上面代码是一个文本输入框，每当用户输入一个值，就会调用回调函数，验证这个值是否在指定范围。涵义实质使用场合使用注意点避免多层 this避免数组处理方法中的 this避免回调函数中的 this绑定 this 的方法 Function.prototype.call...

Euphoria 2019-08-26 10:09 评论0 收藏0