js中关于this的一个小问题

水深无声 2023-06-20 06:14 59阅读 0赞

我们平时在写代码的时候肯定少不了和this打交道，我们都认为this是指向自己，但是这句话其实是不完全正确的，可以看下面的代码：

function show(){ 
    			var a = 10;
    			console.log(this.a);
    		}
    		show();

这段代码并不会像大家想象中那样输出一个10，而是输出undefined，这是为什么呢，推翻了大家心中的this指向自己这个说法。再看下面这段代码：

function show(){ 
    				var a = 10;
    				console.log(this.a);
    			}
    			var a = 'golbal';
    			show();   //输出golbal

从上面可以看出这个this.a指向的是全局中的a，所以this应该说是指向调用他的那个作用域。

var obj = { 
    				
    				a: function(){ 
    					console.log(this);  //输出的是window
    				},
    				b:{ 
    					x: 20,
    					func: function(){ 
    						console.log(this);
    					}
    				}
    			}
    			
    			var c = obj.a;
    			
    			c();  //在window中调用

但是我们想让他指向自己而不是调用它的那个作用域怎么办呢，可以使用call方法

var obj = { 
    			
    			a: function(){ 
    				
    				console.log(this);
    				
    			},
    			b:{ 
    				x: 20,
    				func: function(){ 
    					console.log(this.x);
    				}
    			}
    		}
    		
    		
    		var c = obj.a;
    		c.call(obj.b)    //这里会输出20
    		c.call(obj.a);  //这里会输出ƒ (){console.log(this);} a函数本身

使用一个.call()函数就可以改变this的指向。除了这个函数之外还有和call()相同的apply()方法，另一个比较重要的也可以实现类似效果的是bind()方法 这是一个绑定函数。

发表评论取消回复

表情：

评论列表（有 0 条评论，59人围观）

还没有评论，来说两句吧...

相关阅读

相关 js中关于this的一个小问题

我们平时在写代码的时候肯定少不了和this打交道，我们都认为this是指向自己，但是这句话其实是不完全正确的，可以看下面的代码： function show(){

水深无声/ 2023年06月20日 06:14/ 0 赞/ 60 阅读

相关关于JS中this指向问题的探究

写在前面本篇文章的所有例子来源都是《JS设计模式与开发实践》这本书，写这篇文章之前也去查阅了很多关于this指向问题的探讨，包括但不仅仅有像阮一峰老师，还有很多的博主的

痛定思痛。/ 2023年02月20日 04:59/ 0 赞/ 17 阅读

相关 JS中的this指向问题

this（上下文对象）我们每次调用函数时，解析器都会将一个上下文对象作为隐含的参数传递进函数。使用this来引用上下文对象，根据函数的调用形式不同，this的值也

Dear 丶/ 2023年01月20日 11:48/ 0 赞/ 26 阅读

相关一个关于paintComponent的小细节问题

import java.awt.; import javax.swing.; public class TestPolyline extend

喜欢ヅ旅行/ 2022年08月27日 03:28/ 0 赞/ 323 阅读

相关关于列表的一个小问题

直接Po代码 <style> normal li{ border: 1px solid red; float: none; } left li{ border: 1p

灰太狼/ 2022年06月10日 14:14/ 0 赞/ 351 阅读

相关关于JS中this的几种方式

首先关于this的指向问题，关于this我们得分为非严格模式和非严格模式。在JS非严格模式下 1. 给元素的某一个事件绑定方法，当事件触发，方法执行的时候，绑定

朴灿烈づ我的快乐病毒、/ 2022年06月06日 09:13/ 0 赞/ 328 阅读

相关关于kafka连接的一个小问题

最近有一个项目中用到了java api连接kafka的代码，原来测试的时候：bootstrap.servers这个值一直写的是ip，然后生产和消费数据都没有问题，但在预发测试的

拼搏现实的明天。/ 2022年06月05日 08:42/ 0 赞/ 291 阅读

相关安卓setOnItemClickListener中关于Cursor的一个小问题

在之前拟定的业务需求中，涉及到获取调用listview中点击项数据的问题。先前的解决方法为：从头开始遍历获取，如果存在很多数据，会将每一条都处理一遍。 while

╰半夏微凉°/ 2022年05月15日 14:54/ 0 赞/ 324 阅读

相关关于kafka连接的一个小问题

最近有一个项目中用到了java api连接kafka的代码，原来测试的时候：bootstrap.servers这个值一直写的是ip，然后生产和消费数据都没有问题，但在预发测试的

╰+攻爆jí腚メ/ 2022年04月06日 11:42/ 0 赞/ 339 阅读

相关关于js中的This指向问题的介绍

关于js中的This指向问题的介绍 1、基本概念 MDN的官方解释：与其他语言相比，函数的 this 关键字在 JavaScript 中的表现略有不同，此外，在严格模式和...

红太狼/ 2020年06月06日 19:16/ 0 赞/ 839 阅读