JavaScript Variables Practice Programs with Solutions (32 Programs)

let testerName = 'Asha';
let experienceYears = 3;
console.log('Tester:', testerName);
console.log('Experience (years):', experienceYears);

Output

Tester: Asha
Experience (years): 3

Explanation: let declares a variable that holds a value. console.log prints its arguments separated by a space.

let browser = 'chromium';
console.log('Before:', browser);
browser = 'firefox';
console.log('After:', browser);

Output

Before: chromium
After: firefox

Explanation: variables declared with let can be reassigned. The second assignment replaces the old value.

const BASE_URL = 'https://qa.example.com';
try {
  BASE_URL = 'https://prod.example.com';
} catch (error) {
  console.log('Error:', error.message);
}
console.log('BASE_URL is still', BASE_URL);

Output

Error: Assignment to constant variable.
BASE_URL is still https://qa.example.com

Explanation: a const binding cannot be reassigned, so the assignment throws a TypeError. The original value stays unchanged.

let a = 10;
let b = 20;
console.log('Before swap: a =', a, 'b =', b);
let temp = a;
a = b;
b = temp;
console.log('After swap: a =', a, 'b =', b);

Output

Before swap: a = 10 b = 20
After swap: a = 20 b = 10

Explanation: the temporary variable keeps the first value safe while it is overwritten.

let first = 'login';
let second = 'logout';
[first, second] = [second, first];
console.log(first, second);

Output

logout login

Explanation: array destructuring builds a temporary array [second, first] and unpacks it back into the two variables in one step.

let passed = 42, failed = 3, skipped = 5;
let total = passed + failed + skipped;
console.log('Total tests:', total);

Output

Total tests: 50

Explanation: one let can declare several comma-separated variables. Readability usually favours one per line in real projects.

let result;
console.log(result);
console.log(typeof result);

Output

undefined
undefined

Explanation: a declared but unassigned variable holds undefined, whose type is also 'undefined'.

const user = 'qa_admin';
const role = 'Admin';
const message = `Logged in as ${user} (${role})`;
console.log(message);

Output

Logged in as qa_admin (Admin)

Explanation: template literals (backticks) insert variable values with ${...}.

let retryCount = 0;
retryCount = retryCount + 1;
console.log(retryCount);
retryCount += 1;
console.log(retryCount);
retryCount++;
console.log(retryCount);

Output

1
2
3

Explanation: x = x + 1, x += 1 and x++ all add one to a let variable.

const firstName = 'Ravi';
const _internalId = 101;
const $price = 499;
console.log(firstName, _internalId, $price);

Output

Ravi 101 499

Explanation: names may start with a letter, _ or $, and must not start with a digit. camelCase is the usual convention.

let status = 'outer';
if (true) {
  let status = 'inner';
  console.log('Inside block:', status);
}
console.log('Outside block:', status);

Output

Inside block: inner
Outside block: outer

Explanation: let is block-scoped, so the inner status exists only inside the braces and does not affect the outer one.

var status = 'outer';
if (true) {
  var status = 'inner';
  console.log('Inside block:', status);
}
console.log('Outside block:', status);

Output

Inside block: inner
Outside block: inner

Explanation: var is function-scoped, so both declarations refer to the same variable and the block overwrites it.

console.log('Before declaration:', environment);
var environment = 'staging';
console.log('After declaration:', environment);

Output

Before declaration: undefined
After declaration: staging

Explanation: var declarations are hoisted and initialised with undefined, so the first log prints undefined instead of throwing.

try {
  console.log(timeout);
  let timeout = 30000;
} catch (error) {
  console.log(error.name + ': ' + error.message);
}

Output

ReferenceError: Cannot access 'timeout' before initialization

Explanation: let and const are hoisted but not initialised. Using them before the declaration throws a ReferenceError (the temporal dead zone).

const settings = { headless: true, retries: 0 };
settings.retries = 2;
console.log(settings);

Output

{ headless: true, retries: 2 }

Explanation: const stops reassignment of the variable, not changes to the object it points to.

const config = Object.freeze({ browser: 'chromium', workers: 4 });
config.workers = 8;
console.log(config.workers);
console.log(Object.isFrozen(config));

Output

4
true

Explanation: Object.freeze makes properties read-only. In non-strict code the assignment is silently ignored.

const withLet = [];
for (let i = 0; i < 3; i++) withLet.push(() => i);
const withVar = [];
for (var j = 0; j < 3; j++) withVar.push(() => j);
console.log('let:', withLet.map(f => f()));
console.log('var:', withVar.map(f => f()));

Output

let: [ 0, 1, 2 ]
var: [ 3, 3, 3 ]

Explanation: let creates a new binding for each loop iteration. var shares one variable, so every function sees its final value 3.

const level = 'file';
{
  const level = 'block';
  {
    const level = 'nested block';
    console.log(level);
  }
  console.log(level);
}
console.log(level);

Output

nested block
block
file

Explanation: an inner declaration shadows outer ones with the same name. Each scope sees its nearest declaration.

let originalTimeout = 5000;
let copiedTimeout = originalTimeout;
copiedTimeout = 10000;
console.log('original:', originalTimeout);
console.log('copy:', copiedTimeout);

Output

original: 5000
copy: 10000

Explanation: primitives such as numbers are copied by value, so changing the copy does not affect the original.

const user = { name: 'Asha', active: true };
const sameUser = user;
sameUser.active = false;
console.log(user.active);
console.log(user === sameUser);

Output

false
true

Explanation: both variables point to the same object, so a change through either one is visible through both.

const QA_URL = 'https://qa.shop.test';
const STAGING_URL = 'https://staging.shop.test';
const PROD_URL = 'https://shop.test';
const selectedEnv = 'staging';
const baseUrl = selectedEnv === 'qa' ? QA_URL : selectedEnv === 'staging' ? STAGING_URL : PROD_URL;
const loginUrl = `${baseUrl}/login`;
console.log(loginUrl);

Output

https://staging.shop.test/login

Explanation: constants keep fixed values in one place, and a single variable decides which environment the test uses.

const prefix = 'qa.user';
const runId = 1730275200;
const email = `${prefix}+${runId}@example.com`;
console.log(email);

Output

qa.user+1730275200@example.com

Explanation: combining a stable prefix with a run ID gives unique but readable test data. In real tests the ID could come from Date.now().

const statuses = ['passed', 'failed', 'passed', 'skipped', 'passed'];
let passed = 0, failed = 0, skipped = 0;
for (const status of statuses) {
  if (status === 'passed') passed++;
  else if (status === 'failed') failed++;
  else skipped++;
}
console.log(`Passed: ${passed}, Failed: ${failed}, Skipped: ${skipped}`);

Output

Passed: 3, Failed: 1, Skipped: 1

Explanation: counters declared with let are updated inside the loop. The loop variable status is a fresh const each time.

const total = 80;
const failed = 6;
const passed = total - failed;
const passRate = (passed / total) * 100;
console.log(`Pass rate: ${passRate.toFixed(1)}%`);

Output

Pass rate: 92.5%

Explanation: intermediate variables like passed make the calculation readable. toFixed(1) formats the result.

const DEFAULT_TIMEOUT = 30000;
let customTimeout;
console.log('Timeout used:', customTimeout ?? DEFAULT_TIMEOUT);
customTimeout = 60000;
console.log('Timeout used:', customTimeout ?? DEFAULT_TIMEOUT);

Output

Timeout used: 30000
Timeout used: 60000

Explanation: ?? returns the right side only when the left side is null or undefined, which makes it ideal for optional settings.

const MAX_ATTEMPTS = 3;
let attempts = 0;
let locked = false;
for (let i = 1; i <= 3; i++) {
  attempts++;
  console.log(`Attempt ${attempts} failed`);
  if (attempts === MAX_ATTEMPTS) locked = true;
}
console.log('Account locked:', locked);

Output

Attempt 1 failed
Attempt 2 failed
Attempt 3 failed
Account locked: true

Explanation: a constant holds the business rule and let variables track state that changes during the scenario.

const testName = 'Checkout with saved card';
const durationMs = 2345;
const status = 'PASSED';
const durationSec = (durationMs / 1000).toFixed(2);
console.log(`[${status}] ${testName} (${durationSec}s)`);

Output

[PASSED] Checkout with saved card (2.35s)

Explanation: separate variables for each piece of data keep the formatting step simple and easy to change.

let cartTotal = 0;
cartTotal += 499;
console.log('After item 1:', cartTotal);
cartTotal += 1299;
console.log('After item 2:', cartTotal);
cartTotal += 250;
console.log('After item 3:', cartTotal);

Output

After item 1: 499
After item 2: 1798
After item 3: 2048

Explanation: += updates the running total in place, which mirrors how a test checks a cart after each step.

const password = 'Secr3t!Pass';
const masked = '*'.repeat(password.length - 2) + password.slice(-2);
console.log('Password used:', masked);

Output

Password used: *********ss

Explanation: never log real secrets. A derived variable holds a safe version for logs and reports.

const envVars = { BASE_URL: 'https://qa.app.test' };
const baseUrl = envVars.BASE_URL ?? 'http://localhost:3000';
const workers = Number(envVars.WORKERS ?? 2);
console.log('baseUrl:', baseUrl);
console.log('workers:', workers);

Output

baseUrl: https://qa.app.test
workers: 2

Explanation: tests often read process.env, where values may be missing. Defaults keep the run predictable.

const testUser = { username: 'qa_tester', password: 'P@ss123' };
const { username, password, role = 'viewer' } = testUser;
console.log(username, role);
console.log('Password length:', password.length);

Output

qa_tester viewer
Password length: 7

Explanation: object destructuring creates several variables at once and can supply defaults for missing properties.

const apiUser = { id: 7, full_name: 'Neha Sharma' };
const { id: userId, full_name: fullName } = apiUser;
console.log(`User #${userId}: ${fullName}`);

Output

User #7: Neha Sharma

Explanation: property: newName in destructuring renames a value, which keeps your code in camelCase even when an API uses snake_case.