Наиболее подходящие глобальные переменные в javascript?

Question

У меня есть функция, которую я выполняю, когда нажимаю кнопку.
Я не хочу, чтобы пользователь дважды выполнял функцию в строке. Поэтому я использовал переменную window.
я сделал:

function a() { 
    if(window.infunction != undefined || window.infunction != null) { 
     return; 
    } 
    window.infunction = 'true';  
    //do stuff 
} 

Где-то еще (в другой нажатием кнопки) сбросить: window.infunction = undefined

Является ли это надлежащим образом использовать глобальные переменные (по крайней мере, для моих потребностей)?

Answer 1

Отключите кнопку или скройте ее, чтобы пользователь не смутился, почему кнопка ничего не делает после первого щелчка.

function a(e) { 
    e = e || window.event; 
    e = e.target || e.srcElement; 
    // disable element 
    e.disabled = true; 
} 

Вы должны просто отвязать вместо этого события.

function a(e) { 
    // unbind the event 
    e = e || window.event; 
    e = e.target || e.srcElement; 
    e.onclick = null; 
} 

Answer 2

Нет, нет никаких оснований использовать глобальные переменные для этого. Это просто достаточно просто обернуть весь код в функции, чтобы избежать загрязнения глобального пространства имен:

(function() { 
    //all your code here 
})(); 

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

HTML:

<button id="click_me">Click me</button> 

JavaScript:

function click_function() { 
    alert('You clicked the button with ID ' + this.id); 
} 

function click_listener() { 
    click_function.call(this); 
    this.removeEventListener('click', click_listener); 
} 

document.getElementById('click_me').addEventListener('click', click_listener); 

---

---

В качестве альтернативы, некоторые библиотеки JS позволяют легко создать обработчик, который будет активироваться только один раз. На самом деле, я очень рекомендую это: вам не нужно будет печатать почти столько же кода. Например, при использовании JQuery вы можете просто написать:

$('#click_me').one('click', function() { 
    alert('You clicked the button with ID ' + this.id); 
}); 

Это делает то же самое, что и выше код, за исключением того, он совместим с большим количеством браузеров, в том числе более старых версий IE.

Answer 3

Функции - это объекты. Они могут иметь такие свойства, как любые другие объекты:

function a(){ 
    if (a.executed) return; 
    a.executed = true; 

    //do stuff 
} 

Как @Ian, упомянутый в его комментарии, вы можете легко сделать функцию многоразовой. Это может быть преимуществом, а также недостатком такого подхода.

И как сказал, что @ Dave может быть достигнуто с закрытием:

var a = (function(){ 
    var executed = false; 

    return function(){ 
     if (executed) return; 
     executed = true; 

     //do stuff 
    } 
})();