Change the value of a global variable inside of a function using JavaScript
Global variables can be accessed from inside and outside the function. They are deleted when the browser window is closed but are available to other pages loaded on the same window.
There are two ways to declare a variable globally:
- Declare a variable outside the functions.
- Assign a value to a variable inside a function without declaring it using the "var" keyword.
let count = 10;
function updateCount() {
// modifies the global variable
count = 20;
}
updateCount();
console.log(count);
This example demonstrates how to change and use global variables inside functions in JavaScript.
<body>
<h1 style="color:green">
GeeksForGeeks
</h1>
<b>Enter first number :- </b>
<input type="number"
id="fNum">
<br><br>
<b>Enter second number :- </b>
<input type="number"
id="sNum">
<br><br>
<button onclick="add()">Add</button>
<button onclick="subtract()">Subtract</button>
<p id="result"
style="color:green;
font-weight:bold;">
</p>
<script>
// Declare global variables
var globalFirstNum1 = 9;
var globalSecondNum1 = 8;
function add() {
// Access and change globalFirstNum1 and globalSecondNum1
globalFirstNum1 = Number(document.getElementById("fNum").value);
globalSecondNum1 = Number(document.getElementById("sNum").value);
// Add local variables
var result = globalFirstNum1 + globalSecondNum1;
var output = "Sum of 2 numbers is " + result;
// Display result
document.getElementById("result").innerHTML = output;
}
// Declare global variables
globalFirstNum2 = 8;
globalSecondNum2 = 9;
function subtract() {
// Access and change globalFirstNum2
// and globalSecondNum2
globalFirstNum2 = Number(document.getElementById("fNum").value);
globalSecondNum2 = Number(document.getElementById("sNum").value);
// Use global variables to subtract numbers
var result = globalFirstNum2 - globalSecondNum2;
var output = "Difference of 2 numbers is " + result;
document.getElementById("result").innerHTML = output;
}
</script>
</body>
Output:
