Javascript · Question Set

Operators and Functions – Javascript interview questions

Operators and Functions interview questions for placements and exams.

Subject: JavascriptDifficulty: Mixed15 questions in this set

Set overview

Questions

Included in this set

Subject

Javascript

Explore more sets

Difficulty

Mixed

Level of this set

Javascript – Operators and Functions questions (15)

Go through each question and its explanation. Use this set as a focused practice pack for Javascript.

Back to Javascript subject page

1. What does a function return if there is no return statement?

Difficulty: EasyType: MCQTopic: JS Functions

A function without a return statement returns undefined by default. This also happens if you use return with no value, or if execution reaches the end of the function without hitting a return. Every function in JavaScript returns something, and undefined is the default return value. Understanding this behavior is important for debugging and knowing when to explicitly return values.

Example code

// No return statement
function noReturn() {
  let x = 5;
}
console.log(noReturn()); // undefined

// Empty return
function emptyReturn() {
  return;
}
console.log(emptyReturn()); // undefined

// Return with value
function withReturn() {
  return 42;
}
console.log(withReturn()); // 42

// Early return
function checkAge(age) {
  if (age < 18) {
    return 'Too young';
  }
  return 'Welcome';
}

// Common mistake
function calculate() {
  let result = 10 * 5;
  // Forgot to return!
}
console.log(calculate()); // undefined

2. What does the nullish coalescing operator (??) do?

Difficulty: MediumType: MCQTopic: Modern Syntax

The nullish coalescing operator returns the right operand when the left operand is null or undefined, and returns the left operand otherwise. Unlike the OR operator which checks for any falsy value, nullish coalescing only checks for null and undefined. This is useful when zero or empty string are valid values you want to keep. It was introduced in ES2020 to provide a more precise way to set default values.

Example code

// Nullish coalescing - only null/undefined
console.log(null ?? 'default');      // 'default'
console.log(undefined ?? 'default'); // 'default'
console.log(0 ?? 'default');         // 0 (keeps 0)
console.log('' ?? 'default');        // '' (keeps empty string)
console.log(false ?? 'default');     // false (keeps false)

// Compare with OR operator
console.log(0 || 'default');         // 'default' (treats 0 as falsy)
console.log('' || 'default');        // 'default' (treats '' as falsy)

// Practical use
function setPort(port) {
  return port ?? 3000; // Keeps 0 as valid port
}
console.log(setPort(8080)); // 8080
console.log(setPort(0));    // 0 (not 3000!)
console.log(setPort(null)); // 3000

// User settings
let volume = settings.volume ?? 50; // 0 is valid volume

3. Can you call a function declaration before it is defined in the code?

Difficulty: EasyType: MCQTopic: JS Functions

Yes, you can call a function declaration before it is defined because of hoisting. JavaScript moves the entire function declaration including its body to the top of the scope during compilation. This is different from function expressions and arrow functions which are not hoisted in the same way. Function declarations are fully available throughout their scope. This behavior is useful but can lead to confusion, so many developers prefer to define functions before using them for better readability.

Example code

// Function declaration - can call before definition
greet(); // Works! Prints 'Hello'

function greet() {
  console.log('Hello');
}

// Function expression - cannot call before definition
// sayBye(); // TypeError: sayBye is not a function

let sayBye = function() {
  console.log('Bye');
};

// Arrow function - cannot call before definition
// welcome(); // ReferenceError

const welcome = () => {
  console.log('Welcome');
};

// Why function declaration works
function calculate(a, b) {
  return a + b;
}

// JavaScript sees it as:
// Function moved to top, then code runs
console.log(calculate(5, 3)); // 8

4. What happens if you call a function with fewer arguments than parameters?

Difficulty: EasyType: MCQTopic: JS Functions

If you call a function with fewer arguments than parameters, the missing parameters are automatically set to undefined. JavaScript does not enforce the number of arguments and allows you to pass more or fewer arguments than the function expects. This flexibility can be useful but also requires defensive coding to handle missing arguments. You can use default parameters introduced in ES6 to provide fallback values for missing arguments.

Example code

function greet(firstName, lastName) {
  console.log(firstName); // 'John'
  console.log(lastName);  // undefined
}
greet('John'); // Called with only 1 argument

