Je možné definovat globální proměnnou ve funkci JavaScript?
Chci použít trailimage
proměnná (deklarovaná v makeObj
funkce) v jiných funkcích.
<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>
Odpověď
Jak řekli ostatní, můžete použít var
v globálním rozsahu (mimo všechny funkce a moduly) deklarovat globální proměnnou:
<script> var yourGlobalVariable; function foo() { // ... } </script>
(Upozorňujeme, že to platí pouze pro globální rozsah. Pokud by tento kód byl v modulu — <script type="module">...</script>
– nebylo by to na globální úrovni, takže by to nevytvářelo globální.)
Případně:
V moderních prostředích můžete objektu přiřadit vlastnost globalThis
odkazuje na (globalThis
byl přidán v ES2020):
<script> function foo() { globalThis.yourGlobalVariable = ...; } </script>
V prohlížečích můžete udělat totéž s globálním jménem window
:
<script> function foo() { window.yourGlobalVariable = ...; } </script>
…protože v prohlížečích všechny globální proměnné globální proměnné deklarované pomocí var
jsou vlastnosti window
objekt. (V nejnovější specifikaci, ECMAScript 2015, nový let
, const
a class
příkazy v globálním rozsahu vytvářejí globály, které nejsou vlastnostmi globálního objektu; nový koncept v ES2015.)
(Je zde také hrůza z implicitních globálů, ale nedělejte to schválně a snažte se, abyste to neudělali náhodou, třeba pomocí ES5 "use strict"
.)
Vše, co říkalo:Vyhnul bych se globálním proměnným, pokud můžete (a téměř jistě můžete). Jak jsem již zmínil, nakonec jsou vlastnostmi window
a window
je již dost dost přeplněné co se všemi prvky s id
(a mnoho jen s name
), který se do něj ukládá (a bez ohledu na tuto nadcházející specifikaci IE ukládá téměř cokoli s name
tam).
Místo toho v moderních prostředích použijte moduly:
<script type="module"> let yourVariable = 42; // ... </script>
Kód nejvyšší úrovně v modulu je v rozsahu modulu, nikoli v globálním rozsahu, takže se vytvoří proměnná, kterou může vidět celý kód v tomto modulu, ale není globální.
V zastaralých prostředích bez podpory modulů zabalte svůj kód do funkce určování rozsahu a použijte proměnné místní pro tuto funkci určování rozsahu a udělejte v ní uzavření ostatních funkcí:
<script> (function() { // Begin scoping function var yourGlobalVariable; // Global to your code, invisible outside the scoping function function foo() { // ... } })(); // End scoping function </script>