window.location versus just location

Question

Sur le web, je vois un grand nombre de programmeurs JavaScript qui écrivent window.location au lieu de simplement location . J'étais curieux de savoir si quelqu'un pouvait m'expliquer pourquoi. window est l'objet global, et il est donc inutile de l'inclure -- n'est-ce pas ? Je veux dire, vous ne voyez pas les gens écrire window.Math.floor o new window.Date() Je suis donc curieux de savoir pourquoi il serait spécifié avec location .

Je comprends que location est considéré comme une "propriété" de la fenêtre dans laquelle vous vous trouvez, ce qui, je suppose, a un certain sens. Mais même ainsi, je ne vois pas de raison de spécifier l'objet global ; il n'est pas possible d'écraser location en premier lieu, pas sans rediriger la page.

Alors, est-ce juste une bizarrerie qui a été utilisée pendant si longtemps qu'elle est devenue intégrée à la façon dont nous écrivons JavaScript, ou y a-t-il une raison tangible de faire les choses de cette façon ? J'ai consulté Google, mais hélas, je n'ai rien trouvé...

Answer 1

J'utilise toujours window.location dans mon code pour deux raisons principales :

1. C'est une bonne habitude d'éviter les variables globales autant que possible. L'utilisation du window. préfixe me rappelle que la variable est globale et que les autres ne le sont pas.
2. La nature de la portée de Javascript vous permet de remplacer les variables définies plus haut dans l'arbre de portée. Cela signifie que vous auriez pu définir var location quelque part dans une portée contenue (ce n'est pas un mot improbable à utiliser comme nom de variable) et vous travailleriez sur cette variable à la place.

Pour moi, la clarté de l'objectif lorsque je code est très importante car elle me permet d'éviter d'écrire des bogues et de les trouver lorsque je le fais.

Answer 2

En partie pour la sécurité au cas où quelqu'un définirait un location quelque part dans la chaîne de portée. window.location en fait une référence explicite à la propriété de window .

Exemple : http://jsfiddle.net/dr6KH/

(function() {
    var location = 'new value'; // creating a local variable called "location"

    (function() {
        alert(location);  // alerts "new value"

        alert(window.location);  // alerts the toString value of window.location
    })();

})();

Answer 3

Il y a une grande différence entre window.location et le natif Math y Date qui est que Math y Date sont des objets JavaScript natifs qui sont spécifiés pour exister en tant que propriétés de l'objet global, alors que window.location est une propriété de l window objet hôte (un objet hôte est un objet représentant un aspect de l'environnement, fourni par l'environnement, et n'est pas soumis aux mêmes règles que les objets JavaScript natifs. Les autres objets hôtes comprennent document et tout élément DOM).

window dans les navigateurs a deux fonctions : d'une part, agir en tant qu'objet global ECMAScript (bien spécifié), et d'autre part, agir en tant qu'objet hôte fournissant des informations sur l'environnement du navigateur. Pour les utilisations de window dans sa capacité d'objet hôte, je préfère être explicite et fournir l'adresse de l'objet hôte. window. préfixe : le fait que location fonctionne sans elle est juste une coïncidence qui vient de window La nature schizophrénique de l'enfant. De plus, comme l'ont souligné d'autres réponses, cela présente également l'avantage de vous protéger dans le cas où un autre membre de l'équipage de l'avion se rendrait coupable d'une infraction. location existe dans le contexte actuel.

Une bonne raison pour ne pas préfixer Date o Math con window. est que cela crée un code qui ne fonctionne pas dans un environnement autre que celui du navigateur. Les autres environnements ne fournissent généralement pas window comme un alias pour l'objet global.

Answer 4

Une partie du codage est la clarté. Contrairement à Math ou Date, l'emplacement est conceptuellement une propriété de la fenêtre, donc le code devient plus clair en l'incluant. Le préfixe "window." devrait idéalement être supprimé pour la minification.

Vous avez probablement raison de dire que la raison est en grande partie historique. Javascript a une longue histoire de copier et coller.

Answer 5

Ce n'est pas toujours une simple question de style - j'essayais de charger les boutons de médias sociaux de manière asynchrone après l'événement de chargement de la fenêtre en annexant des éléments script à un fragment, puis en annexant ce fragment au document. Le widgets.js de Twitter utilise location.href à plusieurs endroits et provoquait l'erreur suivante dans IE 8/9 : Appel inattendu à une méthode ou un accès à une propriété . Je n'ai pas trouvé pourquoi, mais cela ne se produit que lorsque vous visitez la page via un lien depuis une autre page. Si vous ajoutez simplement l'élément script à l'en-tête ou si vous utilisez l'élément window.location.href cela ne se produit pas, il semble donc qu'il s'agisse d'une bizarrerie avec IE 8/9 et createDocumentFragment() .

Exemple :

<a href="http://twitter.com/share" class="twitter-share-button" data-url="http://www.stackoverflow.com">Tweet</a>
<script>
(function (d, t) {
    var head = document.getElementsByTagName('head')[0];
    var frag = d.createDocumentFragment();
    var s = d.createElement(t);
    s.async = true;
    s.src = 'http://platform.twitter.com/widgets.js';
    frag.appendChild(s);
    head.appendChild(frag);
} (document, 'script'));
</script>