// Default parameters (ES6)
function sayHello(name = 'Guest') {
  console.log('Hello ' + name);
}
sayHello();       // 'Hello Guest'
sayHello('John'); // 'Hello John'

// Old way to handle defaults
function oldWay(name) {
  name = name || 'Guest';
  console.log('Hello ' + name);
}

// Multiple defaults
function multiply(a, b = 1) {
  return a * b;
}
console.log(multiply(5));    // 5 (5 * 1)
console.log(multiply(5, 2)); // 10

// Undefined triggers default
function test(x = 10) {
  console.log(x);
}
test(undefined); // 10 (default used)
test(null);      // null (default NOT used)

5. Explain default parameters in JavaScript functions. How do they work with undefined and null?

Difficulty: EasyType: SubjectiveTopic: JS Functions

Default parameters allow you to specify default values for function parameters if no argument is provided or if undefined is passed. Introduced in ES6, they provide cleaner syntax than the old pattern of using logical OR or checking for undefined. Default parameters are evaluated at call time, so you can use expressions or even call other functions as defaults. Parameters with defaults must come after required parameters. If you pass undefined explicitly, the default value is used. But passing null does not trigger the default because null is a valid value. Default parameters make functions more robust by handling missing arguments gracefully without additional code inside the function body.

Example code

// Basic default parameters
function greet(name = 'Guest', greeting = 'Hello') {
  return greeting + ' ' + name;
}
console.log(greet());              // 'Hello Guest'
console.log(greet('John'));        // 'Hello John'
console.log(greet('John', 'Hi'));  // 'Hi John'

// undefined triggers default
console.log(greet(undefined, 'Hey')); // 'Hey Guest'

// null does not trigger default
console.log(greet(null));          // 'Hello null'

// Expression as default
function multiply(a, b = a * 2) {
  return a * b;
}
console.log(multiply(5));    // 25 (5 * 10)
console.log(multiply(5, 3)); // 15

// Function call as default
function getDefault() {
  return 'Default Value';
}
function demo(value = getDefault()) {
  return value;
}
console.log(demo());     // 'Default Value'
console.log(demo('Hi')); // 'Hi'

// Multiple defaults
function createUser(name = 'Anonymous', age = 18, role = 'user') {
  return { name, age, role };
}
console.log(createUser()); // {name: 'Anonymous', age: 18, role: 'user'}

6. What does user?.address?.city return if address is undefined?

Difficulty: MediumType: MCQTopic: Modern Syntax

Optional chaining returns undefined if any part of the chain is null or undefined, without throwing an error. When address is undefined, the expression stops evaluating and immediately returns undefined instead of trying to access city on undefined which would cause a TypeError. This makes code safer and cleaner by eliminating the need for multiple existence checks. It was introduced in ES2020 and works with object properties, array elements, and function calls.

Example code

// Optional chaining
let user = { name: 'John' };
console.log(user?.address?.city); // undefined (no error)

// Without optional chaining
// console.log(user.address.city); // TypeError!

// Traditional way
let city = user && user.address && user.address.city;

// With arrays
let arr = null;
console.log(arr?.[0]); // undefined

// With functions
let obj = {};
console.log(obj.method?.()); // undefined (no error)

// Real example
let data = { users: [{ name: 'Alice' }] };
console.log(data?.users?.[0]?.name); // 'Alice'
console.log(data?.users?.[5]?.name); // undefined

// API response
let response = await fetch('/api/user');
let userName = response?.data?.user?.name ?? 'Guest';

7. What is the result of 10 + '5' in JavaScript?

Difficulty: EasyType: MCQTopic: JS Operators

The result is the string 105 because of type coercion. When the plus operator is used with a string and a number, JavaScript converts the number to a string and performs concatenation instead of addition. The number 10 becomes the string 10, then concatenates with the string 5 to produce 105. Key rule to remember: The plus operator with any string performs string concatenation. Other arithmetic operators like minus, multiply, and divide perform numeric conversion. This is a common source of bugs, so always be careful when using plus with mixed types.

Example code

console.log(10 + '5');    // '105' (string concatenation)
console.log(10 - '5');    // 5 (numeric subtraction)
console.log(10 * '5');    // 50 (numeric multiplication)
console.log('10' / '5');  // 2 (numeric division)

