JS原生事件中this的指向

最新推荐文章于 2022-01-20 23:35:25 发布
最新推荐文章于 2022-01-20 23:35:25 发布
阅读量429 收藏 1
点赞数
分类专栏： JavaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_34481114/article/details/71001719
版权

 原生的 DOM.onclick =function(){

console.log(this) ;    //this指向调用这个函数的DOM对象

}


DOM.addeventListener(''click'',function(){

console.log(this) ;  //this也指向DOM对象,那是因为JS底层帮回调函数中的this的指向进进行了改变...

})


而ie8的DOM.attachEvent(onclick,function(){

console.log(this) //this 指向window,没有将this重新指向

})


fn.call(obj[i],i,obj[i])

qq_34481114
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
原生JS之this绑定规则，再也不用担心this指向问题了
Web_boom的博客
12-15 134
都是改变this指向的；第一个参数都是this要指向的对象；都可以利用后续参数传参；call和bind的参数是依次传参，一一对应的；但apply只有两个参数，第二个参数为数组；call和apply都是对函数进行直接调用，而bind方法返回的仍是一个函数；最近找到一个VUE的文档，它将VUE的各个知识点进行了总结，整理成了《Vue 开发必须知道的36个技巧》。内容比较详实，对各个知识点的讲解也十分到位。
原生javascript中this几种常见用法总结
10-15
下面我们将详细探讨原生JavaScript中`this`的几种常见用法。 1. **默认绑定**： 当函数作为独立的实体（全局作用域或没有明确上下文）调用时，`this`被绑定到全局对象。在浏览器环境中，全局对象通常是`window`。...
原生JS 之 this指向问题
hfdxmz_3的博客
06-17 303
平时用this有些混乱，所以写个总结。 没有箭头函数之前，我们说this就是函数运行时所在的环境对象，但是在箭头函数中this就是定义时所在的对象，先说大家熟知的：函数运行时所在的环境对象。 1、作为函数调用，this指向全局对象 2、作为对象的方法调用，该对象即为调用上下文，this指向该对象。 3、作为构造函数调用，构造函数试图初始化这个新创建的对象，并将这个对象作为其调用上下文，this 指向这个新创建的对象。 4、通过函数的call/apply方法间接调用,...
原生java_原生javascript中this几种常见用法总结
weixin_42134168的博客
02-22 118
本文实例讲述了原生javascript中this几种常见用法。分享给大家供大家参考，具体如下：this的应用 “是” 代名词this必须出现在函数里面//------------------默认绑定function test (){console.log(this.a);//1}var a = 1;test();this取得是window的对象a；此处默认window//-----------...
day08原生js this的用法
Fengwu9166的博客
09-25 217
1.this指向宿主对象 这种情况比较普遍，也就是指向宿主对象的情况，在客户端是 window对象 在node里是 Global对象 第一个说，下面看第二种。 2.this指向调用函数的对象的时候 这里的myObj()函数里面的 this 指向的就是obj这个外部传递来的对象了。注意看 obj.myObj() 这里前面的 obj. 这里，因为myObj是obj这个对象的方法，下面obj作为对象...
原生js中的this指向四条定律
qq_39588041的博客
05-10 721
1、函数执行，首先看函数名前面是否有"."，有的话"."前面是谁就是谁；没有的话this就是window function fn(){ console.log(this); } var obj = {fn: fn}; fn(); //this->window obj.fn();//this->obj 2、自执行函数中的this永远是window 3、给元素的某一个事件绑定方法，当事件触
详解JS构造函数中this和return
12-11
2.将构造函数中的Foo的this指向对象foo。 3.foo的_proto_属性指向Foo函数的prototype原型。 4.执行构造函数中的代码。 相对于普通函数，构造函数中的this是指向实例的，而普通函数调用中的this是指向windows的。 ...
vue学习笔记之给组件绑定原生事件操作示例
11-21
本文实例讲述了vue学习笔记之给组件绑定原生事件操作。分享给大家供大家参考，具体如下： 当在父组件中定义一个点击事件，并且在父组件的methods中定义了这个点击事件时，在页面上点击并不会有什么反应。那么该...
关于原生js中bind函数的简单实现
10-21
以下是对原生JS中`bind`函数简单实现的详细解释： 首先，我们要检查当前环境是否已经内置了`bind`函数，如果没有，我们将自定义一个： ```javascript if (!Function.prototype.bind) { Function.prototype.bind =...
vue绑定事件后获取绑定事件中的this方法
12-12
使用$event传递参数(事件本身) <input v-model="checknames" @change="changecheckbox(item,$event)" style="float: right" type="checkbox" :value="index" > changecheckbox(val,element) { console.log( element.currentTarget); if( element.currentTarget.checked){ ..... } } 以上这篇vue绑定事件后获取绑定事件中的this方法就是小编分享给大家的全部内容了
原生JavaScript之es6中Class的用法分析
10-15
当我们使用new关键字创建类的实例时，会自动调用构造函数，并将this指向新创建的对象。在上面的例子中，`var p = new Point(1, 2)`会创建一个Point类的新实例，并将x和y属性设置为1和2。 Class中的静态方法是通过在...
原生javascript中this通常的几种用法
mlonly的博客
12-24 8940
// this的应用  “是”  代名词 // this必须出现在函数里面 //------------------默认绑定 function test (){ console.log(this.a);//1 } var a = 1; test(); // this取得是window的对象a；此处默认window //---------------------隐士绑定？ func...
谈谈JavaScript中的this
lishichengyan的博客
04-28 261
1、函数调用 （1）在严格模式下（'use strict'），this是undefined。 （2）非严格模式下，此时this默认是全局对象，在浏览器中就是window，因此下面的代码将打印true： function f(){ console.log(this == window); } f(); 由于非严格模式下函数调用时this总是被绑定到全局对象，于是有可能出现下面的问题： ...
js实现点击事件以及this指向
weixin_51609337的博客
07-14 1552
首页写个button标签（div,p什么的也都可以） <button type="button">点击</button> 1.通过点击事件 let button = document.getElementsByTagName('button')[0]; button.onclick = function(){ console.log(this);//button } this指向接收事件的元素。 2.监听点击事件 let button = document.g.
JS中的this详解
热门推荐
weixin_42321292的博客
01-10 1万+
JS中的this 背景 JS中的this指向问题，一直以来自己并不是十分的清楚，平时在开发中使用时到是也能正常应用，但是对其使用和判断并不能信手拈来，所以自己搜索了一些资料，总结了一下，也希望对大家有所帮助。 目录 什么是this？ this的指向 为什么要使用this？ 什么的this？ this，从字面上含义是“这个”， 所以在JS中this表示的就是当前对象，但这个“当前对象”到底指的是哪个对象，是由运行时所在的上下文环境决定的。 简言之：当前是谁调用了我，我就指向谁； this：表示当前对象。
关于js中的this
qq_38713274的博客
04-05 201
文章目录this指向全局作用域中的this非箭头函数中的this箭头函数中的this特点事件绑定中的this定时器中的this构造函数中的thisthis 绑定形式默认绑定隐式绑定隐式丢失显式绑定三者异同new绑定特点this 特点 this指向 全局作用域中的this this ——> window 非箭头函数中的this 非箭头函数的 this 指向在函数被调用时绑定的，this ——> 调用的对象。 var obj = { fn1:function() { console.lo
js中的this详解
weixin_47450807的博客
01-20 1207
this的指向一直都是js中的一大难点，接下来将会从以下方面对this的指向进行总 结，包含一些面试题。 一、this的默认绑定 function foo() { console.log(this) //window } foo() function test1() { console.log(this) //window test2() } function test2() { console.log(this) //window test3() } function
事件监听函数中的this
Hey firefly
06-17 2293
特别简单的一个html结构 <div class="test"> </div> 测试需求为点击显示this指向 直接在标签中调用 <div class="test1" onclick="t();"> </div> function t(){ console.log(this); } 浏览器控制台结果 在这种情况下，...
原生js的click事件箭头函数
最新发布
06-09
在箭头函数中，this关键字会继承它所在上下文中的this值，而不是被单独定义。因此，你可以使用箭头函数来传递this参数，例如： ``` document.getElementById("myButton").addEventListener("click", () => { myFunction.call(this); }); ``` 在这个例子中，箭头函数被用作事件处理函数，它调用了一个叫做myFunction的函数，并通过call方法将this参数传递给它。由于箭头函数继承了它所在上下文中的this值，因此在箭头函数中使用this关键字时，它将指向你传递的参数。 需要注意的是，箭头函数不支持使用bind方法来绑定this参数，因为箭头函数的this值已经被绑定到了它所在的上下文中。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值