web-dev-qa-db-fra.com

Quelle est la différence entre window.console.log et console.log

Je viens de passer une interview. La première question qui m'a été posée était de savoir ce qu'est console.log(). J'ai répondu avec tant de confiance. Encore,

La deuxième question était, quelle est la différence entre window.console.log() et console.log(). J'étais sans voix. J'ai essayé de chercher dans Google et Stack Overflow. Je n'ai pas trouvé un article aussi utile pour comprendre la différence entre eux.

Toutes les pensées sont grandement appréciées.

javascriptconsole.log
32
Santosh

Dans un contexte de navigateur normal, il n'y a aucune différence. console est une variable globale, et tous les globaux sont des propriétés de l'objet window.

console.log(console.log==window.console.log) // true

Il y a quelques mises en garde, comme quand il n'est pas exécuté dans le navigateur, ou si la variable de console a été réaffectée. T.J. Crowder l'explique bien.

38
Scimonster

Si vous voulez dire dans l'environnement JavaScript du navigateur par défaut, il n'y en a aucun fourniwindow et console n'ont pas été masqués ou réaffectés.

Dans l'environnement JavaScript du navigateur par défaut, window est un global qui fait référence à l'objet global, qui est également l'objet window. L'objet global contient la plupart des globaux en tant que propriétés (il s'agissait de tous, mais dans ES2015, cela a changé; les globaux créés par let, const ou class ne sont pas des propriétés du objet global). Mais ce n'est pas vrai dans la plupart des environnements sans navigateur (NodeJS, par exemple, utilise global au lieu de window), ni même dans certains environnements de navigateur non par défaut (comme un environnement de travail Web, qui n'a pas window car ils ne peuvent pas accéder à la fenêtre). Ainsi, dans les environnements où window n'est pas défini, window.console.log Échouera là où console.log Ne le serait pas (à condition que l'environnement fournisse un console global).

Pour comprendre la différence, travaillons chacun d'eux à travers:

console.log(...) signifie:

  1. Le moteur JavaScript doit rechercher la liaison a pour l'identifiant console en commençant par le contexte d'exécution en cours, puis le suivant, puis le suivant, jusqu'à ce qu'il le trouve à portée globale.
  2. Il recherche ensuite la propriété log sur l'objet résultant.
  3. Ensuite, il l'appelle

window.console.log(...) signifie:

  1. Le moteur JavaScript doit rechercher la liaison a pour l'identifiant window en commençant par le contexte d'exécution en cours, puis le suivant, puis le suivant, jusqu'à ce qu'il le trouve à portée globale.
  2. Il recherche ensuite la propriété console sur l'objet résultant.
  3. Il recherche ensuite la propriété log sur l'objet résultant.
  4. Ensuite, il l'appelle

Ainsi, par exemple, voici un exemple où console a été masqué, et donc console.log Échoue alors que window.console.log Fonctionne:

function foo() {
  var console = 42;
  
  try {
    console.log("You WON'T see this.");
  } catch (e) {
  }

  try {
    window.console.log("You WILL see this.");
  } catch (e) {
  }
}
foo();
35
T.J. Crowder

Il n'y a aucune différence entre console.log Et window.console.log. Vérifiez MDN . Ils citent clairement -

L'objet Console est accessible à partir de n'importe quel objet global, Fenêtre sur les étendues de navigation, WorkerGlobalScope et ses variantes spécifiques dans les travailleurs via la console de propriétés. Il est exposé comme Window.console Et peut être référencé simplement comme console.


Ajoutant à cela, la question peut également avoir été-

Quelle est la différence entre console.log Et window.console.

La réponse à cela serait-

console.log Est utilisé pour la journalisation (comme vous le savez).

window.console Vérifie si la console est disponible (valeur truthy) afin que nous puissions nous connecter ensuite (dans le cas des navigateurs mobiles, ils ne prennent pas en charge le débogueur/console)

Le modèle commun dans le code pour cela est-

window.console && console.log(open_date);

Ce qui est essentiellement un code court pour -

if( window.console ) {
    console.log( open_date );
}
2
bozzmob