Chapter 3 Beginner 58 Questions

Practice Questions — Variables and Data Types

← Back to Notes
8 Easy
12 Medium
12 Hard

Topic-Specific Questions

Question 1
Easy
What is the output?
let x = 10;
const y = 20;
console.log(x + y);
let and const both store values. + adds numbers.
30
Question 2
Easy
What is the output?
console.log(typeof 42);
console.log(typeof "42");
console.log(typeof true);
typeof returns the type as a lowercase string.
number
string
boolean
Question 3
Easy
What is the output?
let name = "Aarav";
console.log(`Hello, ${name}!`);
Backticks and ${} create template literals.
Hello, Aarav!
Question 4
Easy
What is the output?
let x;
console.log(x);
What value does a variable have if you never assign anything?
undefined
Question 5
Medium
What is the output?
console.log(typeof null);
console.log(typeof undefined);
One of these has a famous bug.
object
undefined
Question 6
Medium
What is the output?
console.log("5" + 3);
console.log("5" - 3);
console.log("5" * "2");
The + operator concatenates with strings. Other math operators convert to numbers.
53
2
10
Question 7
Medium
What is the output?
console.log(NaN === NaN);
console.log(typeof NaN);
console.log(Number.isNaN(NaN));
NaN has two famous quirks: its type and its equality behavior.
false
number
true
Question 8
Medium
What is the output?
console.log(Boolean(0));
console.log(Boolean(""));
console.log(Boolean("0"));
console.log(Boolean([]));
There are exactly six falsy values. '0' is a non-empty string. [] is an empty array.
false
false
true
true
Question 9
Hard
What is the output?
console.log(null == undefined);
console.log(null === undefined);
console.log(null == 0);
console.log(null == "");
null and undefined are loosely equal to each other but not to anything else.
true
false
false
false
Question 10
Hard
What is the output?
console.log("" + 1 + 0);
console.log("" - 1 + 0);
console.log(true + false);
console.log(6 / "3");
console.log("2" * "3");
The + operator with a string concatenates. All other math operators convert to numbers.
10
-1
1
2
6
Question 11
Easy
Priya wrote this code but gets an error. Find the bug:
const score = 100;
score = score + 10;
console.log(score);
Check the variable declaration keyword.
Change const to let since the value needs to be reassigned: let score = 100;
Question 12
Hard
What is the output?
let a = "2";
let b = "3";
console.log(a + b);
console.log(+a + +b);
The unary + operator converts to a number.
23
5
Question 13
Hard
What is the output?
console.log(Number(""));
console.log(Number(" "));
console.log(Number(null));
console.log(Number(undefined));
console.log(Number(false));
console.log(Number("hello"));
Each value converts to a number differently. Empty string and null become 0.
0
0
0
NaN
0
NaN
Question 14
Medium
Write code that declares a const name, a let age, and uses a template literal to log: 'Vikram is 16 and will be 17 next year'.
Use backticks and ${} with an expression inside.
const name = "Vikram";
let age = 16;
console.log(`${name} is ${age} and will be ${age + 1} next year`);
Question 15
Hard
What is the output?
console.log(parseInt("42px"));
console.log(parseInt("px42"));
console.log(Number("42px"));
console.log(parseFloat("3.14.15"));
parseInt/parseFloat read from the start. Number requires the whole string to be valid.
42
NaN
NaN
3.14
Question 16
Easy
What is the output?
let greeting = `Hello`;
console.log(typeof greeting);
Backticks create strings just like quotes do.
string
Question 17
Medium
What is the output?
const arr = [1, 2, 3];
arr.push(4);
console.log(arr);
const prevents reassignment but not mutation.
[1, 2, 3, 4]
Question 18
Hard
What is the output?
console.log(typeof typeof 42);
console.log(typeof typeof typeof true);
typeof always returns a string. What is typeof of a string?
string
string
Question 19
Medium
Rohan wants to check if a value is null but his check never works:
let data = null;
if (typeof data === "null") {
  console.log("It is null");
} else {
  console.log("Not null"); // This runs!
}
What does typeof null actually return?
Replace typeof data === "null" with data === null.
Question 20
Hard
What is the output?
let a = 1;
let b = "1";
console.log(a == b);
console.log(a === b);
console.log(a + b);
console.log(a - b);
== converts types, === does not. + concatenates with strings, - converts to numbers.
true
false
11
0

