Dynamic typing in JavaScript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to declare a variable with dynamic typing.

Javascript

let value = [1];

Drag options to blanks, or click blank then click option'

A"hello"

Bnull

Ctrue

D42

Attempts:

3 left

💡 Hint

Common Mistakes

Forgetting quotes around strings.

Using undefined variables.

In JavaScript, variables can hold any type. Here, we assign a string "hello" to the variable.

2fill in blank

medium

Complete the code to change the variable type dynamically.

Javascript

let data = 10;
data = [1];

Drag options to blanks, or click blank then click option'

A"twenty"

B20

Cfalse

Dnull

Attempts:

3 left

💡 Hint

Common Mistakes

Assigning a number without quotes when a string is needed.

Using boolean instead of string.

JavaScript allows changing the type of a variable. Here, we change from number 10 to string "twenty".

3fill in blank

hard

Fix the error by completing the code to convert a number to a string.

Javascript

let num = 5;
let str = num[1];

Drag options to blanks, or click blank then click option'

A* 2

B+ 1

C.toString()

D- 3

Attempts:

3 left

💡 Hint

Common Mistakes

Using arithmetic operators instead of conversion methods.

Forgetting parentheses after method name.

The toString() method converts a number to a string in JavaScript.

4fill in blank

hard

Fill both blanks to create a variable that changes from boolean to string.

Javascript

let flag = [1];
flag = [2];

Drag options to blanks, or click blank then click option'

Atrue

B"true"

Cfalse

D"false"

Attempts:

3 left

💡 Hint

Common Mistakes

Using quotes for boolean values initially.

Not using quotes when changing to string.

Initially, flag is a boolean true. Then it changes to the string "true".

5fill in blank

hard

Fill all three blanks to create a variable that changes from number to string and then to boolean.

Javascript

let val = [1];
val = [2];
val = [3];

Drag options to blanks, or click blank then click option'

A100

B"100"

Cfalse

Dtrue

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing quotes for numbers.

Using wrong boolean values.

The variable val starts as number 100, then changes to string "100", and finally to boolean false.

Practice

1. What does dynamic typing in JavaScript mean?

easy

A. Variables must be declared with a fixed type

B. Variables can hold any type and change types anytime

C. JavaScript does not allow variables

D. Types are checked only at compile time

Solution

1. Step 1: Understand variable typing in JavaScript

   JavaScript variables do not have fixed types and can hold any value type.

2. Step 2: Define dynamic typing

   Dynamic typing means variables can change their type during program execution.

3. Final Answer:

   Variables can hold any type and change types anytime -> Option B

4. Quick Check:

   Dynamic typing = variables change types [OK]

Hint: Remember: JavaScript variables are flexible with types [OK]

Common Mistakes:

• Thinking variables have fixed types like in Java
• Confusing dynamic typing with static typing
• Believing JavaScript checks types before running

2. Which of the following is the correct way to declare a variable that can hold any type in JavaScript?

easy

A. let x = 5;

B. int x = 5;

C. var x: number = 5;

D. const x = 'hello';

Solution

1. Step 1: Identify JavaScript variable declaration syntax

   JavaScript uses let, var, or const without type annotations.

2. Step 2: Check each option

   let x = 5; uses let correctly. int x = 5; uses int which is not valid in JavaScript. var x: number = 5; uses TypeScript syntax. const x = 'hello'; is valid but declares a constant, not a variable that can change.

3. Final Answer:

   let x = 5; -> Option A

4. Quick Check:

   Use let/var/const without types [OK]

Hint: Use let or var without type annotations [OK]

Common Mistakes:

• Using type keywords like int or number in plain JavaScript
• Confusing const with let for variable declaration
• Trying to declare types explicitly in JavaScript

3. What will be the output of this code?

let value = 10;
value = 'hello';
console.log(typeof value);

medium

A. "number"

B. "undefined"

C. "string"

D. TypeError

Solution

1. Step 1: Track variable type changes

   Initially, value is a number 10, then reassigned to string 'hello'.

2. Step 2: Evaluate typeof operator

   typeof value returns the current type, which is "string" after reassignment.

3. Final Answer:

   "string" -> Option C

4. Quick Check:

   typeof after reassignment = "string" [OK]

Hint: typeof shows current type after reassignment [OK]

Common Mistakes:

• Assuming type stays as number after reassignment
• Confusing typeof output with variable value
• Expecting an error when changing types

4. Find the error in this code snippet:

let data = 5;
data = true;
console.log(data.toFixed(2));

medium

A. TypeError because boolean has no toFixed method

B. No error, outputs "5.00"

C. SyntaxError due to reassignment

D. ReferenceError for data variable

Solution

1. Step 1: Understand variable type changes

   Variable data starts as number 5, then changes to boolean true.

2. Step 2: Check method call on boolean

   toFixed is a method for numbers, not booleans, so calling it on a boolean causes a TypeError.

3. Final Answer:

   TypeError because boolean has no toFixed method -> Option A

4. Quick Check:

   Calling number method on boolean causes TypeError [OK]

Hint: Check method compatibility with current variable type [OK]

Common Mistakes:

• Assuming toFixed works on booleans
• Thinking reassignment causes syntax error
• Ignoring runtime errors from wrong method calls

5. You want to write a function that accepts any type of input and returns its type as a string. Which code correctly uses dynamic typing to achieve this?

function getType(input) {
  // Your code here
}

hard

A. return typeof input.toString();

B. return input.type;

C. return input.constructor;

D. return typeof input;

Solution

1. Step 1: Understand typeof operator

   typeof returns the type of any JavaScript value as a string.

2. Step 2: Evaluate each option

   return typeof input; correctly returns the type string. return input.type; tries to access a property that may not exist. return input.constructor; returns a function, not a string. return typeof input.toString(); returns "string" always because toString() returns a string.

3. Final Answer:

   return typeof input; -> Option D

4. Quick Check:

   typeof returns type string for any input [OK]

Hint: Use typeof to get type as string for any value [OK]

Common Mistakes:

• Using .type property which may be undefined
• Returning constructor function instead of string
• Calling toString() then typeof, always returns "string"