¿Cómo recortar una cadena a N caracteres en Javascript?


169

¿Cómo puedo, usando Javascript, hacer una función que recorte la cadena pasada como argumento, a una longitud especificada, también pasada como argumento? Por ejemplo:

var string = "this is a string";
var length = 6;
var trimmedString = trimFunction(length, string);

// trimmedString should be:
// "this is"

Alguien tiene ideas? Escuché algo sobre el uso de la subcadena, pero no entendí del todo.


1
"esto es" = 7 caracteres, ¿pretendías eso?
aziz punjani

Como se dijo en la pregunta, no estoy muy seguro de cómo usar la subcadena para hacer esto. ¿Me podría dar un ejemplo? Aceptaré es una respuesta, por supuesto, si funciona;) @Interstellar_Coder ¡Uy, error tipográfico!

Respuestas:


346

¿Por qué no usar solo la subcadena ... string.substring(0, 7);El primer argumento (0) es el punto de partida. El segundo argumento (7) es el punto final (exclusivo). Más información aquí.

var string = "this is a string";
var length = 7;
var trimmedString = string.substring(0, length);

¡Gracias! Funciona perfectamente. ¡Lo marcaré como respuesta tan pronto como pase el límite de tiempo!

24
Y si desea puntos suspensivos para cadenas que exceden la longitud máxima (probablemente más útil para una longitud máxima): var string = "this is a string"; var longitud = 20; var trimmedString = string.length> length? string.substring (0, length - 3) + "...": string.substring (0, length);
Será el

55
Tenga en cuenta que string.substr (inicio, longitud) se comporta de forma extraña, volverá vacío si la longitud es mayor que la longitud de la cadena. string.substring (start, end) funciona como se esperaba, es decir, devolverá la cadena hasta su final si no hay suficientes caracteres para el final dado.
centic

1
Uso string.substr. No tiene un comportamiento extraño, a pesar del comentario anterior
Gibolt

.substring(from, to)tiene índices . .substr (from, length) no, también .substr () solía tener una inconsistencia en IE cuando el primer argumento es negativo.
Bob Stein

47

Copiando el comentario de Will en una respuesta, porque lo encontré útil:

var string = "this is a string";
var length = 20;
var trimmedString = string.length > length ? 
                    string.substring(0, length - 3) + "..." : 
                    string;

Gracias Will

Y un jsfiddle para cualquier persona que se preocupe https://jsfiddle.net/t354gw7e/ :)


1
No tiene sentido usarlo string.substring(0, length)en el caso else, ya que la cadena está garantizada para ser <= 20 caracteres en ese punto, solo use string.
Nick Sweeting

15

Sugiero usar una extensión para la limpieza del código. Tenga en cuenta que extender un prototipo de objeto interno podría potencialmente alterar las bibliotecas que dependen de ellos.

String.prototype.trimEllip = function (length) {
  return this.length > length ? this.substring(0, length) + "..." : this;
}

Y úsalo como:

var stringObject= 'this is a verrrryyyyyyyyyyyyyyyyyyyyyyyyyyyyylllooooooooooooonggggggggggggsssssssssssssttttttttttrrrrrrrrriiiiiiiiiiinnnnnnnnnnnnggggggggg';
stringObject.trimEllip(25)

55
Por qué no? Porque estás sobrescribiendo el prototipo de un objeto estándar .trim(). Esto puede causar un comportamiento inesperado en otras bibliotecas y herramientas que puede utilizar.
Oleg Berman

1
eso es lo que necesitaba
naneri


2

Poco tarde ... tuve que responder. Esta es la forma más simple.

// JavaScript
function fixedSize_JS(value, size) {
  return value.padEnd(size).substring(0, size);
}

// JavaScript (Alt)
var fixedSize_JSAlt = function(value, size) {
  return value.padEnd(size).substring(0, size);
}

// Prototype (preferred)
String.prototype.fixedSize = function(size) {
  return this.padEnd(size).substring(0, size);
}

