Определите глобальную переменную в функции JavaScript - PullRequest
459 голосов
/ 26 апреля 2011

Можно ли определить глобальную переменную в функции JavaScript?

Я хочу использовать переменную trailimage (объявленную в функции makeObj) в других функциях.

<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>

Ответы [ 11 ]

689 голосов
/ 26 апреля 2011

Да, как уже говорили другие, вы можете использовать var в глобальной области видимости (вне всех функций) для объявления глобальной переменной:

<script>
var yourGlobalVariable;
function foo() {
    // ...
}
</script>

В качестве альтернативы, вы можете назначить свойство вwindow:

<script>
function foo() {
    window.yourGlobalVariable = ...;
}
</script>

... потому что в браузерах все глобальные переменные глобальные переменные, объявленные с var, являются свойствами объекта window.(В последней спецификации ECMAScript 2015 новые операторы let, const и class в глобальной области видимости создают глобальные переменные, которые не являются свойствами глобального объекта; новая концепция в ES2015.)

(Существует также ужас неявных глобалов , но не делайте этого нарочно и сделайте все возможное, чтобы избежать этого случайно, возможно, используя ES5 "use strict".)

Все это говорит: я бы избежал глобальных переменных, если вы можете (и вы почти наверняка можете).Как я уже упоминал, в конечном итоге они обладают свойствами window, а window уже достаточно многолюдно , что со всеми элементами с id (а многие с простоname) в него (и независимо от этой будущей спецификации IE создает дамп практически всего с name там).

Вместо этого, оберните ваш код в функцию определения объема и используйте переменные, локальные для этогоФункция определения объема и закрытие других функций внутри нее:

<script>
(function() { // Begin scoping function
    var yourGlobalVariable; // Global to your code, invisible outside the scoping function
    function foo() {
        // ...
    }
})();         // End scoping function
</script>
17 голосов
/ 16 ноября 2012

ОБНОВЛЕНИЕ1: Если вы читаете комментарии, есть хорошее обсуждение вокруг этого конкретного соглашения об именах.

ОБНОВЛЕНИЕ2: Кажется, что с тех пор, как мой ответ был опубликован, соглашение об именах стало более формальным.Люди, которые учат, пишут книги и т. Д., Говорят о var декларации и function декларации.

ОБНОВЛЕНИЕ3: Вот дополнительная статья в Википедии, которая поддерживает мою точку зрения: http://en.wikipedia.org/wiki/Declaration_(computer_programming)#Declarations_and_Definitions

...и ответить на главный вопрос.ОБЪЯВЛЯЙТЕ переменную перед вашей функцией.Это будет работать и будет соответствовать хорошей практике объявления ваших переменных в верхней части области:)

14 голосов
/ 26 апреля 2011

Просто объявите

var trialImage;

снаружи. Тогда

function makeObj(address) {
    trialImage = [address, 50, 50];
..
..
}

Надеюсь, это поможет.

10 голосов
/ 26 апреля 2011

Нет, вы не можете.Просто объявите переменную вне функции.Вам не нужно объявлять его одновременно с назначением значения:

var trailimage;

function makeObj(address) {
  trailimage = [address, 50, 50];
10 голосов
/ 26 апреля 2011

Просто объявите это вне функций и присвойте значения внутри функций. Что-то вроде:

<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

Или простое удаление «var» из имени вашей переменной внутри функции также делает его глобальным, но лучше объявить его снаружи один раз для более чистого кода. Это также будет работать:

var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;

function makeObj(address) {
    trailimage = [address, 50, 50];  //GLOBAL VARIABLE , ASSIGN VALUE

Надеюсь, этот пример объясняет больше: 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);
3 голосов
/ 26 апреля 2011

Очень просто определить переменную trailimage вне функции и установить ее значение в функции makeObj.Теперь вы можете получить доступ к его значению из любого места.

var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;
var trailimage;
function makeObj(address) {
      trailimage = [address, 50, 50];
      ....
}
2 голосов
/ 17 января 2014
    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;

Я понимаю, что в этом, вероятно, много синтаксических ошибок, но это общая идея ... Большое спасибо LayZee за указание на это ... Вы можете найти, что такое локальное и сессионное хранилище на http://www.w3schools.com/html/html5_webstorage.asp. Мне нужно то же самое для моего кода, и это была действительно хорошая идея.

0 голосов
/ 26 января 2016

Вот еще один простой способ сделать переменную доступной в других функциях без использования глобальных переменных:

function makeObj() {
  // var trailimage = 'test';
  makeObj.trailimage = 'test';
}
function someOtherFunction() {
  document.write(makeObj.trailimage);
}

makeObj();
someOtherFunction();
0 голосов
/ 24 июля 2015

Вот пример кода, который может быть полезен.

  var Human = function(){
   name = "Shohanur Rahaman";  // global variable
   this.name = "Tuly"; // constructor variable 
   var age = 21;
 };

  var shohan = new Human();

 document.write(shohan.name+"<br>");
 document.write(name);
 document.write(age); // undefined cause its local variable 

Здесь я нашел хороший ответ Как можно объявить глобальную переменную в JavaScript

0 голосов
/ 29 ноября 2013

Классический пример:

window.foo = 'bar';

Современный, безопасный пример, следуя наилучшей практике с использованием IIFE :

;(function (root) {
    'use strict'

    root.foo = 'bar';
)(this));

В настоящее время есть также возможность использования API WebStorage

localStorage.foo = 42;

или

sessionStorage.bar = 21;

Производительность, я не уверен, заметно ли он медленнее, чем сохранение значений в переменных.

Широко распространенная поддержка браузера, как указано в Можно ли использовать ...

...