Variable declaration using var in Javascript - Mini Project: Build & Apply

Variable declaration using var

📖 Scenario: Imagine you are organizing a small party. You want to keep track of the number of guests coming and the name of the party.

🎯 Goal: You will create variables using var to store the party name and the number of guests, then display them.

📋 What You'll Learn

Use var to declare variables

Assign exact values to variables as instructed

Print the variables to show their values

💡 Why This Matters

🌍 Real World

Variables help store information like names and counts in many programs, such as event planners or games.

💼 Career

Understanding variable declaration is a basic skill for any programming job, enabling you to store and manage data.

1

Declare a variable for the party name

Declare a variable called partyName using var and set it to the string "Birthday Bash".

Javascript

// Your code here

Hint

Use var partyName = "Birthday Bash"; to create the variable.

2

Declare a variable for the number of guests

Declare a variable called guestCount using var and set it to the number 15.

Javascript

var partyName = "Birthday Bash";
// Your code here

Hint

Use var guestCount = 15; to create the variable.

3

Create a message using the variables

Declare a variable called message using var and set it to a string that says "Welcome to Birthday Bash! We have 15 guests." by combining partyName and guestCount with string concatenation.

Javascript

var partyName = "Birthday Bash";
var guestCount = 15;
// Your code here

Hint

Use var message = "Welcome to " + partyName + "! We have " + guestCount + " guests."; to create the message.

4

Display the message

Use console.log to print the variable message.

Javascript

var partyName = "Birthday Bash";
var guestCount = 15;
var message = "Welcome to " + partyName + "! We have " + guestCount + " guests.";
// Your code here

Hint

Use console.log(message); to show the message in the console.

Practice

1. What does the var keyword do in JavaScript?

easy

A. Declares a block-scoped variable

B. Declares a constant that cannot be changed

C. Declares a variable that can be changed and redeclared

D. Declares a variable only inside loops

Solution

1. Step 1: Understand var behavior

   var declares variables that can be changed and redeclared in the same scope.

2. Step 2: Compare with other declarations

   Unlike const or let, var is function-scoped and allows redeclaration.

3. Final Answer:

   Declares a variable that can be changed and redeclared -> Option C

4. Quick Check:

   var allows redeclaration = A [OK]

Hint: Remember: var variables can be changed and redeclared easily [OK]

Common Mistakes:

• Confusing var with const or let
• Thinking var is block-scoped
• Assuming var variables cannot be redeclared

2. Which of the following is the correct syntax to declare a variable using var?

easy

A. var myVar = 10;

B. variable myVar = 10;

C. var: myVar = 10;

D. v ar myVar = 10;

Solution

1. Step 1: Recall correct var syntax

   The correct syntax is var variableName = value; with no spaces or colons.

2. Step 2: Check each option

   Only var myVar = 10; matches the correct syntax exactly.

3. Final Answer:

   var myVar = 10; -> Option A

4. Quick Check:

   Correct var syntax = A [OK]

Hint: Use 'var name = value;' format without extra symbols [OK]

Common Mistakes:

• Using 'variable' instead of 'var'
• Adding colons after var
• Adding spaces inside 'var'

3. What will be the output of this code?

var x = 5;
var x = 10;
console.log(x);

medium

A. 5

B. Error

C. undefined

D. 10

Solution

1. Step 1: Understand redeclaration with var

   Using var, redeclaring a variable overwrites its previous value.

2. Step 2: Trace the code execution

   First x is 5, then redeclared as 10, so console.log(x) prints 10.

3. Final Answer:

   10 -> Option D

4. Quick Check:

   Redeclared var overwrites value = 10 [OK]

Hint: Redeclaring var overwrites previous value [OK]

Common Mistakes:

• Thinking redeclaration causes error
• Expecting first value to print
• Confusing var with let or const behavior

4. Find the error in this code snippet:

if (true) {
  var a = 1;
}
console.log(a);

medium

A. ReferenceError: a is not defined

B. No error, prints 1

C. TypeError: a is not a function

D. SyntaxError due to missing braces

Solution

1. Step 1: Understand var scope

   var is function-scoped, not block-scoped, so a is accessible outside the if block.

2. Step 2: Check console.log output

   Since a is declared with var, console.log(a) prints 1 without error.

3. Final Answer:

   No error, prints 1 -> Option B

4. Quick Check:

   var is function-scoped, so prints 1 [OK]

Hint: var ignores block scope, accessible outside blocks [OK]

Common Mistakes:

• Assuming var is block-scoped like let
• Expecting ReferenceError outside block
• Confusing var with const or let scope

5. Consider this code:

function test() {
  if (true) {
    var count = 5;
  }
  var count = 10;
  return count;
}
console.log(test());

What will be the output and why?

hard

A. 10 because second var redeclares and overwrites

B. Error due to redeclaration of count

C. 5 because first var inside if is used

D. undefined because var is block-scoped

Solution

1. Step 1: Analyze var declarations inside function

   Both var count declarations are in the same function scope, so the second redeclaration overwrites the first.

2. Step 2: Determine returned value

   The function returns the last assigned value, which is 10.

3. Final Answer:

   10 because second var redeclares and overwrites -> Option A

4. Quick Check:

   Function-scoped var redeclaration overwrites = 10 [OK]

Hint: Inside functions, var redeclaration overwrites previous value [OK]

Common Mistakes:

• Thinking redeclaration causes error
• Assuming block scope limits var
• Expecting first value to be returned