Определите глобальную переменную в функции JavaScript
Можно ли определить глобальную переменную в функции 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>
18 ответов
Да, как сказали другие, вы можете использовать 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>
Просто объявить
var trialImage;
вне. затем
function makeObj(address) {
trialImage = [address, 50, 50];
..
..
}
Надеюсь это поможет.
ОБНОВЛЕНИЕ 1: Если вы читаете комментарии, есть хорошая дискуссия вокруг этого конкретного соглашения об именах.
ОБНОВЛЕНИЕ 2: Кажется, что с тех пор, как мой ответ был опубликован, соглашение об именах стало более формальным. Люди, которые учат, пишут книги и т. Д. Говорят о var декларация и function декларация.
ОБНОВЛЕНИЕ 3: Вот дополнительная статья в Википедии, которая поддерживает мою точку зрения: http://en.wikipedia.org/wiki/Declaration_(computer_programming)
... и ответить на главный вопрос. ОБЪЯВЛЯЙТЕ переменную перед вашей функцией. Это будет работать, и это будет соответствовать хорошей практике объявления ваших переменных в верхней части области видимости:)
Просто объявите это вне функций и присвойте значения внутри функций. Что-то вроде:
<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);
Нет, ты не можешь. Просто объявите переменную вне функции. Вам не нужно объявлять его одновременно с назначением значения:
var trailimage;
function makeObj(address) {
trailimage = [address, 50, 50];
В javascript есть три типа совков:
- Global Scoop: где переменная доступна через код.
- Block Scoop: где переменная доступна внутри определенной области, например функции.
- Local Scoop: где переменная доступна в более определенной области, например if-statement
Если вы добавите
Var перед именем переменной, Затем определяется совок, где он находится
пример:
var num1 = 18; // Global scope
function fun() {
var num2 = 20; // Local (Function) Scope
if (true) {
var num3 = 22; // Block Scope (within an if-statement)
}
}
num1 = 18; // Global scope
function fun() {
num2 = 20; // Global Scope
if (true) {
num3 = 22; // Global Scope
}
}
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. Мне нужно то же самое для моего кода, и это была действительно хорошая идея.
Классический пример:
window.foo = 'bar';
Современный, безопасный пример, основанный на передовом опыте использования IIFE:
;(function (root) {
'use strict'
root.foo = 'bar';
)(this));
В настоящее время есть также возможность использования API WebStorage
localStorage.foo = 42;
или же
sessionStorage.bar = 21;
Производительность, я не уверен, что это заметно медленнее, чем сохранение значений в переменных.
Широкая поддержка браузеров, как указано на Могу ли я использовать...
Да, ты можешь. Только не используйте var, не используйте let. Просто инициализируйте переменную, и она будет автоматически назначена глобальной:
function firstFunction() {
if (typeof(testVar) === "undefined") {testVar = 1;} //initializing variable if not initialized
testVar += 1;
console.log('Test variable inside 1st function: '+testVar);
}
function secondFunction() {
testVar += 1;
console.log('Test variable inside 2nd function: '+testVar);
}
firstFunction();
secondFunction();
testVar += 1;
console.log('Test variable outside: '+testVar);
Очень просто определить переменную trailimage вне функции и установить ее значение в функции makeObj. Теперь вы можете получить доступ к его стоимости из любой точки мира.
var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;
var trailimage;
function makeObj(address) {
trailimage = [address, 50, 50];
....
}
Все переменные, объявленные без "var" или "let" или чего-либо еще предшествующего им, например "const", являются глобальными. Так ....
function myFunction(){
myVar = "value"; // myVar is a global variable and can be used anywhere inside <script> tags.
}
Глобальные переменные объявляются вне функции для обеспечения доступности во всей программе, в то время как локальные переменные хранятся в функции с использованием var для использования только в пределах этой функции. Если вы объявляете переменную без использования var, даже если она находится внутри функции, она все равно будет считаться глобальной. Ссылки = https://www.freecodecamp.org/news/global-variables-in-javascript-explained/
В качестве альтернативы глобальным переменным вы можете использовать локальное хранилище браузеров (если не используете более старые версии). Вы можете использовать до 5 МБ этого хранилища. Код будет
var yourvariablevalue = 'this is a sample value';
localStorage.setItem("yourKeyvariablename", yourvariablevalue);
и это можно получить в любое время, даже после того, как вы уйдете и откроете его в другое время.
var yourvariablevalue = localStorage.getItem("yourKeyvariablename");
Надеюсь, это поможет вам!
Значит, вы хотите, чтобы переменная внутри функции была доступна вне функции? Почему бы не вернуть результаты переменной внутри функции?var x = function returnX { var x = 0; return x; } это идея...
<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;
return trailimage;
}
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>
Я не тестировал это, но если ваш код работал до этого небольшого изменения, то он должен работать.
Вот пример кода, который может быть полезен.
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
Использовать window объект - не лучшая идея. Как я вижу в комментариях
'use strict';
function showMessage() {
window.say_hello = 'hello!';
}
console.log(say_hello);
Это вызовет ошибку при использовании переменной say_hello, которую нам нужно сначала вызвать showMessage function.
Если вы делаете функцию запуска, вы можете определить глобальные функции и переменные следующим образом:
function(globalScope)
{
//define something
globalScope.something() {
alert("It works");
};
}(window)
Поскольку функция вызывается глобально с этим аргументом, здесь это глобальная область. Итак, что-то должно быть глобальным.
Вот еще один простой способ сделать переменную доступной в других функциях без использования глобальных переменных:
function makeObj() {
// var trailimage = 'test';
makeObj.trailimage = 'test';
}
function someOtherFunction() {
document.write(makeObj.trailimage);
}
makeObj();
someOtherFunction();