Declare Var in JavaScript: What It Means and How to Use It

Discover declare var in javascript, how hoisting and scope work, common pitfalls, and migration tips to let and const. Practical examples and best practices from JavaScripting.

JavaScripting Team

March 13, 2026·5 min read

JavaScript Tutorials Variables Learn JavaScript Frontend Syntax

Variable Declarations - JavaScripting — Photo by MJ555via Pixabay

declare var in javascript

Declare var in javascript refers to declaring a variable with the var keyword. It creates a function scoped binding and participates in hoisting, which can lead to undefined values if assigned later.

What declare var does in JavaScript

In JavaScript, declare var in javascript uses the var keyword to create a new binding in the current scope. If used inside a function, the variable is scoped to that function; if used outside any function, it becomes a global variable attached to the window object in browsers. This behavior makes var a flexible, but sometimes dangerous, tool for declaring variables. A key quirk is hoisting: the declaration is conceptually moved to the top of its scope during compilation, meaning you can reference the variable before its declaration. However, the value will be undefined until you assign it. This combination of scope and hoisting often leads to subtle bugs, especially in larger codebases or when combining multiple scripts.

Consider this simple example:

function greet() {
  console.log(name); // undefined
  var name = 'Alex';
  console.log(name); // Alex
}
greet();

Because of hoisting, the variable declaration is moved to the top of the function, but the assignment stays in place. As a result, the first console.log prints undefined, not a ReferenceError. Understanding this pattern helps you predict how your code will behave when you declare variables with var, and why many teams prefer newer keywords.

Hoisting and TDZ: Why order matters

Hoisting with var means the declaration is lifted, but the initialization stays put. This gives var a quirky behavior: you can reference the variable before it's assigned, but its value is undefined until you set it. In contrast, let and const introduced temporal dead zone TDZ: any reference before initialization throws a ReferenceError. This makes code easier to reason about and reduces accidental usage before assignment.

Example with var:

console.log(count); // undefined
var count = 1;

With let:

console.log(t); // ReferenceError
let t = 2;

The TDZ for let and const helps catch bugs early. If you're working on modern codebases, prefer let and const to avoid these surprises, and reserve var for older code or specific patterns where function scope is desired.

Var vs Let and Const: When to use each

Var has function scope, not block scope, which means variables declared inside a block are accessible outside that block if not inside a function. Re-declaration is allowed with var, which can overwrite previous bindings and lead to bugs. Let and const, by contrast, have block scope and do not allow re-declaration in the same scope. const also locks the binding to a value after initialization. In modern JavaScript development, let and const are generally preferred because they provide clearer scoping and reduce accidental global variable creation. However, var remains in the language for legacy code, libraries, and certain patterns where function scope is intentional. When integrating older scripts, be mindful of potential global leaks and conflicts with existing names.

Function scope versus block scope can affect loops and conditional blocks.
Re-declaration with var can shadow prior bindings and surprise readers.
Use let for variables that will change and const for values that should not be reassigned.

Var in practice: common pitfalls and debugging tips

Using var can unintentionally create global variables when declared outside a function, especially in scripts that load in non-module environments. Another pitfall is silent undefined values due to hoisting, which makes debugging harder. Tools such as ESLint with rules like no-var, and strict mode, can help catch these issues early. JavaScripting analysis shows developers often encounter scope surprises when migrating from var to let and const, underscoring the importance of consistent linting and code reviews. Always run in strict mode to avoid silent globals: 'use strict';

To debug effectively:

Enable strict mode in modules and scripts.
Use ESLint rules no-var and no-redeclare.
Prefer code reviews that flag global leaks and shadowing.
Test edge cases in loops and conditional blocks where var behaves differently from let.

Practical examples: migrating from var to let

Start by auditing your codebase for var declarations and consider replacing them with let or const where possible. If a variable is never reassigned, use const to communicate intent. Here are side-by-side examples:

// Before
var total = 0;
for (var i = 0; i < 5; i++) {
  total += i;
}
console.log(total);

// After
let total = 0;
for (let i = 0; i < 5; i++) {
  total += i;
}
console.log(total);

In the second example, i is block-scoped to the loop, preventing leaks beyond the loop body. This small shift reduces bugs and improves readability. For values that should not change, switch to const and rely on explicit reassignment only when necessary. If you must support legacy code, introduce migration gradually with clear documentation and testing.

Modern JavaScript habits and resources

Adopt a policy of favoring let and const for new code, and gradually refactor the legacy var code. Use strict mode to catch undeclared variables, ESLint with rules no-var and no-redeclare, and modern tooling in your build pipeline. Keep track of scope boundaries by naming conventions and modularizing code. Useful resources include MDN documentation and the ECMA-262 standard for authoritative definitions of var, let, and const. When in doubt, write a small, isolated example to prove how a declaration behaves in your environment and share the findings with your team.

AUTHORITY SOURCES and further reading

To deepen your understanding, consult primary references and standards. The following sources provide authoritative definitions and explanations of variable declarations in JavaScript:

Mozilla Developer Network Var reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var
Mozilla Developer Network Let reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let
Ecma International Ecma262 standard: https://262.ecma-international.org/12.0/

These sources help you verify behavior across environments and ensure your code adheres to modern JavaScript practices.

Questions & Answers

What is the difference between declare var and let?

Var declares a function scoped binding and is hoisted to the top of its scope, which can lead to undefined values before assignment. Let declares a block scoped binding and is not initialized until assigned, preventing certain class of bugs.

Why does var get hoisted in JavaScript?

With var, the declaration is moved to the top of the function or global scope during compilation. The assignment remains in place, so you may access the variable before its value is set, resulting in undefined.

Should I still use var in modern JavaScript?

In modern codebases, prefer let and const for clarity and safer scoping. Var remains for legacy code or specific patterns, but new projects should minimize its use.

Can declare var create global variables?

Yes, declaring var outside any function creates a global variable attached to the global object. This can clash with other code and lead to bugs, especially in large libraries.

What is the best practice for variable declarations?

Use let for variables that will change and const for values that should not be reassigned. Avoid global leaks by keeping declarations inside modules or functions and enable strict mode.