// Force numeric addition
console.log(10 + Number('5')); // 15
console.log(10 + (+'5'));      // 15 (unary plus)

// Multiple operations
console.log(10 + 5 + '5');  // '155' (15 + '5')
console.log('5' + 10 + 5);  // '5105' (all strings)

8. What does the expression 0 || 'Hello' || false return?

Difficulty: MediumType: MCQTopic: JS Operators

The result is the string Hello. The logical OR operator returns the first truthy value it encounters. It evaluates from left to right. Zero is falsy, so it skips it. Hello is truthy, so it immediately returns Hello without checking false. This is called short-circuit evaluation. Once a truthy value is found, the rest is not evaluated. This behavior is useful for setting default values. If all values were falsy, it would return the last value.

Example code

// OR returns first truthy value
console.log(0 || 'Hello' || false);     // 'Hello'
console.log(false || null || 'World');  // 'World'
console.log(false || 0 || '');          // '' (last value)

// Common pattern for defaults
function greet(name) {
  name = name || 'Guest';
  console.log('Hello ' + name);
}
greet();           // 'Hello Guest'
greet('John');     // 'Hello John'

// AND returns first falsy or last value
console.log(true && 'Hello' && 5);      // 5
console.log('Hi' && 0 && 'Bye');        // 0

// Short-circuit example
let count = 0;
console.log(true || count++);  // true (count++ never runs)
console.log(count);             // 0 (not incremented)

9. What is the difference between x++ and ++x?

Difficulty: MediumType: MCQTopic: JS Operators

Post increment returns the current value first, then increments the variable. Pre increment increments the variable first, then returns the new value. The difference matters when the expression is used in an assignment or comparison. If you just write the increment on its own line, both behave the same way. Post increment is more commonly used in loops, but understanding the difference prevents bugs in complex expressions.

Example code

// Post-increment (x++)
let a = 5;
let b = a++; // b gets 5, then a becomes 6
console.log(b); // 5
console.log(a); // 6

// Pre-increment (++x)
let x = 5;
let y = ++x; // x becomes 6, then y gets 6
console.log(y); // 6
console.log(x); // 6

// Common in loops
for (let i = 0; i < 5; i++) { // Post-increment
  console.log(i); // 0, 1, 2, 3, 4
}

// In comparisons
let num = 10;
console.log(num++ === 10); // true (compares before increment)
console.log(num);          // 11

let num2 = 10;
console.log(++num2 === 10); // false (increments before compare)
console.log(num2);          // 11

10. Explain type coercion in JavaScript with examples. How do different operators handle it?

Difficulty: MediumType: SubjectiveTopic: JS Operators

Type coercion is JavaScript's automatic conversion of values from one data type to another. It happens when operators or comparisons are used with mixed types. The plus operator performs string concatenation if either operand is a string, converting the other to string. Other arithmetic operators like minus, multiply, divide always convert operands to numbers. Comparison operators like double equals perform type coercion before comparing, while triple equals does not. The logical operators OR and AND work with truthy and falsy values, using implicit boolean conversion. Understanding coercion is crucial because it can cause unexpected bugs. To avoid issues: Use explicit conversion with Number, String, or Boolean functions. Always use triple equals for comparisons. Be careful with the plus operator when dealing with mixed types.

Example code

// String coercion with +
console.log(5 + '5');        // '55' (number to string)
console.log('Hello' + true); // 'Hellotrue'

// Number coercion with other operators
console.log('10' - 5);       // 5 (string to number)
console.log('10' * '2');     // 20
console.log('10' / '2');     // 5
console.log('5' - true);     // 4 (true becomes 1)

// Boolean coercion
console.log(!'hello');       // false (string is truthy)
console.log(!0);             // true (0 is falsy)

// Comparison coercion
console.log(5 == '5');       // true (coerces types)
console.log(5 === '5');      // false (no coercion)
console.log(null == undefined); // true (special case)

// Explicit conversion
console.log(Number('42'));   // 42
console.log(String(42));     // '42'
console.log(Boolean(0));     // false

// Tricky examples
console.log('5' + 3 - 2);    // 51 ('53' - 2)
console.log([] + []);        // '' (empty string)
console.log([] + {});        // '[object Object]'
console.log({} + []);        // '[object Object]'

