JavaScript Tutorial

The language for programming web pages.

JS Variables

JavaScript Variables

Variables are containers for storing data values. In JavaScript you can declare variables with var, let, or const.

Comparison:

	var	let	const
Scope	Function	Block	Block
Reassign	Yes	Yes	No
Hoisting	Yes	No	No
Redeclare	Yes	No	No

Best Practice: Use const by default, use let only when you need to reassign. Avoid var.

Try It Yourself

Edit the code below and click Run to see the result live.

Source Code

<!DOCTYPE html>
<html>
<body style="font-family:Arial; padding:20px;">
  <h2>JS Variables Demo</h2>
  <div id="out" style="background:#1e1e1e; color:#abb2bf; padding:15px; border-radius:8px; font-family:monospace; line-height:2;"></div>
  <button onclick="runDemo()" style="margin-top:10px; padding:10px 20px; background:#f7df1e; color:#1a1a2e; border:none; border-radius:5px; cursor:pointer; font-weight:bold;">▶ Run</button>

// let - block scoped
      let score = 0;
      score = 100; // can reassign

// const - cannot change
      const PI = 3.14159;
      // PI = 3; // ❌ This would throw an error!

// Different data types
      let num   = 42;
      let text  = "Hello World";
      let flag  = true;
      let empty = null;
      let undef;

document.getElementById("out").innerHTML = `
        var name = "${name}" (reassigned)<br>
        let score = ${score} (reassigned)<br>
        const PI = ${PI} (cannot change)<br>
        ─────────────────<br>
        Number: ${num}<br>
        String: "${text}"<br>
        Boolean: ${flag}<br>
        Null: ${empty}<br>
        Undefined: ${undef}
      `;
    }
  </script>
</body>
</html>

Result

Topics