Maison> interface Web> js tutoriel> le corps du texte

Comprendre le mot-clé « this »

PHPz
Libérer: 2023-08-30 17:05:09
original
874 Les gens l'ont consulté

Comprendre le mot-clé « this »

Lorsque vous créez une fonction, elle crée une portée nomméethis的关键字(在幕后),该关键字链接到函数运行的对象。换句话说,thisqui peut être utilisée pour sa fonction, mais c'est une référence à l'objet que la fonction a comme propriété ou méthode.

Regardons lescodyobjets de l'article précédent :

Exemple : sample98.html

Copier après la connexion

Remarquez comment, à l'intérieur de la fonctiongetGender, nous accédons à la propriétégenderen utilisant la notation par points (cody.gender) sur l'objetgetGender函数内部,我们如何在cody对象本身上使用点表示法 (cody.gender) 访问gender属性。可以使用this重写来访问cody对象,因为this指向codylui-même. L'objet

est accessible à l'aide de la substitution

car

pointe vers l'objet

.this.gender中使用的this

Exemple : sample99.html

Copier après la connexion
this的主题可能会令人困惑,但事实并非如此。请记住,一般来说, this在函数内部使用来引用该函数所包含的对象,而不是函数本身(例外情况包括使用 new关键字或 call()应用()

fait simplement référence à l'objet cody qui exploite la fonction.

this

).

Learguments和发送到函数的任何参数相反,thisMot-clé

ressemble et se comporte comme n'importe quelle autre variable, sauf que vous ne pouvez pas le modifier.

Contrairement auxargumentset à tous les arguments envoyés à une fonction,thissont des mots-clés (et non des propriétés) dans l'objet appelant/activant.

Comment est déterminée la valeur dethis

?

myObject对象被赋予一个名为 sayFoo 的属性,该属性指向sayFoo函数。当从全局范围调用sayFoo函数时,this引用window对象。当作为 myObject 的方法调用时,this指的是myObjectLa valeur de

transmise à toutes les fonctions est basée sur le contexte dans lequel la fonction est appelée au moment de l'exécution. Faites attention ici, car c'est une de ces bizarreries dont vous devez simplement vous souvenir.

myObject有一个名为fooL'objetmyObjectdans l'exemple de code suivant se voit attribuer une propriété nommée sayFoo, qui pointe vers la fonctionsayFoo. Lorsque la fonctionsayFooest appelée depuis la portée globale,

fait référence à l'objet

. Lorsqu'il est appelé comme méthode de myObject,

fait référence à myObject.

this的值基于调用该函数的上下文。考虑myObject.sayFoosayFoo都指向相同的函数。但是,根据调用sayFoo()的位置(上下文),thisUtilisé en raison des propriétés de

.

windowExemple : sample100.html

Copier après la connexion

Évidemment, la valeur de

est basée sur le contexte dans lequel la fonction est appelée. Considérez que myObject.sayFooet sayFoopointent tous deux vers la même fonction. Cependant, selon l'endroit où (contexte) sayFoo()est appelé, la valeur de

différera.

Si cela peut vous aider, voici le même code utilisant explicitement l'objet d'en-tête (thisarguments).


Exemple : sample101.html

Copier après la connexion
thisAssurez-vous que lorsque vous transmettez une fonction ou faites plusieurs références à une fonction, vous réalisez que la valeur de celle-ci changera en fonction du contexte dans lequel vous appelez la fonction.

Toutes les variables saufthis在一个包含在另一个函数中的函数内部使用时会发生什么。坏消息是在 ECMA 3 中,this迷失了方向并引用了头对象(浏览器中的windowetargumentsrespectent la portée lexicale

func2func3中的this迷失了方向,并且不是指向myObject

Le mot clé fait référence à l'objet d'en-tête dans la fonction imbriquée

Vous vous demandez peut-être ce qui se passe lorsque

est utilisé dans une fonction contenue dans une autre fonction. La mauvaise nouvelle est que dans ECMA 3,

s'est perdu et a référencé l'objet d'en-tête (l'objet

dans le navigateur) au lieu de l'objet où la fonction est définie.foo.func1时会发生什么。当在foo.func1(函数中的函数)内部调用匿名函数时,匿名函数内部的this

Dans le code ci-dessous, les

dansfunc2etfunc3sont perdus et pointent non pas versmyObjectmais vers l'objet principal.

Exemple : sample102.htmlthis

