Function expression in Javascript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a function expression that returns the sum of two numbers.

Javascript

const add = function(a, b) { return a [1] b; }; console.log(add(2, 3));

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

A*

B-

C+

D/

Attempts:

3 left

💡 Hint

Common Mistakes

Using subtraction or multiplication instead of addition.

Forgetting to return the result.

The + operator adds two numbers. Here, it returns the sum of a and b.

2fill in blank

medium

Complete the code to assign an anonymous function to the variable greet that returns 'Hello!'.

Javascript

const greet = [1]() { return 'Hello!'; }; console.log(greet());

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

Afunction

Bfun

Cfunc

Ddef

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect keywords like 'fun' or 'def'.

Omitting the function keyword.

The keyword function defines a function expression in JavaScript.

3fill in blank

hard

Fix the error in the function expression syntax.

Javascript

const multiply = function(a, b) [1] return a * b; }; console.log(multiply(4, 5));

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

A<

B(

C[

D{

Attempts:

3 left

💡 Hint

Common Mistakes

Using parentheses or brackets instead of curly braces.

Missing the opening brace.

The function body must start with a curly brace { to enclose the statements.

4fill in blank

hard

Complete the code to create a function expression that returns the square of a number.

Javascript

const square = function(num) { return num [1] 2; }; console.log(square(6));

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

A{

B**

C*

D(

Attempts:

3 left

💡 Hint

Common Mistakes

Using multiplication * instead of exponentiation **.

Forgetting the opening brace.

The function body starts with a curly brace {. The exponentiation operator ** raises num to the power of 2.

5fill in blank

hard

Fill both blanks to create a function expression that filters an array to keep only even numbers.

Javascript

const evens = numbers.filter(function([1]) { return [2] % 2 === 0; }); console.log(evens);

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

Anum

B{

Ditem

Attempts:

3 left

💡 Hint

Common Mistakes

Using inconsistent parameter names.

Forgetting the opening brace.

Incorrect modulo condition.

The parameter name is num. The function body starts with a curly brace {. The condition checks if num is even by using the modulo operator.

Practice

1. What is a function expression in JavaScript?

easy

A. A function that runs automatically when the page loads

B. A way to store a function inside a variable

C. A function declared with the function keyword only

D. A special type of loop

Solution

1. Step 1: Understand function expressions

   A function expression means assigning a function to a variable so it can be used later.

2. Step 2: Compare options

   Only A way to store a function inside a variable describes storing a function inside a variable, which matches the definition of a function expression.

3. Final Answer:

   A way to store a function inside a variable -> Option B

4. Quick Check:

   Function expression = function stored in variable [OK]

Hint: Function expressions assign functions to variables [OK]

Common Mistakes:

• Confusing function expressions with function declarations
• Thinking function expressions run automatically
• Mixing up functions with loops

2. Which of the following is the correct syntax for a function expression?

easy

A. var myFunc = function() { return 5

B. function myFunc() { return 5; }

C. let myFunc = function myFunc() { return 5

D. const myFunc = function() { return 5; };

Solution

1. Step 1: Identify function expression syntax

   A function expression assigns an anonymous function to a variable using = function() { ... }.

2. Step 2: Check options for correct syntax

   const myFunc = function() { return 5; }; uses const with an anonymous function and ends with a semicolon, which is correct syntax.

3. Final Answer:

   const myFunc = function() { return 5; }; -> Option D

4. Quick Check:

   Function expression syntax = variable = function() { } [OK]

Hint: Function expressions assign anonymous functions to variables [OK]

Common Mistakes:

• Using function declaration syntax instead of expression
• Missing semicolon at the end
• Using named function inside expression incorrectly

3. What will be the output of this code?

const greet = function(name) { return `Hello, ${name}!`; };
console.log(greet('Alice'));

medium

A. greet Alice!

B. Hello, name!

C. Hello, Alice!

D. Error: greet is not a function

Solution

1. Step 1: Understand the function expression

   The variable greet holds a function that returns a greeting string with the given name.

2. Step 2: Evaluate the function call

   Calling greet('Alice') returns Hello, Alice! which is printed by console.log.

3. Final Answer:

   Hello, Alice! -> Option C

4. Quick Check:

   Function call with 'Alice' returns greeting [OK]

Hint: Function expressions return values like normal functions [OK]

Common Mistakes:

• Confusing variable name with parameter
• Expecting function name in output
• Thinking function expression causes error

4. Find the error in this function expression:

const add = function(a, b) {
  return a + b
};
console.log(add(2, 3));

medium

A. No error, code runs correctly

B. Function expression must have a name

C. Cannot use const with function expressions

D. Missing semicolon after return statement

Solution

1. Step 1: Check syntax of function expression

   The function is assigned to add using const, which is valid. The return statement is correct without semicolon (optional in JS).

2. Step 2: Verify code execution

   Calling add(2, 3) returns 5 and prints it. No syntax or runtime errors occur.

3. Final Answer:

   No error, code runs correctly -> Option A

4. Quick Check:

   Valid function expression runs without error [OK]

Hint: Semicolons after return are optional in JavaScript [OK]

Common Mistakes:

• Thinking function expressions must be named
• Believing semicolon is mandatory after return
• Assuming const cannot hold functions

5. You want to create a function expression that doubles a number and then immediately call it with 4. Which code does this correctly?

hard

A. const double = function(n) { return n * 2; }(4); console.log(double);

B. function(n) { return n * 2; }(4);

C. const double = (n) => n * 2; double(4);

D. const double = function(n) { return n * 2; }; double(4);

Solution

1. Step 1: Understand immediate function call with expression

   To call a function expression immediately, you add parentheses after the function definition.

2. Step 2: Analyze options

   const double = function(n) { return n * 2; }(4); console.log(double); defines a function expression and immediately calls it with (4), assigning the result to double. Then it logs the result. This matches the requirement.

3. Final Answer:

   const double = function(n) { return n * 2; }(4); console.log(double); -> Option A

4. Quick Check:

   Function expression called immediately with (4) [OK]

Hint: Add (args) right after function expression to call immediately [OK]

Common Mistakes:

• Not calling the function immediately
• Assigning function instead of result
• Using arrow function without immediate call