html中的this指向

最新推荐文章于 2022-09-14 18:44:57 发布

原创最新推荐文章于 2022-09-14 18:44:57 发布 · 1.4k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#html #前端

收录于

本文详细介绍了JavaScript中this的四种常见情况：浏览器环境、函数调用、构造函数和箭头函数，并强调了call、apply、bind方法如何影响this的指向。理解this的关键在于其上下文依赖，对于箭头函数的特例也做了说明。

一、this谁调用就指向谁

1.在浏览器中，this指向的对象是window

2.在函数中，this指向调用它的哪个对象

3.在构造函数中，this指向new出来的新对象

4.在箭头函数中的this比较特殊，箭头函数this是父系的this，不是调用时的this

5.call、apply、bind中的this被强行绑定在某个对象上

call:参数是单个使用

apply:参数是一个数组，在数组里可以挂载上参数

bind:使用时会强行改变this指向，不会改变其中的数据，而且需要在调用的时候加上一个括号

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

还是没了

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

html标签中的this使用介绍

12-13

如例：复制代码代码如下: <html> <head> [removed] function showHint(str){ alert(str) ; } [removed] </head> <body> <input type=”text” onkeyup=”showHint(this.value)”/> <!–此处，在html标签中的this代表的是此标签–> </body> </html> 运行结果为：当通过键盘向文本框中输入字符后，当按键抬起时（即当keyup事件发生后），会显示按下的字符。

参与评论您还未登录，请先登录后发表或查看评论

html中this的作用,HTML5前端之谈谈我对this的理解

weixin_31507527的博客

06-17

1501

原标题：HTML5前端之谈谈我对this的理解在全局作用域中声明的任何变量和函数默认都是作为window对象的属性而存在的this是在函数执行的过程中自动创建的一个指向一个对象的内部指针,this的指向不是固定的，会根据调用的不同，而指向不同的地方。两个方向1. 全局作用域中使用this全局作用域中使用this，也就是说不在任何函数体内部使用this，那么这个时候this就是指的 window。...

html中this的作用,JavaScript 中的 this ：工作原理和陷阱

weixin_36459429的博客

07-04

748

在 JavaScript 中，this 是一个相对难懂的特殊变量。因为它随处可用，而不仅仅是面向对象的编程中。本文将解释 this 是如何工作的，以及它可能导致问题的地方，并在文章的给出最佳实践。为了方便理解 this ，最好的方式是根据使用 this 的位置划分三种类型：在函数内部： this 是一个额外的隐含的参数。在函数外部(顶级作用域中)： this 在浏览器中指向全局对象；在 Node....

html关键字this,如何使用Javascript中的this关键字

weixin_35719380的博客

06-07

679

一、基本的：function doSomething(){alert(this.id);}alert(window.doSomething);//证明了doSomething是属于window的doSomething();//undefinedwindow.onload = function(){document.getElementById("div2").onclick = doSomethi...

HTML应用开发基础篇 - this 的使用

徐小mu的博客

12-18

676

this 是 JavaScript 语言的一个关键字，代表函数运行时，自动生成的一个内部对象。this 指向当前函数体的父级对象。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <bo...

HTML的onclick的this指向

思维小刀

05-31

4196

1.简述 <input type="button" value="modify" onclick="changeContent()"> 写在元素上onclick里面的函数changeContent，相当于函数直接调用，函数里面使用的this指向全局对象window，而不是指向该元素 <input type="button" value="修改" onclick="...

深圳HTML5培训：事件处理函数的this指向问题

莫安迪

08-08

156

深圳HTML5培训：事件处理函数的this指向问题区分普通函数与事件处理函数普通函数是直接调用的。不存在 this 指向问题，谁调用的，this 指向就是谁。普通函数没有事件对象 event 事件处理函数其实也是一个函数，只是他绑定在某个事件上。事件处理函数的 this 默认指向 undefined 解决this指向问题的4种办法直接在事件绑定的地方加上 .bind(this) 点我 ...

this 指向问题和 inner HTML

wzh15175194522的博客

06-09

166

点击事件 onclick 浏览器加载完成事件this 指向问题1.普通函数中 this 指向window2.构造函数中 this 指向实例化对象3.对象函数中 this 指向当前对象4.事件函数中 this 指向事件源inner text 和 inner HTML 的不同1.inner text 设置文本不能设置标签样式2.inner HTML 可以设置文本和标签有标签样式推荐使用...

html 函数 this,关于JavaScript中的this指向问题总结篇

weixin_42306503的博客

06-24

389

在javascript中this的指向一直是前端同事的心头病，也同时是各面试题的首选，现在我们就来总结一下js中this的指向。首先需要了解一下几个概念：1:全局变量默认挂载在window对象下2:一般情况下this指向它的调用者3:es6的箭头函数中，this指向创建者，并非调用者4:通过call、apply、bind可以改改变this的指向下面我们具体分析一下1:在函数调用时(非严格模式)co...