11. What are the different ways to define functions in JavaScript? Compare function declarations, expressions, and arrow functions.

Difficulty: MediumType: SubjectiveTopic: JS Functions

JavaScript has three main ways to define functions. Function declaration uses the function keyword followed by a name. It creates a named function that is fully hoisted and can be called before its definition. Good for top level functions and when you need hoisting. Function expression assigns a function to a variable. It can be named or anonymous. It follows variable hoisting rules so cannot be called before assignment. Useful for conditional function creation or passing functions as values. Arrow function introduced in ES6 provides shorter syntax. It does not have its own this binding and inherits from parent scope. Cannot be used as constructor with new. Has implicit return for single expressions. Ideal for callbacks, array methods, and when you want lexical this binding. When to use what: Use function declarations for main functions that need hoisting. Use function expressions for functions as values or conditional creation. Use arrow functions for callbacks and when you need lexical this. Choose based on your needs for hoisting, this binding, and syntax preference.

Example code

// Function Declaration
function greet(name) {
  return 'Hello ' + name;
}
// Hoisted - can call before definition
// Has own 'this'
// Can be used as constructor

// Function Expression
const sayHi = function(name) {
  return 'Hi ' + name;
};
// Not hoisted - cannot call before
// Has own 'this'
// Anonymous or named

// Arrow Function
const welcome = (name) => {
  return 'Welcome ' + name;
};
// Shorter version
const greetShort = name => 'Hello ' + name;
// Not hoisted
// Lexical 'this' from parent
// Cannot be constructor
// Implicit return for single expression

// Use cases

// Callbacks with arrow function
[1, 2, 3].map(n => n * 2);

// Method with regular function
const obj = {
  name: 'Object',
  greet: function() {
    console.log(this.name); // Works
  }
};

// Event handler needs this
button.addEventListener('click', function() {
  console.log(this); // button element
});

12. What are rest parameters? How do they differ from the arguments object?

Difficulty: MediumType: SubjectiveTopic: Modern Syntax

Rest parameters use three dots before the parameter name to collect all remaining arguments into a real array. Unlike the arguments object which is array-like but not a real array, rest parameters are actual arrays with all array methods available. Rest parameters must be the last parameter in the function signature. They provide a cleaner way to handle variable number of arguments compared to the arguments object. Arrow functions do not have arguments object, so rest parameters are the only way to access all arguments in arrow functions. Rest parameters make code more readable and are preferred in modern JavaScript over the arguments object.

Example code

// Rest parameters - real array
function sum(...numbers) {
  return numbers.reduce((total, num) => total + num, 0);
}
console.log(sum(1, 2, 3, 4)); // 10

// Can use array methods
function getMax(...nums) {
  return Math.max(...nums);
}
console.log(getMax(5, 2, 9, 1)); // 9

// Mixed parameters
function introduce(greeting, ...names) {
  return greeting + ' ' + names.join(' and ');
}
console.log(introduce('Hello', 'John', 'Jane')); // 'Hello John and Jane'

// Arrow function with rest
const multiply = (...nums) => {
  return nums.reduce((product, num) => product * num, 1);
};
console.log(multiply(2, 3, 4)); // 24

// Arguments object (old way)
function oldSum() {
  let total = 0;
  for (let i = 0; i < arguments.length; i++) {
    total += arguments[i];
  }
  return total;
}
// arguments is array-like, not real array
// Does not work in arrow functions

// Rest vs arguments
function compare(...args) {
  console.log(Array.isArray(args)); // true
  console.log(args.map(x => x * 2)); // Works!
}

13. Explain the spread operator. What are its common use cases in JavaScript?

Difficulty: MediumType: SubjectiveTopic: Modern Syntax

The spread operator uses three dots to expand an iterable like array or object into individual elements. For arrays, it expands elements for function arguments, copying arrays, or combining arrays. For objects, it copies properties and can be used for merging objects, with later properties overwriting earlier ones. Spread creates shallow copies, meaning nested objects or arrays are still referenced. It provides cleaner syntax compared to older methods like concat or Object assign. Common use cases: Passing array as function arguments. Cloning arrays or objects. Merging multiple arrays or objects. Converting iterables like strings into arrays. Understanding spread operator is essential for modern JavaScript as it is widely used in React and other frameworks.

