← Back to Portfolio

➕ Operators

String Operations

Project Evidence Required

Path concatenation and on-screen text display.

Assessment Method

Code review: Template literals, concatenation

What it is

Strings can be combined with + (concatenation) or built with template literals using backticks and ${expression} placeholders. Template literals are usually cleaner because they let you embed variables and expressions inline without breaking the string apart.

Why it matters

Game text is dynamic. Sprite paths depend on frame indexes; HUD text depends on score; dialogue often interpolates the player’s name. String operations let you build these dynamic strings cleanly.

How GateGame implements it

Asset path concatenation builds image URLs from a base directory plus a filename. Template literals would build HUD text like `Score: ${score}` or dialogue like `Welcome, ${playerName}!`. The dialogue system itself joins strings of speaker name + body text for display.

Code Example

// Concatenation
const baseUrl = '/assets/sprites';
const path = baseUrl + '/octopus.png';

// Template literal (preferred for interpolation)
const hud  = `Score: ${score}  Lives: ${lives}`;
const line = `Welcome, ${playerName}! The maze awaits.`;

Key Takeaway

Use template literals (`${...}`) when interpolating; reserve + concatenation for joining two static halves of a path or label.

---