什么是“this”在面向对象的JS中,我们了解到在JS中,一切都是对象。由于一切都是对象,我们开始明白我们可以设置和访问函数的其他属性。这提供了一种更优雅的方式来隐式“传递”对对象的引用。关于这个,我们常见的误解:认为this指向函数本身functionf1(){console.log(this)}f1()//window认为this指向函数作用域关于这两个误解,其实很多官方文档明确说明。调用函数的方式决定了this的值。那么this并不指向函数本身,也不指向函数的作用域,而是在运行时绑定,而不是在编写时绑定,它的上下文也依赖于调用函数时的各种条件。this的绑定与函数的声明位置无关,只与函数的调用方式有关。指向什么完全取决于函数在哪里调用,即谁调用,谁负责,bind()、apply()、call()是可以改变this指向的方法(这部分不是翻译原文,因为原文关于这个不是很详细,我觉得理解了这个之后,我就明白bind(),apply(),call()的用处了。所以这是我的粗略介绍基于《你不知道的JavaScript 上卷》的部分this有兴趣的可以看看那本书,里面讲的很详细)由它们的名称(可选,或者是匿名函数)和调用时执行的代码定义。但这不是全部事实,实际上函数看起来更接近于下图:现在,我将逐一介绍出现在每个函数中的这3种相似方法的示例。bind()的官方文档说:bind()方法创建一个新函数,调用时将其键设置为提供的值。这是非常强大的。它让我们在调用函数时明确定义它的值。让我们看看cooooode:varpokemon={firstname:'Pika',lastname:'Chu',getPokeName:function(){varfullname=this.firstname+''+this.lastname;返回全名;}};varpokemonName=function(){console.log(this.getPokeName()+'我选择你!');};varlogPokemon=pokemonName.bind(pokemon);//创建新对象并绑定pokemon。'this'ofpokemon===pokemonnowlogPokemon();//'皮卡丘我选你!'让我们分解一下。当我们使用bind()方法时:JS引擎正在创建一个新的pokemonName实例并将pokemon绑定到这个变量。重要的是要了解它复制了pokemonName函数。创建pokemonName函数的副本后,它可以调用logPokemon(),即使它最初不在pokemon对象上。它现在将识别其属性(Pika和Chu)及其方法。很酷的是,在我们bind()一个值之后,我们可以像使用任何其他普通函数一样使用该函数。我们甚至可以更新函数以获取参数并像这样传递它们:姓;返回全名;}};varpokemonName=function(snack,hobby){console.log(this.getPokeName()+'我选择你!');console.log(this.getPokeName()+'loves'+snack+'and'+hobby);};varlogPokemon=pokemonName.bind(pokemon);//创建新对象并绑定pokemon。'this'ofpokemon===pokemonnowlogPokemon('sushi','algorithms');//皮卡丘爱吃寿司和算法call(),apply()call()的官方文档说:call()方法使用给定的this值和单独提供的参数调用函数。这意味着,我们可以调用任何函数并在调用函数中显式指定this应该引用什么。真的很像bind()方法!这无疑使我们免于编写骇人听闻的代码。bind()和call()之间的主要区别是call()方法:1.接受附加参数2.立即执行它调用的函数。3.call()方法不复制调用它的函数。call()和apply()服务于完全相同的目的。它们之间的唯一区别是_call()需要单独传递所有参数,而apply()需要一个数组。示例:varpokemon={firstname:'Pika',lastname:'Chu',getPokeName:function(){varfullname=this.firstname+''+this.lastname;返回全名;}};varpokemonName=function(snack,hobby){console.log(this.getPokeName()+'loves'+snack+'and'+hobby);};pokemonName.call(pokemon,'sushi','algorithms');//PikaChu喜欢寿司和算法spokemonName.apply(pokemon,['sushi','algorithms']);//PikaChu喜欢寿司和算法这些内置方法存在于每个JS函数中,非常有用。即使您最终没有在日常编程中使用它们,您在阅读其他人的代码时仍然会经常遇到它们。
