Как правильно обрезать строку и заменить обрезаное многоточием?

Question

[Максим Золотой]

Как можно обрезать строку так, что бы она была ровной в независимости от ширины букв? Использовать моноширинный шрифт не вариант.
Сейчас я обрезаю вот таким кодом

cutString(string, cutFrom) {
        string = string.split('');

        if (string.length > cutFrom) {
            for (let i = 0; i < string.length; i++) {
                if (i === cutFrom - 1) {
                    string[i] = '...';
                } else if (i > cutFrom - 1) {
                    string[i] = '';
                }
            }
        }

        return string.join('');
    }

Comments

[Absolute138]

что бы она была ровной в независимости от ширины букв

"Ровной" - относительно чего? Относительно других строк или некоего значения ширины?

Answer 1

[Дмитрий]

А вам точно надо делать это джаваскриптом? text-overflow: ellipsis не подойдет?

Если нет, то понадобится отрендерить строку в браузере и получить размеры DOM-элемента, чтобы затем вычислить допустимое количество символов.

Comments

[Максим Золотой]

Два с половиной года сайты делаю и первый раз слышу про это) спасибо, помогло)

Answer 2

[Absolute138]

String.prototype.ellipsis = function(n){
  return this.slice(0,n)+'...';
};
var my_str = 'Моя длинная строка';
console.log( my_str.ellipsis(8) );    // "Моя длин..."

Answer 3

[ivandao]

Не знаю как правильно, но я делал так:

// Метод скоращения строки
// Показывает последние n-исмовлов, остальное заменяет на ...
String.prototype.shortStr = function(n) { 
    const dots = '...'
    let string = this.toString()

    if ( string.length <= n ){
        return this
    } else {
        return dots + string.substring(string.length - n)
    }
}

Если что не так - принимаю критику