Example code

// Array spreading
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combined = [...arr1, ...arr2]; // [1,2,3,4,5,6]

// Copy array
const original = [1, 2, 3];
const copy = [...original];
copy.push(4); // Does not affect original

// Function arguments
const numbers = [5, 10, 15];
console.log(Math.max(...numbers)); // 15
// Same as: Math.max(5, 10, 15)

// Object spreading
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const merged = { ...obj1, ...obj2 }; // {a:1, b:2, c:3, d:4}

// Override properties
const user = { name: 'John', age: 30 };
const updated = { ...user, age: 31 }; // age overwritten

// String to array
const str = 'hello';
const chars = [...str]; // ['h','e','l','l','o']

// Add elements while spreading
const nums = [2, 3, 4];
const extended = [1, ...nums, 5]; // [1,2,3,4,5]

// Shallow copy warning
const nested = { x: 1, y: { z: 2 } };
const shallowCopy = { ...nested };
shallowCopy.y.z = 3; // Also changes nested.y.z!

14. What is the correct syntax of the ternary operator?

Difficulty: EasyType: MCQTopic: JS Operators

The ternary operator syntax is: condition ? valueIfTrue : valueIfFalse It is a shorthand for if else statements. The condition is evaluated first. If true, it returns the value after the question mark. If false, it returns the value after the colon. It is the only JavaScript operator that takes three operands, hence the name ternary. Use it for simple conditions to make code more concise. Avoid nesting multiple ternary operators as it reduces readability.

Example code

// Basic ternary
let age = 20;
let status = age >= 18 ? 'Adult' : 'Minor';
console.log(status); // 'Adult'

// Same as if-else
let status2;
if (age >= 18) {
  status2 = 'Adult';
} else {
  status2 = 'Minor';
}

// In function return
function checkEven(num) {
  return num % 2 === 0 ? 'Even' : 'Odd';
}
console.log(checkEven(4)); // 'Even'
console.log(checkEven(7)); // 'Odd'

// Inline usage
let score = 85;
console.log('You ' + (score >= 60 ? 'passed' : 'failed'));

// Avoid deep nesting (hard to read)
let grade = score > 90 ? 'A' : score > 80 ? 'B' : 'C';

15. What is the main difference between arrow functions and regular functions?

Difficulty: MediumType: MCQTopic: Arrow Functions

The main difference is that arrow functions do not have their own this binding. They inherit this from the parent scope where they are defined, called lexical this. Regular functions have their own this which depends on how the function is called. Arrow functions also do not have arguments object, cannot be used as constructors with new, and do not have prototype property. They provide shorter syntax and are commonly used for callbacks and functional programming patterns.

Example code

// Arrow function - lexical this
const obj = {
  name: 'Object',
  regularFunc: function() {
    console.log(this.name); // 'Object'
  },
  arrowFunc: () => {
    console.log(this.name); // undefined (uses parent scope this)
  }
};

obj.regularFunc(); // 'Object'
obj.arrowFunc();   // undefined

// Arrow syntax variations
const add1 = (a, b) => { return a + b; };
const add2 = (a, b) => a + b; // Implicit return
const square = x => x * x; // Single param, no parentheses
const greet = () => 'Hello'; // No params

// Cannot use as constructor
const Person = (name) => { this.name = name; };
// const p = new Person('John'); // TypeError

// Use cases
const numbers = [1, 2, 3];
const doubled = numbers.map(n => n * 2); // Clean callback
console.log(doubled); // [2, 4, 6]

More sets in Javascript

JavaScript Fundamentals(15+ Questions)
Arrays and Loops(15+ Questions)
Functions - Part 1(13+ Questions)
JavaScript Core Interview Essentials(13+ Questions)
Closures and Asynchronous JavaScript(14+ Questions)
Objects & Prototypes(12+ Questions)
Objects and this Keyword(15+ Questions)
Strings and Template Literals(15+ Questions)
Prototypes and Inheritance(14+ Questions)
ES6+ Advanced Features(12+ Questions)
Performance Optimization and Advanced Techniques(10+ Questions)
Call, Apply, Bind and Advanced Functions(14+ Questions)
DOM Manipulation and Events(12+ Questions)

