Skip to content
RED SAGSkills
medium30 ptsfrontendparsingstrings

Render a Template with Filters

Email and notification templates use placeholders like {{ user.name | capitalize }}. Render template with data.

A placeholder is {{, then any characters other than { and }, then }}. Inside, split on | and trim each part: the first part is a dotted path looked up in data, the rest are filters applied left to right. If the path leads to a string, number or boolean, convert it with String; anything else (missing, null, an object or an array) becomes "".

Filters: upper, lower, trim, and capitalize (upper-case the first character, leave the rest). Unknown filters are ignored. Text outside placeholders, including an unclosed {{, is copied unchanged.

Example 1

Input: template = "Hello {{ user.name | capitalize }}, you have {{count}} new messages", data = {"user":{"name":"riya"},"count":3}
Output: "Hello Riya, you have 3 new messages"
Explanation: Path lookup plus a filter.

Example 2

Input: template = "Hi {{ missing }}!", data = {}
Output: "Hi !"
Explanation: Missing values render as nothing.

Constraints

  • 0 <= template.length <= 10^5
  • Path segments are plain property names or array indexes
Hint 1

template.replace(/\{\{([^{}]*)\}\}/g, fn) finds every placeholder.

Hint 2

Stop the path walk as soon as you hit something that is not an object.

Good practice for: Frontend Developer, Full Stack Developer, Mobile App Developer, Automation Test Engineer, Backend Developer

Run checks your code on 3 sample tests. Submit runs all 9 tests, including hidden ones, and earns points. Use console.log to debug. Python's first run can take a few seconds while it starts.