Mixed & Application Questions

Question 1
Easy
What is the output?
let a = 5;
let b = 10;
let c = a + b;
console.log(c);
console.log(typeof c);
Both a and b are numbers. typeof returns the type.
15
number
Question 2
Easy
Declare a const for your school name, a let for your age, and use a template literal to log: '[School] student, age [age]'.
Use const for the school (it won't change), let for age.
const school = "Delhi Public School";
let age = 15;
console.log(`${school} student, age ${age}`);
Question 3
Medium
What is the output?
console.log("5" == 5);
console.log("5" === 5);
console.log(0 == false);
console.log(0 === false);
== converts types before comparing. === does not.
true
false
true
false
Question 4
Medium
What is the output?
let x = "10";
console.log(x + 5);
console.log(Number(x) + 5);
console.log(parseInt(x) + 5);
console.log(+x + 5);
Four ways to handle string-to-number conversion.
105
15
15
15
Question 5
Medium
Write an HTML page where the user enters a value in an input field and clicks a button. Display the typeof the entered value, its Number conversion, and its Boolean conversion.
Input values are always strings. Show Number() and Boolean() results.
<input type="text" id="val">
<button onclick="check()">Check Type</button>
<p id="output"></p>
<script>
  function check() {
    let val = document.getElementById("val").value;
    let result = `Value: '${val}'\n`;
    result += `typeof: ${typeof val}\n`;
    result += `Number(): ${Number(val)}\n`;
    result += `Boolean(): ${Boolean(val)}`;
    document.getElementById("output").textContent = result;
  }
</script>
Question 6
Hard
What is the output?
let x = 0;
let y = "";
let z = null;

console.log(x == y);
console.log(x == z);
console.log(y == z);
console.log(x === y);
With ==: 0 equals '', null only equals undefined, not 0 or ''.
true
false
false
false
Question 7
Hard
What is the output?
console.log(isNaN("hello"));
console.log(isNaN("42"));
console.log(Number.isNaN("hello"));
console.log(Number.isNaN(NaN));
Global isNaN converts first. Number.isNaN does not convert.
true
false
false
true
Question 8
Medium
Neha tries to build a string using template literals but gets the literal text '${name}' instead of the value:
let name = "Neha";
console.log('Hello, ${name}!');
What kind of quotes does this use?
Use backticks instead of single quotes: console.log(`Hello, ${name}!`);
Question 9
Hard
What is the output?
console.log([] + []);
console.log([] + {});
console.log(+[]);
console.log(+{});
Empty array becomes '' when converted to string. Unary + converts to number.
(empty string)
[object Object]
0
NaN
Question 10
Hard
Write code that demonstrates all six falsy values. For each, log the value and its Boolean conversion.
The six falsy values are: 0, '', null, undefined, NaN, false.
let falsyValues = [0, "", null, undefined, NaN, false];
for (let val of falsyValues) {
  console.log(`${String(val)} -> ${Boolean(val)}`);
}
Question 11
Medium
What is the output?
let age = 15;
console.log(`In 5 years: ${age + 5}`);
console.log(`Double: ${age * 2}`);
console.log(`Is teen: ${age >= 13 && age <= 19}`);
Any expression works inside ${}.
In 5 years: 20
Double: 30
Is teen: true
Question 12
Hard
What is the output?
console.log("" == false);
console.log(" " == false);
console.log("0" == false);
console.log("1" == true);
== converts both sides to numbers. '' becomes 0, ' ' becomes 0, '0' becomes 0, false becomes 0, true becomes 1.
true
false
true
true

Multiple Choice Questions

MCQ 1
Which keyword should you use for a variable whose value will never change?
  • A. let
  • B. var
  • C. const
  • D. static
Answer: C
C is correct. const creates a constant that cannot be reassigned. let (A) allows reassignment. var (B) is outdated. static (D) is used in classes, not for regular variables.
MCQ 2
What is the output of: typeof 'hello'?
  • A. text
  • B. String
  • C. string
  • D. char
Answer: C
C is correct. typeof returns lowercase type names. 'hello' is a string. Note it returns "string" (lowercase), not "String" (capital S).
MCQ 3
How many primitive data types does JavaScript have?
  • A. 4
  • B. 5
  • C. 6
  • D. 7
Answer: D
D is correct. JavaScript has 7 primitive types: string, number, boolean, undefined, null, symbol, and bigint.
MCQ 4
What is the output of: typeof null?
  • A. null
  • B. undefined
  • C. object
  • D. boolean
Answer: C
C is correct. typeof null returns "object". This is a well-known bug from JavaScript's first version in 1995 that was never fixed.
MCQ 5
What value does a declared but uninitialized variable have?
  • A. null
  • B. 0
  • C. undefined
  • D. NaN
Answer: C
C is correct. A variable declared with let but not assigned a value is automatically undefined. It is not null (A), 0 (B), or NaN (D).
MCQ 6
What is the output of: '5' + 3?
  • A. 8
  • B. 53
  • C. NaN
  • D. Error
Answer: B
B is correct. When the + operator has a string operand, it performs concatenation. '5' + 3 converts 3 to '3' and gives '53'.
MCQ 7
What is the output of: '5' - 3?
  • A. 53
  • B. 2
  • C. NaN
  • D. Error
Answer: B
B is correct. The - operator only works with numbers, so '5' is converted to the number 5. Then 5 - 3 = 2.
MCQ 8
Which of the following is a falsy value in JavaScript?
  • A. "0"
  • B. []
  • C. 0
  • D. "false"
Answer: C
C is correct. The number 0 is one of the six falsy values. "0" is a non-empty string (truthy). [] is an empty array (truthy). "false" is a non-empty string (truthy).
MCQ 9
What does parseInt('42px') return?
  • A. NaN
  • B. 42
  • C. '42'
  • D. Error
Answer: B
B is correct. parseInt() reads digits from the start of the string and stops at the first non-digit. It successfully parses 42 from '42px'.
MCQ 10
Which of these is the correct way to use template literals?
  • A. "Hello ${name}"
  • B. 'Hello ${name}'
  • C. `Hello ${name}`
  • D. (Hello ${name})
Answer: C
C is correct. Template literals require backticks (`), not double quotes (A), single quotes (B), or parentheses (D). Only backticks enable the ${} syntax.
MCQ 11
What is NaN === NaN?
  • A. true
  • B. false
  • C. NaN
  • D. Error
Answer: B
B is correct. NaN is the only value in JavaScript that is not equal to itself. Both NaN == NaN and NaN === NaN return false. Use Number.isNaN() to check for NaN.
MCQ 12
What is the output of: console.log(Boolean([]))?
  • A. true
  • B. false
  • C. undefined
  • D. Error
Answer: A
A is correct. An empty array [] is an object, and ALL objects are truthy in JavaScript. This surprises many beginners who expect empty collections to be falsy.
MCQ 13
What is the output of: typeof typeof 42?
  • A. number
  • B. string
  • C. typeof
  • D. undefined
Answer: B
B is correct. typeof 42 returns the string "number". Then typeof "number" returns "string". Since typeof always returns a string, typeof typeof anything is always "string".
MCQ 14
What is the output of: console.log(null == undefined)?
  • A. true
  • B. false
  • C. null
  • D. Error
Answer: A
A is correct. The == operator treats null and undefined as equal to each other (and only each other). null == undefined is true, but null === undefined is false.
MCQ 15
What happens when you do: const obj = {a: 1}; obj.a = 2;
  • A. Error: cannot modify const
  • B. obj.a becomes 2 successfully
  • C. obj.a stays as 1
  • D. obj becomes undefined
Answer: B
B is correct. const prevents reassignment of the variable (you cannot do obj = {}), but it does NOT prevent mutation of the object's properties. Changing obj.a to 2 is perfectly valid.
MCQ 16
What is the output of: console.log(typeof true)?
  • A. true
  • B. boolean
  • C. Boolean
  • D. bool
Answer: B
B is correct. typeof true returns the string "boolean" (lowercase). JavaScript uses the full word, not abbreviations like "bool".
MCQ 17
What is the output of: console.log(Number(''))?
  • A. NaN
  • B. 0
  • C. undefined
  • D. Error
Answer: B
B is correct. Number('') converts an empty string to 0. This is an important conversion rule to memorize. Number(null) is also 0, but Number(undefined) is NaN.
MCQ 18
Which of these values is truthy?
  • A. 0
  • B. null
  • C. "0"
  • D. NaN
Answer: C
C is correct. The string "0" is truthy because it is a non-empty string. The other three (0, null, NaN) are all falsy values.

Coding Challenges

Challenge 1: Variable Type Inspector

Easy
Create a variable of each primitive type (string, number, boolean, null, undefined) and log each value along with its typeof result.
Sample Input
(No input required)
Sample Output
Aarav -> string 42 -> number true -> boolean null -> object undefined -> undefined
Use template literals for the output.
let str = "Aarav";
let num = 42;
let bool = true;
let empty = null;
let undef = undefined;
console.log(`${str} -> ${typeof str}`);
console.log(`${num} -> ${typeof num}`);
console.log(`${bool} -> ${typeof bool}`);
console.log(`${empty} -> ${typeof empty}`);
console.log(`${undef} -> ${typeof undef}`);

Challenge 2: String to Number Converter Page

Easy
Build an HTML page with an input field and a button. When clicked, show the original value, its type, and the result of Number(), parseInt(), and parseFloat() conversions.
Sample Input
User enters '3.14abc'
Sample Output
Original: '3.14abc' (string) Number(): NaN parseInt(): 3 parseFloat(): 3.14
Display results on the page, not in alerts.
<!DOCTYPE html>
<html>
<body>
  <input type="text" id="val">
  <button onclick="convert()">Convert</button>
  <pre id="output"></pre>
  <script>
    function convert() {
      let val = document.getElementById("val").value;
      let result = `Original: '${val}' (${typeof val})\n`;
      result += `Number(): ${Number(val)}\n`;
      result += `parseInt(): ${parseInt(val)}\n`;
      result += `parseFloat(): ${parseFloat(val)}`;
      document.getElementById("output").textContent = result;
    }
  </script>
</body>
</html>

Challenge 3: Truthy/Falsy Tester

Medium
Build a page where the user enters a value and the page tells them if it is truthy or falsy. Test the value as-is (string), then as Number conversion, then as Boolean conversion.
Sample Input
User enters '0'
Sample Output
'0' as string: truthy '0' as Number (0): falsy '0' as Boolean: truthy
Handle the empty string case too.
<!DOCTYPE html>
<html>
<body>
  <input type="text" id="val">
  <button onclick="test()">Test</button>
  <pre id="output"></pre>
  <script>
    function test() {
      let val = document.getElementById("val").value;
      let numVal = Number(val);
      let result = `'${val}' as string: ${Boolean(val) ? 'truthy' : 'falsy'}\n`;
      result += `'${val}' as Number (${numVal}): ${Boolean(numVal) ? 'truthy' : 'falsy'}\n`;
      result += `'${val}' as Boolean: ${Boolean(val) ? 'truthy' : 'falsy'}`;
      document.getElementById("output").textContent = result;
    }
  </script>
</body>
</html>

Challenge 4: Student Profile Card Builder

Medium
Build a page with inputs for name, age, and grade. When 'Create Card' is clicked, display a styled card using template literals and DOM manipulation. The card should show the name, age, grade, and whether the student is a teenager (13-19).
Sample Input
Name: Ananya, Age: 15, Grade: 10th
Sample Output
A styled card showing: Ananya, 15 years old, 10th grade, Is teenager: Yes
Use template literals with innerHTML to build the card HTML. Use const for unchanging values.
<!DOCTYPE html>
<html>
<body>
  <input id="name" placeholder="Name">
  <input id="age" type="number" placeholder="Age">
  <input id="grade" placeholder="Grade">
  <button onclick="createCard()">Create Card</button>
  <div id="card"></div>
  <script>
    function createCard() {
      const name = document.getElementById("name").value;
      const age = Number(document.getElementById("age").value);
      const grade = document.getElementById("grade").value;
      const isTeen = age >= 13 && age <= 19;
      document.getElementById("card").innerHTML = `
        <div style="border:2px solid #333; padding:15px; margin:10px; border-radius:8px; max-width:300px;">
          <h2>${name}</h2>
          <p>Age: ${age} years old</p>
          <p>Grade: ${grade}</p>
          <p>Teenager: ${isTeen ? 'Yes' : 'No'}</p>
        </div>`;
    }
  </script>
</body>
</html>

Challenge 5: Type Coercion Quiz

Hard
Build a quiz page that shows a JavaScript expression and asks the user to predict the output. Show 5 type coercion questions one at a time. Track score and show the final result.
Sample Input
User guesses outputs for each expression
Sample Output
Expression: '5' + 3 User enters: 53 Correct! Score: 1/1
Use an array of question objects. Compare user's answer with the actual evaluated result.
<!DOCTYPE html>
<html>
<body>
  <h2 id="question"></h2>
  <input id="answer" placeholder="Your answer">
  <button onclick="checkAnswer()">Submit</button>
  <p id="feedback"></p>
  <p id="score"></p>
  <script>
    const questions = [
      { expr: "'5' + 3", answer: "53" },
      { expr: "'5' - 3", answer: "2" },
      { expr: "true + true", answer: "2" },
      { expr: "typeof null", answer: "object" },
      { expr: "Boolean('')", answer: "false" }
    ];
    let current = 0;
    let score = 0;
    function showQuestion() {
      if (current < questions.length) {
        document.getElementById("question").textContent = "What is the output of: " + questions[current].expr + " ?";
        document.getElementById("answer").value = "";
        document.getElementById("feedback").textContent = "";
      } else {
        document.getElementById("question").textContent = "Quiz complete!";
        document.getElementById("score").textContent = "Final score: " + score + "/" + questions.length;
      }
    }
    function checkAnswer() {
      if (current >= questions.length) return;
      let userAnswer = document.getElementById("answer").value.trim();
      let correct = questions[current].answer;
      if (userAnswer === correct) {
        score++;
        document.getElementById("feedback").textContent = "Correct!";
        document.getElementById("feedback").style.color = "green";
      } else {
        document.getElementById("feedback").textContent = "Wrong! Answer: " + correct;
        document.getElementById("feedback").style.color = "red";
      }
      document.getElementById("score").textContent = "Score: " + score + "/" + (current + 1);
      current++;
      setTimeout(showQuestion, 1500);
    }
    showQuestion();
  </script>
</body>
</html>

Challenge 6: Dynamic Type Conversion Table

Hard
Build a page that generates an HTML table showing how different values convert to Number, String, and Boolean. Include these values: 0, 1, '', '0', ' ', null, undefined, true, false, NaN, [], {}.
Sample Input
(No input required)
Sample Output
A table with columns: Value | typeof | Number() | String() | Boolean()
Generate the table dynamically with JavaScript. Use template literals and innerHTML.
<!DOCTYPE html>
<html>
<body>
  <h2>Type Conversion Table</h2>
  <div id="table"></div>
  <script>
    const values = [0, 1, '', '0', ' ', null, undefined, true, false, NaN, [], {}];
    let html = '<table border="1" cellpadding="8"><tr><th>Value</th><th>typeof</th><th>Number()</th><th>String()</th><th>Boolean()</th></tr>';
    for (let val of values) {
      let display = JSON.stringify(val);
      if (val === undefined) display = 'undefined';
      if (typeof val === 'number' && isNaN(val)) display = 'NaN';
      html += `<tr><td>${display}</td><td>${typeof val}</td><td>${Number(val)}</td><td>${String(val)}</td><td>${Boolean(val)}</td></tr>`;
    }
    html += '</table>';
    document.getElementById("table").innerHTML = html;
  </script>
</body>
</html>

Need to Review the Concepts?

Go back to the detailed notes for this chapter.

Read Chapter Notes

Want to learn web development with a live mentor?

Explore our Frontend Masterclass