Copier après la connexion

La bonne nouvelle est que ce problème sera résolu dans ECMAScript 5. À présent, vous devriez être conscient de ce dilemme, surtout lorsque vous commencez à transmettre des fonctions en tant que valeurs à d'autres fonctions.

Considérez l'exemple suivant et ce qui se passe lorsque vous transmettez une fonction anonyme àfoo.func1. Lorsqu'une fonction anonyme est appelée dansfoo.func1(une fonction dans une fonction), la valeur

à l'intérieur de la fonction anonyme sera une référence à l'objet principal.

this值不会丢失,您可以简单地使用作用域链在父函数中保留对this的引用。以下示例演示了如何使用名为thatExemple : sample103.html

Copier après la connexion

Maintenant, n'oubliez jamais : la valeur

sera toujours une référence à l'objet principal lorsque sa fonction hôte est enveloppée dans une autre fonction ou appelée dans le contexte d'une autre fonction (encore une fois, cela est corrigé dans ECMAScript 5). Utilisez la chaîne de portée pour résoudre le problème des fonctions imbriquées Pour que la valeur ne soit pas perdue, vous pouvez simplement utiliser une chaîne de portée pour conserver une référence à dans la fonction parent. L'exemple suivant montre comment en utilisant une variable nommée thatet en exploitant sa portée, nous pouvons mieux suivre le contexte de la fonction. Exemple : sample104.html
Copier après la connexion

使用call()apply()控制this的值

this的值通常由调用函数的上下文确定(除非使用 new 关键字,稍后会详细介绍),但您可以使用this的值>apply()或call()来定义调用函数时this指向什么对象。使用这些方法就像在说:“嘿,调用 X 函数,但告诉该函数使用 Z 对象作为this的值。”通过这样做,JavaScript 确定this值的默认方式将被覆盖。

在下一个示例中,我们创建一个对象和一个函数。然后我们通过call()调用该函数,以便函数内this的值使用myObject作为其上下文。myFunction函数内的语句将使用属性填充myObject,而不是填充头对象。我们更改了this(在myFunction内部)引用的对象。

示例:sample105.html

Copier après la connexion

在前面的示例中,我们使用了call(),但也可以使用apply()。两者之间的区别在于函数参数的传递方式。使用call(),参数只是逗号分隔的值。使用apply(),参数值在数组内部传递,如以下示例所示。

示例:sample106.html

Copier après la connexion

这里您需要学习的是,您可以覆盖 JavaScript 在函数作用域中确定this值的默认方式。


在用户定义的构造函数中使用this关键字

当使用new关键字调用函数时,构造函数中声明的this的值指的是实例本身。换句话说:在构造函数中,我们可以在实际创建对象之前通过this来利用该对象。在这种情况下,this的默认值的更改方式类似于使用call()apply()

在下面的示例中,我们设置了一个Person构造函数,该函数使用this来引用正在创建的对象。当创建Person的实例时,this.name将引用新创建的对象,并在新对象中放置一个名为 name 的属性,并将参数 (name) 中的值传递给构造函数。

示例:sample107.html

Copier après la connexion

同样,当使用new关键字调用构造函数时,this指的是“将成为的对象”。如果我们没有使用new关键字,则this的值将是调用Person的上下文 - 在本例中为头对象。让我们看一下以下场景:

示例:sample108.html

Copier après la connexion

原型方法中的关键字this引用构造函数实例

当在添加到构造函数prototype属性的函数中使用时,this指的是调用该方法的实例。假设我们有一个自定义Person()构造函数。作为参数,它需要人的全名。如果我们需要访问人员的全名,我们将whatIsMyFullName方法添加到Person.prototype中,以便所有Person实例继承该方法。当使用this时,该方法可以引用调用它的实例(以及它的属性)。

这里我演示了创建两个Person对象(codylisa)以及继承的whatIsMyFullName方法,其中包含this关键字来访问实例。

示例:sample109.html

Copier après la connexion

结论

这里要带走的概念是that关键字 this 用于在prototype对象中包含的方法内部使用时引用实例。如果实例不包含该属性,则开始查找原型。

如果this指向的实例或对象不包含所引用的属性,则应用适用于任何属性查找的相同规则,并且将在原型链上“查找”该属性。因此,在我们的示例中,如果fullName属性未包含在我们的实例中,则将在Person.prototype.fullName中查找fullName属性,然后在Object.prototype.fullName中查找。

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!