Un problème avec ce pointage en JS ? L'explication la plus complète de cela en 2018

Ce que cet article vous apporte concerne ce problème de pointage dans JS ? L'explication la plus complète de 2018 a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer, j'espère qu'elle vous sera utile.​

ceci, montre celui qui est appelé

Ceci dans le contexte mondial

console.log(this)  //这里的this是全局下的this, 因此这个this默认指向的是BOM的顶级对象window

ceci dans la fonction

var fn = function() {
	console.log(this)}fn()	//window

Voici ceci dans la fonction fn, et la fonction fn est appelée par fenêtre, donc ceci dans cette fonction pointe vers fenêtre

ceci dans l'objet

var obj = {
	name: 'zhang',
	fnObj: function() {
		console.log(this)
	}}obj.fnObj()  //obj

Une méthode fnObj est définie dans l'objet obj, et elle y est imprimée. Parce que fnObj est appelé par l'objet obj, cela pointe dans cette fonction vers son appelant obj.

ceci dans le constructeur

var func = function(ele) {
	console.log(this)  //func}var newFu = new func('p')

Ceci dans le constructeur pointe vers le constructeur lui-même

var func = function(ele) {
	this.box = document.querySelector('p')
	this.box.onclick = function() {
		console.log(this)   //p
	}}

Obtenez une étiquette dans le constructeur et ajoutez un événement à l'étiquette. Dans cet événement, cela pointe vers le p qui a appelé l'événement.

ceci en fonction flèche

Fonctions fléchées dans l'environnement DOM&BOM

Ceci dans la fonction flèche est hérité. C'est-à-dire que ceci dans la fonction flèche héritera du point this de son parent. Partout où ce point ci-dessus pointe, ceci dans la fonction flèche pointera.

var a = {
	b : function(){
		var func = ()=> {
			console.log(this);  //这里的this指向a这个对象
		}
		func();
	},
	c : 'Hello!'}a.b()

Le parent de la fonction flèche func est la fonction b. La fonction b est appelée par a, donc celle de la fonction b pointe vers a. Par conséquent, celle de la fonction flèche func héritera du point de this dans la fonction b. ne sera pas modifié par appliquer, appeler, lier

var a = {
  b : () => {
    console.log(this)   //指向window
    var func = ()=> {
      console.log(this);  //这里的this指向window
    }
    func();
  },
  c : 'Hello!'}a.b()

Le this de la fonction flèche func hérite de la fonction flèche b, et le this de la fonction flèche b hérite de son objet parent a. Parce que l'objet a est créé par window, this de la fonction flèche b pointe vers la fenêtre et la fonction flèche func hérite de la flèche. la fonction b. de ceci, pointe donc également vers la fenêtre

Fonctions fléchées dans l'environnement nodeJS

module.exports.b = 'haha'var b = 'asdvar a = {
  b: 'name',
  c: ()=>{
   console.log(this.b)  //haha
  }}a.c()

Le pointeur this dans la fonction flèche du nœud héritera également du pointeur this de son niveau supérieur, mais il n'y a pas d'objet window ici, mais pointe vers l'objet module.exports.

Ce qui précède est le problème avec ce pointage dans JS ? L'introduction la plus complète à cette explication de pointage en 2018. Si vous souhaitez en savoir plus sur le Tutoriel vidéo JavaScript, veuillez faire attention au site Web PHP chinois.

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!