javascript里面_this和this有什么不同呢

首页 / 常见问题 / 低代码开发 / javascript里面_this和this有什么不同呢
作者:低代码工具 发布时间:24-12-30 09:36 浏览量:4570
logo
织信企业级低代码开发平台
提供表单、流程、仪表盘、API等功能,非IT用户可通过设计表单来收集数据,设计流程来进行业务协作,使用仪表盘来进行数据分析与展示,IT用户可通过API集成第三方系统平台数据。
免费试用

在JavaScript中,this关键字是一个非常重要的概念,它通常用于指向当前执行上下文(context)中的对象。而_this实际上不是JavaScript的一个预定义关键字,而是程序员为了解决this在不同执行上下文中可能发生改变的情况下而采用的一个变量命名惯例。_this通常用于保持对期望的this的引用、闭包中的this引用不会改变、this在回调中的指向保持一致性

在详细描述之前,需要理解this的工作机制。在JavaScript中,this的值在函数调用时确定,它取决于函数如何被调用。在普通函数调用中,this通常指向全局对象(在浏览器中是window),在方法调用中指向调用方法的对象,在构造函数中指向新创建的对象。当出现异步调用、回调函数、事件监听等情况时,函数中的this可能指向不同的对象或undefined(在严格模式下)。

让我们通过讨论一种情况来展开对this_this的详细描述:在对象方法中需要使用回调函数,并希望在这些回调函数中访问对象本身时,this可能不会按照预期指向该对象。

一、THIS_THIS在回调函数中的不同使用

当我们在某个对象的方法中定义一个定时器或回调函数时,这个回调往往会失去对原对象的this引用,因为它不是直接作为对象的方法被调用的。在这种情况下,程序员通常会使用一个变量(如_this)来存储对原始this的引用。

例子:

function MyObject() {

this.value = 42;

_this = this;

setTimeout(function() {

// 'this' here is 'window' or 'undefined' in strict mode

console.log(this.value); // undefined or error in strict mode

// '_this' still references to the 'MyObject' instance

console.log(_this.value); // 42

}, 1000);

}

在上面的例子中,我们用_this保存了方法被调用时this的值。这样即使在回调函数中,_this依然指向正确的对象。

二、在闭包中保持THIS的指向

当函数返回一个闭包时,这个返回的函数可能在其他地方执行,这时候通过_this可以保持对期望的this对象的引用。

典型应用:

function MyObject() {

this.value = 42;

_this = this;

this.deferredAction = function() {

// 此处闭包能够访问到`_this`

return function() {

console.log(_this.value);

};

};

}

在上述代码中,无论deferredAction()返回的函数在何处执行,它都能够通过_this访问MyObject实例中的value属性。

三、THIS_THIS在构造函数中的区别

在构造函数中使用this关键字,它指向新创建的对象实例。而_this通常不会在构造函数中使用,除非你需要在某个回调中引用刚刚创建的实例。

构造函数示例:

function MyObject() {

this.value = 42;

this.showValue = function() {

console.log(this.value);

};

}

在这个构造函数中,this显然指向通过new创建的新对象,使用_this在此背景下是多余的。

四、在框架和库中的THIS_THIS的使用

在现代的JavaScript框架和库中,比如React、Vue等,经常需要控制this指针来确保它指向正确的上下文。这时,_this变量或使用.bind(this)技术可以用来确保this的正确指向,尤其是在高阶组件、mixin或插件的代码中。

高阶组件示例:

function withLogging(WrappedComponent) {

return class extends React.Component {

componentDidMount() {

_this = this;

console.log(_this.props);

}

render() {

return <WrappedComponent {...this.props} />;

}

};

}

在上述高阶组件中,_this可以用来引用扩展自React.Component的当前实例。

总结来说,this是JavaScript中一个指向函数执行时的当前对象的关键字,而_this是一个常规变量,通常用于在特定的作用域中保留this的引用。以_this命名的变量并没有特别的作用或者含义 – 它只是一种变量命名习惯。

相关问答FAQs:

1. JavaScript中的_this和this有什么区别?
JavaScript中的_this是一个特殊的关键字,它代表当前执行上下文中的对象。而this则是指向对象本身的一个引用。_this是在函数内部使用的,而this则可以在任何地方使用。_this通常用于解决作用域问题,特别是在对象方法中使用闭包的情况下。

2. 为什么JavaScript中需要引入_this这个关键字?
JavaScript是一门灵活的语言,但是在某些情况下,由于作用域链的限制,this并不能始终指向所期望的对象。为了避免这个问题,引入了_this关键字,在函数内部可以通过_this来访问外部对象的属性和方法,确保不会出现作用域错误。

3. 如何正确使用_this关键字?
在JavaScript中正确使用_this关键字,首先要明确该关键字的指向。它的指向取决于函数的执行方式,比如作为对象的方法调用、构造函数的实例化、使用call()或apply()方法等。在函数内部使用_this时,可以通过使用箭头函数来绑定正确的上下文,也可以使用bind()、call()或apply()来显式地指定this的值。在编写代码时,合理使用_this关键字可以避免许多常见的错误和作用域问题。

最后建议,企业在引入信息化系统初期,切记要合理有效地运用好工具,这样一来不仅可以让公司业务高效地运行,还能最大程度保证团队目标的达成。同时还能大幅缩短系统开发和部署的时间成本。特别是有特定需求功能需要定制化的企业,可以采用我们公司自研的企业级低代码平台织信Informat。 织信平台基于数据模型优先的设计理念,提供大量标准化的组件,内置AI助手、组件设计器、自动化(图形化编程)、脚本、工作流引擎(BPMN2.0)、自定义API、表单设计器、权限、仪表盘等功能,能帮助企业构建高度复杂核心的数字化系统。如ERP、MES、CRM、PLM、SCM、WMS、项目管理、流程管理等多个应用场景,全面助力企业落地国产化/信息化/数字化转型战略目标。 版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们微信:Informat_5 处理,核实后本网站将在24小时内删除。

版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系邮箱:hopper@cornerstone365.cn 处理,核实后本网站将在24小时内删除。

最近更新

基于Vue的低代码开发平台:《Vue低代码开发平台》
01-15 13:58
低代码大屏:《低代码大屏开发技巧》
01-15 13:58
低代码Android:《低代码在Android中的应用》
01-15 13:58
Android低代码:《Android低代码开发实践》
01-15 13:58
中台低代码:《中台的低代码应用》
01-15 13:58
Vue低代码引擎:《Vue低代码引擎功能》
01-15 13:58
低代码中台:《低代码在中台中的应用》
01-15 13:58
移动端低代码框架:《移动端低代码框架选择》
01-15 13:58
常见的低代码平台:《常见低代码平台推荐》
01-15 13:58

立即开启你的数字化管理

用心为每一位用户提供专业的数字化解决方案及业务咨询

  • 深圳市基石协作科技有限公司
  • 地址:深圳市南山区科技中一路大族激光科技中心909室
  • 座机:400-185-5850
  • 手机:137-1379-6908
  • 邮箱:sales@cornerstone365.cn
  • 微信公众号二维码

© copyright 2019-2024. 织信INFORMAT 深圳市基石协作科技有限公司 版权所有 | 粤ICP备15078182号

前往Gitee仓库
微信公众号二维码
咨询织信数字化顾问获取最新资料
数字化咨询热线
400-185-5850
申请预约演示
立即与行业专家交流