Arithmetic and Compound Assignment Operators

JavaScript provides concise syntax for mathematical operations combined with variable assignment. The modulo operator (%) returns the remainder of division, while the exponentiation operator (**) raisees a base to a power, functioning identically to Math.pow().

let remainder = 17 % 5; // Evaluates to 2
let exponent = 3 ** 4;  // Evaluates to 81

let counter = 15;
counter += 5; // Equivalent to counter = counter + 5; Result: 20

Logical Assignment and Nullish Coalescing

Logical assignment operators combine logical evaluation with assignment. The &&= operator assigns a value only if the left operand is truthy. Conversely, ||= assigns only when the left operand is falsy. The nullish coalescing assignment (??=) is stricter, triggering assignment exclusively when the left operand is null or undefined.

The nullish coalescing operator (??) returns the right-hand operand when the left is null or undefined, preserving other falsy values like 0 or ''.

let isActive = true;
isActive &&= false; // Assigns false because LHS is truthy

let username = '';
username ||= 'anonymous'; // Assigns 'anonymous' because LHS is falsy

let threshold = 0;
threshold ??= 50; // Remains 0 because LHS is not null/undefined

let fallback = null ?? 'default_value'; // Returns 'default_value'
let preserved = '' ?? 'ignored';        // Returns ''

Optional Chaining and Spread Syntax

Optional chaining (?.) safely accesses nested object properties or invokes methods without throwing errors if an intermediate reference is null or undefined. It short-circuits and returns undefined when a chain breaks.

The spread syntax (...) expands iterable elements into individual arguments or object properties. It performs a shallow copy when applied to objects or arrays.

let payload = {
  metadata: {
    process: () => 'executed'
  }
};

console.log(payload.config?.timeout); // undefined (safe access)
console.log(payload.metadata?.process?.()); // 'executed'

let baseArray = [10, 20];
let expanded = [...baseArray, 30, ...'xyz']; // [10, 20, 30, 'x', 'y', 'z']

let original = { a: 1, b: 2 };
let shallowCopy = { ...original, c: 3 }; // { a: 1, b: 2, c: 3 }

function gather(...args) {
  return args.filter(n => typeof n === 'number');
}
gather(1, 'two', 3, 4); // Returns [1, 3, 4]

Comma, Conditional, and Mutation Operators

The comma operator (,) evaluates multiple expresisons from left to right and returns the result of the final expression. The conditional (ternary) operator (?:) provides a concise inline if-else structure. Prefix and postfix decrement operators (--) modify variables in place, differing only in their return timing. The delete operator removes a property from an object.

let index = 4;
let result = (index += 2, index * 10); // Evaluates both, returns 60

let code = 500;
let status = code < 400 ? 'success' : 'failure'; // 'failure'

let value = 10;
let post = value--; // Returns 10, value becomes 9
let pre = --value;  // Returns 8, value becomes 8

let cache = { id: 99, temp: 'clear' };
delete cache.temp; // Removes property, returns true

Asynchronous Generator Expressions

Async generator functions (async function*) combine asynchronous execution with lazy evaluation. They use yield to pause execution and emit values, and yield* to delegate to another iterable. Consumption typically involves the for await...of loop, which handles promised values sequentially.

async function* dataPipeline() {
  yield await Promise.resolve(100);
  yield await Promise.resolve(200);
  yield await Promise.resolve(300);
}

async function consumePipeline() {
  let sum = 0;
  for await (const chunk of dataPipeline()) {
    sum += chunk;
  }
  return sum; // Resolves to 600
}

let stream = dataPipeline();
stream.next().then(({ value }) => console.log(value)); // Logs 100
stream.next().then(({ value }) => console.log(value)); // Logs 200