HTML的事件绑定、js的this指向以及闭包的问题

s1300352164的博客

12-29

815

一：html事件绑定 1.标签绑定直接在标签上添加需要绑定的事件 2.元素绑定获取页面内的标签元素，加以绑定事件 3.使用事件监听二：this指向 1.浏览器里，在全局范围内的this 指向window对象； 2.在函数中，this永远指向最后调用他的那个对象； 3.构造函数中，this指向new出来的那个新的对象；总结：谁调用它就指向谁这里举一个例子：在平常的工作环境中，为了更好的掌握this指向，我们可以 let vm = this 这里我们还可以直接...

html代码函数的表示什么意思,通常来说，JavaScript this 指向当前函数所操作的对象...

weixin_36269724的博客

06-07

303

JavaScript this 关键字通常来说，JavaScript this 指向当前函数所操作的对象。函数或方法声明的位置不同，会影响this关键字的含义。在方法中，this 指向当前方法所属的对象。假如单独运用，this 表示指向全局对象。在函数中，this 表示指向全局对象。函数中，严厉模式下， this 是 undefined 未被定义。在事件中，this 指向是接纳事件的元素。相似 ...

html js 获取this,JS 中几种处理’this’指向的方式

weixin_39684228的博客

06-09

742

随着函数使用场合的不同，this的值会发生变化。但是有一个总的原则，那就是this指的是，调用函数的那个对象。我喜欢在JS中更改函数执行上下文的指向，也称为 this 指向。例如，咱们可以在类数组对象上使用数组方法：const reduce = Array.prototype.reduce;function sumArgs() {return reduce.call(arguments, (sum...

html 函数里面this,ES6箭头函数中this指向谁？

weixin_39684052的博客

06-20

121

ES6箭头函数中this(1)默认指向定义它时，所处上下文的对象的this指向。即ES6箭头函数里this的指向就是上下文里对象this指向，偶尔没有上下文对象，this就指向window(2)即使是call，apply，bind等方法也不能改变箭头函数this的指向一些实例加深印象(1)hello是全局函数，没有直接调用它的对象，也没有使用严格模式，this指向windowfunction he...

HTML中箭头函数与this指向

m0_59843202的博客

05-28

649

学习目标： *如何正确的使用箭头函数 *箭头函数中this指向哪个对象一.HTML中函数的定义方法 let aaa = function(){} let bbb = {function(){}} let ccc = () => {} 二.箭头函数参数与代码 let sun= (num1,num2) =>{ return num1+num2 } ...

事件监听函数中的this

Hey firefly

06-17

2521

特别简单的一个html结构 <div class="test"> </div> 测试需求为点击显示this指向直接在标签中调用 <div class="test1" onclick="t();"> </div> function t(){ console.log(this); } 浏览器控制台结果在这种情况下，...

HTML 事件响应函数,HTML5：事件处理函数的this指向问题

weixin_39614675的博客

06-07

270

HTML5：事件处理函数的this指向问题区分普通函数与事件处理函数普通函数是直接调用的。不存在 this 指向问题，谁调用的，this 指向就是谁。普通函数没有事件对象 event事件处理函数其实也是一个函数，只是他绑定在某个事件上。事件处理函数的 this 默认指向 undefined解决this指向问题的4种办法直接在事件绑定的地方加上 .bind(this)点我使用箭头函数onClick...

html 中绑定事件 this的指向

weixin_34310369的博客

10-09

145

var m=function(){ alert(2); } var obj={ A:function(){ }, m:function(){ alert(3); }, B:function(){ var m=function(){ ...

08-原型对象中的this指向.html

m0_59556655的博客

09-14

131

【代码】08-原型对象中的this指向.html。

vue在html文件中结合axios时，axios的this指向为undefined解决

轻编程的博客

08-21

990

当vue与axios直接在html文件中使用的时候，位于axios的请求中的this指向并不是指向vue,而是指向window，如果在请求中直接用this获取data中的数据会出现undefined的问题，解决思路是将ES5的函数语法更换为箭头函数即可解决此问题，深层的原因就得深入去了解箭头函数和普通函数之间的区别了！案例： new Vue({ el: '#app', data:{ carousels: [], }, created() { axios.get('/a

html中调用js中的function_JS 中 this 在各个场景下的指向

weixin_30635707的博客

01-20

788

作者：Dmitri Pavlutin译者：前端小智来源：dmitripavlutin.原文的篇幅非常长，不过内容太过于吸引我，还是忍不住要翻译出来。我将原文分为上下两部分1. this 的奥秘很多时候, JS 中的 this 对于咱们的初学者很容易产生困惑不解。this 的功能很强大，但需要一定付出才能慢慢理解它。对Java、PHP或其他标准语言来看，this 表示类方法中当前对象的实例...