Truncating a string shortens it to a maximum length and marks the removed tail with a short indicator — usually an ellipsis (...). It is the logic behind a card that shows the first line of an article and trails off, or a file list that keeps long names from breaking the layout. This is a re-implementation of Lodash's _.truncate: the result — text plus the indicator — never exceeds the limit, and you can optionally break on the last whole word instead of mid-character.
truncateString(
str: string,
options?: {
length?: number; // max length of the RESULT, default 30
omission?: string; // appended where text is cut, default '...'
separator?: string | RegExp; // if set, back up to the last match
}
): string
truncateString('The quick brown fox jumps over the lazy dog');
// 'The quick brown fox jumps o...' (exactly 30 chars)
truncateString('The quick brown fox', { length: 10 });
// 'The qui...'
// A separator retreats the cut to the last word boundary.
truncateString('hi-diddly-ho there, neighborino', { length: 24, separator: ' ' });
// 'hi-diddly-ho there,...'
// A custom omission — it still counts against the length.
truncateString('The quick brown fox jumps', { length: 20, omission: ' [more]' });
// 'The quick bro [more]'
omission.length first, then fill the remaining room with characters from str.str.length is at most length, return str with no omission appended. A string that already fits is never marked.separator is given (a string or a RegExp), retreat the cut to the last place it matches inside the room, so you never slice a word in half. Without it, the cut is exact.length, there is no room for text, so return just the omission (it may exceed length).The full solution is part of Premium
Walkthrough, edge cases, complexity notes, and the runnable editor unlock with a Premium subscription.
Submissions are part of Premium
Unlock community code, comments, reactions, and framework-specific approaches.
Truncating a string shortens it to a maximum length and marks the removed tail with a short indicator — usually an ellipsis (...). It is the logic behind a card that shows the first line of an article and trails off, or a file list that keeps long names from breaking the layout. This is a re-implementation of Lodash's _.truncate: the result — text plus the indicator — never exceeds the limit, and you can optionally break on the last whole word instead of mid-character.
truncateString(
str: string,
options?: {
length?: number; // max length of the RESULT, default 30
omission?: string; // appended where text is cut, default '...'
separator?: string | RegExp; // if set, back up to the last match
}
): string
truncateString('The quick brown fox jumps over the lazy dog');
// 'The quick brown fox jumps o...' (exactly 30 chars)
truncateString('The quick brown fox', { length: 10 });
// 'The qui...'
// A separator retreats the cut to the last word boundary.
truncateString('hi-diddly-ho there, neighborino', { length: 24, separator: ' ' });
// 'hi-diddly-ho there,...'
// A custom omission — it still counts against the length.
truncateString('The quick brown fox jumps', { length: 20, omission: ' [more]' });
// 'The quick bro [more]'
omission.length first, then fill the remaining room with characters from str.str.length is at most length, return str with no omission appended. A string that already fits is never marked.separator is given (a string or a RegExp), retreat the cut to the last place it matches inside the room, so you never slice a word in half. Without it, the cut is exact.length, there is no room for text, so return just the omission (it may exceed length).The full solution is part of Premium
Walkthrough, edge cases, complexity notes, and the runnable editor unlock with a Premium subscription.
Submissions are part of Premium
Unlock community code, comments, reactions, and framework-specific approaches.
Unlock the solution & editor
Runnable editor + tests
Solve in the browser with instant Jest feedback.
Detailed solutions
Walkthroughs, edge cases, and complexity notes.
Multi-framework variants
React, Vue, Vanilla, Angular — same question, different stacks.