Explore related subjects

HTML CSS Typescript SQL & Databases React Node Js

Continue your preparation

For complete preparation, combine this set with full subject-wise practice for Javascript. You can also explore other subjects and sets from the links below.

Quick navigation:Javascript subject page•All subjects

// No return statement function noReturn() { let x = 5; } console.log(noReturn()); // undefined // Empty return function emptyReturn() { return; } console.log(emptyReturn()); // undefined // Return with value function withReturn() { return 42; } console.log(withReturn()); // 42 // Early return function checkAge(age) { if (age < 18) { return 'Too young'; } return 'Welcome'; } // Common mistake function calculate() { let result = 10 * 5; // Forgot to return! } console.log(calculate()); // undefined

// Nullish coalescing - only null/undefined console.log(null ?? 'default'); // 'default' console.log(undefined ?? 'default'); // 'default' console.log(0 ?? 'default'); // 0 (keeps 0) console.log('' ?? 'default'); // '' (keeps empty string) console.log(false ?? 'default'); // false (keeps false) // Compare with OR operator console.log(0 || 'default'); // 'default' (treats 0 as falsy) console.log('' || 'default'); // 'default' (treats '' as falsy) // Practical use function setPort(port) { return port ?? 3000; // Keeps 0 as valid port } console.log(setPort(8080)); // 8080 console.log(setPort(0)); // 0 (not 3000!) console.log(setPort(null)); // 3000 // User settings let volume = settings.volume ?? 50; // 0 is valid volume

// Function declaration - can call before definition greet(); // Works! Prints 'Hello' function greet() { console.log('Hello'); } // Function expression - cannot call before definition // sayBye(); // TypeError: sayBye is not a function let sayBye = function() { console.log('Bye'); }; // Arrow function - cannot call before definition // welcome(); // ReferenceError const welcome = () => { console.log('Welcome'); }; // Why function declaration works function calculate(a, b) { return a + b; } // JavaScript sees it as: // Function moved to top, then code runs console.log(calculate(5, 3)); // 8

// Basic default parameters function greet(name = 'Guest', greeting = 'Hello') { return greeting + ' ' + name; } console.log(greet()); // 'Hello Guest' console.log(greet('John')); // 'Hello John' console.log(greet('John', 'Hi')); // 'Hi John' // undefined triggers default console.log(greet(undefined, 'Hey')); // 'Hey Guest' // null does not trigger default console.log(greet(null)); // 'Hello null' // Expression as default function multiply(a, b = a * 2) { return a * b; } console.log(multiply(5)); // 25 (5 * 10) console.log(multiply(5, 3)); // 15 // Function call as default function getDefault() { return 'Default Value'; } function demo(value = getDefault()) { return value; } console.log(demo()); // 'Default Value' console.log(demo('Hi')); // 'Hi' // Multiple defaults function createUser(name = 'Anonymous', age = 18, role = 'user') { return { name, age, role }; } console.log(createUser()); // {name: 'Anonymous', age: 18, role: 'user'}

// Optional chaining let user = { name: 'John' }; console.log(user?.address?.city); // undefined (no error) // Without optional chaining // console.log(user.address.city); // TypeError! // Traditional way let city = user && user.address && user.address.city; // With arrays let arr = null; console.log(arr?.[0]); // undefined // With functions let obj = {}; console.log(obj.method?.()); // undefined (no error) // Real example let data = { users: [{ name: 'Alice' }] }; console.log(data?.users?.[0]?.name); // 'Alice' console.log(data?.users?.[5]?.name); // undefined // API response let response = await fetch('/api/user'); let userName = response?.data?.user?.name ?? 'Guest';

console.log(10 + '5'); // '105' (string concatenation) console.log(10 - '5'); // 5 (numeric subtraction) console.log(10 * '5'); // 50 (numeric multiplication) console.log('10' / '5'); // 2 (numeric division) // Force numeric addition console.log(10 + Number('5')); // 15 console.log(10 + (+'5')); // 15 (unary plus) // Multiple operations console.log(10 + 5 + '5'); // '155' (15 + '5') console.log('5' + 10 + 5); // '5105' (all strings)

