Définir une variable globale dans une fonction JavaScript
Est-il possible de définir une variable globale dans une fonction JavaScript?
Je veux utiliser la variable trailimage (déclarée dans la fonction makeObj) dans d'autres fonctions.
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<script type="text/javascript">
var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;
function makeObj(address) {
**var trailimage = [address, 50, 50];**
document.write('<img id="trailimageid" src="' + trailimage[0] + '" border="0" style=" position: absolute; visibility:visible; left: 0px; top: 0px; width: ' + trailimage[1] + 'px; height: ' + trailimage[2] + 'px">');
obj_selected = 1;
}
function truebody() {
return (!window.opera && document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body;
}
function hidetrail() {
var x = document.getElementById("trailimageid").style;
x.visibility = "hidden";
document.onmousemove = "";
}
function followmouse(e) {
var xcoord = offsetfrommouse[0];
var ycoord = offsetfrommouse[1];
var x = document.getElementById("trailimageid").style;
if (typeof e != "undefined") {
xcoord += e.pageX;
ycoord += e.pageY;
}
else if (typeof window.event != "undefined") {
xcoord += truebody().scrollLeft + event.clientX;
ycoord += truebody().scrollTop + event.clientY;
}
var docwidth = 1395;
var docheight = 676;
if (xcoord + trailimage[1] + 3 > docwidth || ycoord + trailimage[2] > docheight) {
x.display = "none";
alert("inja");
}
else
x.display = "";
x.left = xcoord + "px";
x.top = ycoord + "px";
}
if (obj_selected = 1) {
alert("obj_selected = true");
document.onmousemove = followmouse;
if (displayduration > 0)
setTimeout("hidetrail()", displayduration * 1000);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<img alt="" id="house" src="Pictures/sides/right.gif" style="z-index: 1; left: 372px;
top: 219px; position: absolute; height: 138px; width: 120px" onclick="javascript:makeObj('Pictures/sides/sides-not-clicked.gif');" />
</form>
</body>
</html>
Oui, comme d'autres l'ont dit, vous pouvez utiliser var au niveau global (en dehors de toutes les fonctions) pour déclarer une variable globale:
<script>
var yourGlobalVariable;
function foo() {
// ...
}
</script>
Vous pouvez également affecter une propriété à window:
<script>
function foo() {
window.yourGlobalVariable = ...;
}
</script>
... parce que dans les navigateurs, toutes les variables globales les variables globales déclarées avec var sont des propriétés de l'objet window. (Dans la dernière spécification, ECMAScript 2015, les nouvelles instructions let, const et class à la portée globale créent des éléments globaux qui ne sont pas des propriétés de l'objet global; un nouveau concept dans ES2015 .)
(Il y a aussi l'horreur des globaux implicites , mais ne le faites pas exprès et faites de votre mieux pour éviter de le faire par accident, peut-être en utilisant le "use strict" de ES5.)
Cela dit: j'éviterais les variables globales si vous le pouviez (et vous le pouvez presque certainement). Comme je l'ai mentionné, elles finissent par être les propriétés de window, et window est déjà plein à craquer Ce que tous les éléments avec un id (et beaucoup avec juste un name) y sont vidés (et quelle que soit la spécification à venir, IE jette à peu près tout ce qui a un name là-bas).
Enveloppez plutôt votre code dans une fonction de cadrage et utilisez des variables locales à cette fonction de cadrage; vos autres fonctions seront alors fermées:
<script>
(function() { // Begin scoping function
var yourGlobalVariable; // Global to your code, invisible outside the scoping function
function foo() {
// ...
}
})(); // End scoping function
</script>
UPDATE1: Si vous lisez les commentaires, il y aura une bonne discussion sur cette convention de dénomination particulière.
UPDATE2: Il semble que depuis que ma réponse a été publiée, la convention de nommage est devenue plus formelle. Les personnes qui enseignent, écrivent des livres, etc. parlent de la déclaration var et de la déclaration function.
UPDATE3: Voici le post supplémentaire de wikipedia qui soutient mon propos: http://en.wikipedia.org/wiki/Declaration_ (computer_programming) #Declarations_and_Definitions
... et pour répondre à la question principale. DECLARE une variable avant votre fonction. Cela fonctionnera et sera conforme à la bonne pratique de déclaration de vos variables en haut de la portée :)
Il suffit de déclarer
var trialImage;
à l'extérieur. ensuite
function makeObj(address) {
trialImage = [address, 50, 50];
..
..
}
J'espère que cela t'aides.
Non, tu ne peux pas. Il suffit de déclarer la variable en dehors de la fonction. Vous n'êtes pas obligé de le déclarer en même temps que vous attribuez la valeur:
var trailimage;
function makeObj(address) {
trailimage = [address, 50, 50];
Il suffit de le déclarer en dehors des fonctions et d'attribuer des valeurs à l'intérieur des fonctions. Quelque chose comme:
<script type="text/javascript">
var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;
var trailimage = null ; // GLOBAL VARIABLE
function makeObj(address) {
trailimage = [address, 50, 50]; //ASSIGN VALUE
Ou simplement supprimer "var" de votre nom de variable dans la fonction la rend également globale, mais il est préférable de la déclarer une fois en dehors du code plus propre. Cela fonctionnera également:
var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;
function makeObj(address) {
trailimage = [address, 50, 50]; //GLOBAL VARIABLE , ASSIGN VALUE
J'espère que cet exemple explique plus: http://jsfiddle.net/qCrGE/
var globalOne = 3;
testOne();
function testOne()
{
globalOne += 2;
alert("globalOne is : " + globalOne );
globalOne += 1;
}
alert("outside globalOne is : " + globalOne);
testTwo();
function testTwo()
{
globalTwo = 20;
alert("globalTwo is " + globalTwo);
globalTwo += 5;
}
alert("outside globalTwo is :" + globalTwo);
Il est très simple de définir la variable trailimage en dehors de la fonction et de définir sa valeur dans la fonction makeObj. Maintenant, vous pouvez accéder à sa valeur de n'importe où.
var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;
var trailimage;
function makeObj(address) {
trailimage = [address, 50, 50];
....
}
var Global = 'Global';
function LocalToGlobalVariable() {
//This creates a local variable.
var Local = '5';
//Doing this makes the variable available for one session
//(a page refresh - Its the session not local)
sessionStorage.LocalToGlobalVar = Local;
// It can be named anything as long as the sessionStorage references the local variable.
// Otherwise it won't work
//This refreshes the page to make the variable take effect instead of the last variable set.
location.reload(false);
};
//This calls the variable outside of the function for whatever use you want.
sessionStorage.LocalToGlobalVar;
Je me rends compte que cela contient probablement beaucoup d’erreurs de syntaxe, mais c’est l’idée générale ... Merci beaucoup à LayZee de nous l'avoir signalé ... Vous pouvez trouver en quoi consiste un stockage local et une session http: // www.w3schools.com/html/html5_webstorage.asp . J'ai eu besoin de la même chose pour mon code et c'était une très bonne idée.
Exemple classique:
window.foo = 'bar';
Exemple moderne et sûr suivant les meilleures pratiques en utilisant un IIFE :
;(function (root) {
'use strict'
root.foo = 'bar';
)(this));
De nos jours, il existe également la possibilité d’utiliser = WebStorage API
localStorage.foo = 42;
ou
sessionStorage.bar = 21;
Sur le plan des performances, je ne suis pas sûr que ce soit nettement plus lent que le stockage de valeurs dans des variables.
Prise en charge étendue du navigateur, comme indiqué sur Puis-je utiliser ...