一篇文章带你了解JavaScriptthis关键字

与其他语言相比，this关键字在JavaScript中的行为略有不同。JavaScript中，this关键字引用其所属的对象。根据使用位置，它具有不同的值。

成都创新互联专注于泰山企业网站建设,响应式网站开发,商城开发。泰山网站建设公司,为泰山等地区提供建站服务。全流程按需制作网站，专业设计，全程项目跟踪，成都创新互联专业和态度为您提供的服务

一、前言

方法中，this关键字引用其所属的对象。

this指的是全局对象在函数中。

this引用全局对象在函数中。

在严格模式下，this是未定义的在事件中。

this指的是接收事件的元素像call()和apply()这样的方法，可以将其引用到任何对象。

二、方法上下文

在对象方法中，this指代方法的user。

当调用user.getName()时，函数内部将this绑定到user对象：

例：

 
 
 
 

  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
在此示例中， user 对象是 getName 方法的所有者：
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
 
 
 
 

这里user对象是所有者getName的方法。

1. 全局上下文

在全局执行上下文中(在任何函数之外)，this无论是否处于严格模式下，都引用全局对象。

示例

 
 
 
 

  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
  
  
  
  
  
 
  
  
  
  
在全局执行上下文中(在任何函数之外)，这指的是全局对象:
 
  
  
  
  
 
  
  
  
  
访问调试在您的浏览器按F12，并选择"控制台"在调试器菜单:
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
 
 
 
 

在浏览器窗口中，全局对象是[object Window]。

2. 函数上下文

在函数内部，this值取决于函数的调用方式。由于以下代码不在严格模式下，this因此默认为全局对象，即浏览器中的[object Window]。

 
 
 
 

  
  
  
  
function myFunc() { 
  
  
  
  
return this; 
  
  
  
  
} 
 
 
 
 

在严格模式，然而this的值是undefined。

 
 
 
 

  
  
  
  
function myFunc() { 
  
  
  
  
"use strict"; 
  
  
  
  
return this; 
  
  
  
  
} 
 
 
 
 

因此，在严格模式下，如果执行上下文未定义它，则它将保持未定义状态。

三、this在DOM事件处理程序中

当一个函数用作事件处理程序时，this将被设置为触发事件的元素：

示例

 
 
 
 

  
  
  
  
let btn = document.querySelector("button"); 
  
  
  
  
 
  
  
  
  
btn.onclick = function() { 
  
  
  
  
this.style.display = "none"; 
  
  
  
  
}; 
 
 
 
 

从内联事件处理程序调用代码时，会将this设置为放置监听器的元素：

 
 
 
 

  
  
  
  
点击删除我 
 
 
 
 

四、显式函数绑定

call()和apply()方法是预定义的JavaScript方法。

它们都可以用于调用以另一个对象作为参数的对象方法。

箭头函数(=>)

在箭头函数(=>)中，this始终指向它被创建时所处的词法作用域中的this。全局代码中，它将被设置为全局对象：

五、总结

本文基于JavaScript 基础，介绍了this 关键字，与其他语言相比，this关键字在JavaScript中的行为略有不同，对this ，包括(全局，函数，函数绑定)常见的用法进行了详细的讲解。希望能够通过文章的学习，让读者更好的认识，学习JavaScript。

本文题目：一篇文章带你了解JavaScriptthis关键字
网站链接：http://www.shufengxianlan.com/qtweb/news1/550201.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联