// OR returns first truthy value console.log(0 || 'Hello' || false); // 'Hello' console.log(false || null || 'World'); // 'World' console.log(false || 0 || ''); // '' (last value) // Common pattern for defaults function greet(name) { name = name || 'Guest'; console.log('Hello ' + name); } greet(); // 'Hello Guest' greet('John'); // 'Hello John' // AND returns first falsy or last value console.log(true && 'Hello' && 5); // 5 console.log('Hi' && 0 && 'Bye'); // 0 // Short-circuit example let count = 0; console.log(true || count++); // true (count++ never runs) console.log(count); // 0 (not incremented)

// Post-increment (x++) let a = 5; let b = a++; // b gets 5, then a becomes 6 console.log(b); // 5 console.log(a); // 6 // Pre-increment (++x) let x = 5; let y = ++x; // x becomes 6, then y gets 6 console.log(y); // 6 console.log(x); // 6 // Common in loops for (let i = 0; i < 5; i++) { // Post-increment console.log(i); // 0, 1, 2, 3, 4 } // In comparisons let num = 10; console.log(num++ === 10); // true (compares before increment) console.log(num); // 11 let num2 = 10; console.log(++num2 === 10); // false (increments before compare) console.log(num2); // 11

// String coercion with + console.log(5 + '5'); // '55' (number to string) console.log('Hello' + true); // 'Hellotrue' // Number coercion with other operators console.log('10' - 5); // 5 (string to number) console.log('10' * '2'); // 20 console.log('10' / '2'); // 5 console.log('5' - true); // 4 (true becomes 1) // Boolean coercion console.log(!'hello'); // false (string is truthy) console.log(!0); // true (0 is falsy) // Comparison coercion console.log(5 == '5'); // true (coerces types) console.log(5 === '5'); // false (no coercion) console.log(null == undefined); // true (special case) // Explicit conversion console.log(Number('42')); // 42 console.log(String(42)); // '42' console.log(Boolean(0)); // false // Tricky examples console.log('5' + 3 - 2); // 51 ('53' - 2) console.log([] + []); // '' (empty string) console.log([] + {}); // '[object Object]' console.log({} + []); // '[object Object]'

// Function Declaration function greet(name) { return 'Hello ' + name; } // Hoisted - can call before definition // Has own 'this' // Can be used as constructor // Function Expression const sayHi = function(name) { return 'Hi ' + name; }; // Not hoisted - cannot call before // Has own 'this' // Anonymous or named // Arrow Function const welcome = (name) => { return 'Welcome ' + name; }; // Shorter version const greetShort = name => 'Hello ' + name; // Not hoisted // Lexical 'this' from parent // Cannot be constructor // Implicit return for single expression // Use cases // Callbacks with arrow function [1, 2, 3].map(n => n * 2); // Method with regular function const obj = { name: 'Object', greet: function() { console.log(this.name); // Works } }; // Event handler needs this button.addEventListener('click', function() { console.log(this); // button element });

// Rest parameters - real array function sum(...numbers) { return numbers.reduce((total, num) => total + num, 0); } console.log(sum(1, 2, 3, 4)); // 10 // Can use array methods function getMax(...nums) { return Math.max(...nums); } console.log(getMax(5, 2, 9, 1)); // 9 // Mixed parameters function introduce(greeting, ...names) { return greeting + ' ' + names.join(' and '); } console.log(introduce('Hello', 'John', 'Jane')); // 'Hello John and Jane' // Arrow function with rest const multiply = (...nums) => { return nums.reduce((product, num) => product * num, 1); }; console.log(multiply(2, 3, 4)); // 24 // Arguments object (old way) function oldSum() { let total = 0; for (let i = 0; i < arguments.length; i++) { total += arguments[i]; } return total; } // arguments is array-like, not real array // Does not work in arrow functions // Rest vs arguments function compare(...args) { console.log(Array.isArray(args)); // true console.log(args.map(x => x * 2)); // Works! }

