Truncating a string in JavaScript means cutting it down to a certain length and optionally adding an ellipsis or other ending. This guide covers multiple methods to achieve string truncation tailored for different scenarios.

Understanding string truncation

Truncation is the process of shortening a string by removing characters from the end until it reaches a specified length. Developers might truncate strings to maintain a clean UI where space is limited or to create previews of longer text.

Using the slice method

The slice method is the go-to for basic truncation without ending characters:

Copy text
let str = "The quick brown fox jumps over the lazy dog";
let truncated = str.slice(0, 16); // "The quick brown f"

Adding an ellipsis with slice

To add an ellipsis or any other ending after truncation, concatenate it:

Copy text
let truncated = str.slice(0, 16) + '...'; // "The quick brown f..."

Creating a truncate function

For reusability, define a function to truncate strings and append an optional ending:

Copy text
function truncateString(str, length, ending = '...') {
  if (str.length > length) {
    return str.slice(0, length - ending.length) + ending;
  }
  return str;
}

Using substring for truncation

The substring method is similar to slice, but it does not accept negative indices:

Copy text
let truncated = str.substring(0, 16); // "The quick brown f"

Handling edge cases

Always check the string's length to avoid unnecessary operations:

Copy text
function safeTruncate(str, length, ending = '...') {
  if (str.length <= length) return str;
  return str.slice(0, length - ending.length) + ending;
}

Using modern JavaScript features

Template literals and the ternary operator can make truncation more readable:

Copy text
const truncateES6 = (str, length, ending = '...') =>
  `${str.length > length ? str.slice(0, length - ending.length) + ending : str}`;

Truncating without cutting words

To avoid cutting words, use the lastIndexOf method to find the last space within the limit:

Copy text
function truncateAtLastSpace(str, length, ending = '...') {
  if (str.length <= length) return str;
  let trimmedString = str.slice(0, length + 1);
  return trimmedString.slice(0, Math.min(trimmedString.length, trimmedString.lastIndexOf(' '))) + ending;
}