lmbtje

Если нужно обрезать строку, а также удалить и определенные символы с конца строки(лишние точки, запятые, пробелы и прочее), перед добавлением троеточия, тогда можно сделать вот так:

const truncateStringByLimitChars = ({ target, limit, pattern, useREGEx = true }) => {
  const ignoredChars = new RegExp(`[${pattern}]+$`, "g");

  const truncateString = () => {
    return useREGEx === false
      ? target.substring(0, limit).trim() + "..."
      : target.substring(0, limit).replace(ignoredChars, "").trim() + "...";
  };

  return target.length >= limit ? truncateString() : target;
};

Пример использования:

console.log(
  truncateStringByLimitChars({
    target: "1234_______",
    limit: 8,
    pattern: [",", ".", "_"]
  })
);

Однако в таком случае - финальный размер строки, может быть намного меньше указанного в лимите, потому что функция удалит с конца строки все "лишние" символы. Хотя в некоторых случаях это может быть полезно.

К примеру имеется строка: Hello__World. Обрезаем без удаления "лишних" символов до 7 символов:

let string = "Hello__World",

console.log(string.length > 7 ? string.slice(0, 7).trim() + "..." : string)

Результат: Hello__...

Наверное, ожидалось что в конце перед точками, не будет подчеркивания, однако оно есть и портит своим присутствием полученный результат. Тоже самое будет если вместо подчеркивания будет запятая, вопросительный знак, восклицательный знак и прочее.

Возможно такой результат не совсем так плох, но всё же, порой это выглядит не слишком, как-бы, красиво и/или удобно. А вот если удалить лишние символы, после обрезки по лимиту символов, то конечно финальный результат будет выглядеть лучше.

Однако это ещё не всё и при желании, можно дополнительно улучшить функцию - truncateStringByLimitChars, чтобы она корректно работала с такими строками:

Hello-World.loooooooong.image.name.sss.123456789.jpg

BackgroundImage_for__container.with.blog-news.cards.jpg

Допустим имеется такая строка: "BackgroundImageForContainerWithBlogNewsCards.jpg" - это название изображения, которое выводится в определенном блоке.

Пример:

<div>Файл "BackgroundImageForContainerWithBlogNewsCards.jpg" успешно загружен</div>

Задача: Обрезать эту длинную строку до 15 символов + сохранить расширение файла.

Можно конечно и не модифицировать функцию, чтобы получить желаемый результат, например склеивая обрезанную строку с полученным расширением файла вне функции truncateStringByLimitChars, но это уже другая история и поэтому всё же модифицируем функцию.

Модифицированная версия будет выглядеть так:

const truncateString = configuration => {
     const {
        targetString: target,
        limitWords: limit,
        pattern = [",", ".", "_"],
        useREGEx = true,
        suffix = "...",
        addFileExtension = false
    } = configuration;

     const ignoredChars = new RegExp(`[${pattern}]+$`, "g");

     const reduceContentByLimitCharset = () => {
          return useREGEx === false ?
             target.substring(0, limit).trim() :
             target.substring(0, limit).replace(ignoredChars, "").trim();
     };

     const updatedContent = () => {
          const croppedString = reduceContentByLimitCharset();
          const fileExtension = target.slice(target.lastIndexOf(".") + 1);

          return addFileExtension === false ?
             `${croppedString}${suffix}` :
             `${croppedString}${suffix} .${fileExtension}`;
     };

     return target.length >= limit ? updatedContent() : target;
};

Использование:

console.log(
     truncateString({
          targetString: "BackgroundImageForContainerWithBlogNewsCards.jpg",
          limitWords: 15,
          addFileExtension: true
     })
);

Результат: BackgroundImage... .jpg