// Array spreading const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const combined = [...arr1, ...arr2]; // [1,2,3,4,5,6] // Copy array const original = [1, 2, 3]; const copy = [...original]; copy.push(4); // Does not affect original // Function arguments const numbers = [5, 10, 15]; console.log(Math.max(...numbers)); // 15 // Same as: Math.max(5, 10, 15) // Object spreading const obj1 = { a: 1, b: 2 }; const obj2 = { c: 3, d: 4 }; const merged = { ...obj1, ...obj2 }; // {a:1, b:2, c:3, d:4} // Override properties const user = { name: 'John', age: 30 }; const updated = { ...user, age: 31 }; // age overwritten // String to array const str = 'hello'; const chars = [...str]; // ['h','e','l','l','o'] // Add elements while spreading const nums = [2, 3, 4]; const extended = [1, ...nums, 5]; // [1,2,3,4,5] // Shallow copy warning const nested = { x: 1, y: { z: 2 } }; const shallowCopy = { ...nested }; shallowCopy.y.z = 3; // Also changes nested.y.z!

// Basic ternary let age = 20; let status = age >= 18 ? 'Adult' : 'Minor'; console.log(status); // 'Adult' // Same as if-else let status2; if (age >= 18) { status2 = 'Adult'; } else { status2 = 'Minor'; } // In function return function checkEven(num) { return num % 2 === 0 ? 'Even' : 'Odd'; } console.log(checkEven(4)); // 'Even' console.log(checkEven(7)); // 'Odd' // Inline usage let score = 85; console.log('You ' + (score >= 60 ? 'passed' : 'failed')); // Avoid deep nesting (hard to read) let grade = score > 90 ? 'A' : score > 80 ? 'B' : 'C';

// Arrow function - lexical this const obj = { name: 'Object', regularFunc: function() { console.log(this.name); // 'Object' }, arrowFunc: () => { console.log(this.name); // undefined (uses parent scope this) } }; obj.regularFunc(); // 'Object' obj.arrowFunc(); // undefined // Arrow syntax variations const add1 = (a, b) => { return a + b; }; const add2 = (a, b) => a + b; // Implicit return const square = x => x * x; // Single param, no parentheses const greet = () => 'Hello'; // No params // Cannot use as constructor const Person = (name) => { this.name = name; }; // const p = new Person('John'); // TypeError // Use cases const numbers = [1, 2, 3]; const doubled = numbers.map(n => n * 2); // Clean callback console.log(doubled); // [2, 4, 6]

Operators and Functions – Javascript interview questions

Set overview

1. What does a function return if there is no return statement?

2. What does the nullish coalescing operator (??) do?

3. Can you call a function declaration before it is defined in the code?

4. What happens if you call a function with fewer arguments than parameters?

5. Explain default parameters in JavaScript functions. How do they work with undefined and null?

6. What does user?.address?.city return if address is undefined?

7. What is the result of 10 + '5' in JavaScript?

8. What does the expression 0 || 'Hello' || false return?

9. What is the difference between x++ and ++x?

10. Explain type coercion in JavaScript with examples. How do different operators handle it?

11. What are the different ways to define functions in JavaScript? Compare function declarations, expressions, and arrow functions.

12. What are rest parameters? How do they differ from the arguments object?

13. Explain the spread operator. What are its common use cases in JavaScript?

14. What is the correct syntax of the ternary operator?

15. What is the main difference between arrow functions and regular functions?

More sets in Javascript

Explore related subjects

Continue your preparation

Master Interviews Anywhere, Anytime

Operators and Functions – Javascript interview questions

Set overview

1. What does a function return if there is no return statement?

2. What does the nullish coalescing operator (??) do?

3. Can you call a function declaration before it is defined in the code?

4. What happens if you call a function with fewer arguments than parameters?

5. Explain default parameters in JavaScript functions. How do they work with undefined and null?

6. What does user?.address?.city return if address is undefined?

7. What is the result of 10 + '5' in JavaScript?

8. What does the expression 0 || 'Hello' || false return?

9. What is the difference between x++ and ++x?

10. Explain type coercion in JavaScript with examples. How do different operators handle it?

11. What are the different ways to define functions in JavaScript? Compare function declarations, expressions, and arrow functions.

12. What are rest parameters? How do they differ from the arguments object?

13. Explain the spread operator. What are its common use cases in JavaScript?

14. What is the correct syntax of the ternary operator?

15. What is the main difference between arrow functions and regular functions?

More sets in Javascript

Explore related subjects

Continue your preparation

Master Interviews
Anywhere, Anytime