// Overloaded Prototype
function fixedSize(value, size) {
  return value.fixedSize(size);
}

// usage
console.log('Old school JS -> "' + fixedSize_JS('test (30 characters)', 30) + '"');
console.log('Semi-Old school JS -> "' + fixedSize_JSAlt('test (10 characters)', 10) + '"');
console.log('Prototypes (Preferred) -> "' + 'test (25 characters)'.fixedSize(25) + '"');
console.log('Overloaded Prototype (Legacy support) -> "' + fixedSize('test (15 characters)', 15) + '"');

Paso a paso. .padEnd: garantiza la longitud de la cadena

"El método padEnd () rellena la cadena actual con una cadena dada (repetida, si es necesario) para que la cadena resultante alcance una longitud determinada. El relleno se aplica desde el extremo (derecha) de la cadena actual. El origen de esta interacción ejemplo se almacena en un repositorio de GitHub ". fuente: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

.substring: límites de la longitud que necesita

Si elige agregar puntos suspensivos, agréguelos a la salida.

Di 4 ejemplos de usos comunes de JavaScript. Recomiendo usar el prototipo de cadena con sobrecarga para soporte heredado. Hace que sea mucho más fácil de implementar y cambiar más tarde.


¡Hola! Es bueno también incluir alguna explicación sobre lo que está sucediendo con su código. Dado lo similar que es su solución a la respuesta aceptada, tal vez un pequeño detalle sobre lo que padEndestá haciendo.
Mattie

Mi solución es mucho más limpia y más estandarizada, además muestra múltiples usos. El método padEnd () rellena la cadena actual con una cadena dada (repetida, si es necesario) para que la cadena resultante alcance una longitud determinada. El relleno se aplica desde el final (derecha) de la cadena actual. La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. fuente: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Matthew Egan

1
No estoy cuestionando la calidad de su respuesta. Solo una sugerencia sobre cómo mejorarlo. Su explicación es excelente: edite su respuesta y colóquela allí.
Mattie

Hola Matt, me gusta tu respuesta. Es lamentable que estés respondiendo a una pregunta un poco diferente. Originalmente preguntó acerca de recortar una cadena, no una longitud de cadena fija de retorno.
Jakub Kriz

0
    let trimString = function (string, length) {
      return string.length > length ? 
             string.substring(0, length) + '...' :
             string;
    };

Caso de uso,

let string = 'How to trim a string to N chars in Javascript';

trimString(string, 20);

//How to trim a string...

-1

Creo que deberías usar este código :-)

    // sample string
            const param= "Hi you know anybody like pizaa";

         // You can change limit parameter(up to you)
         const checkTitle = (str, limit = 17) => {
      var newTitle = [];
      if (param.length >= limit) {
        param.split(" ").reduce((acc, cur) => {
          if (acc + cur.length <= limit) {
            newTitle.push(cur);
          }
          return acc + cur.length;
        }, 0);
        return `${newTitle.join(" ")} ...`;
      }
      return param;
    };
    console.log(checkTitle(str));

// result : Hi you know anybody ...

1
Tengo curiosidad por saber por qué agregaste esta respuesta. La pregunta ya tiene una respuesta aceptada y varias otras respuestas razonables, todas las cuales son más simples que esto. ¿O su ":-)" tenía la intención de hacer de esto una broma?
Scott Sauyet

Tenga en cuenta que la respuesta aceptada también es la respuesta mejor calificada. Creo que estás tratando de resolver un problema diferente aquí. (Y no me había dado cuenta de eso al comentar antes). No es que sea un problema poco probable, pero al final solo está ligeramente relacionado con la pregunta formulada. El suyo también tiene el extraño efecto de que con la entrada dada, su cadena de salida tiene 23caracteres largos, más largos que el 17parámetro predeterminado más los 4caracteres en el sufijo " ...". Eso parece extraño.
Scott Sauyet

También creo que esto podría usar una implementación más simple .
Scott Sauyet
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.