1

Tengo este siguiente objeto:

let userInformation = {
          description: "Esta es mi descripción",
          email: "[email protected]"
          full_name: "Josue Ayala"
          username: "jos"
          website: "es.stackoverflow.com/users/136931/josue-martinez"
      };

Cual es la manera correcta de aplicar el substring para agregar "..." al final de cada palabra después de 7 caracteres, en mi objeto para que mis elementos queden así:

let userInformation = {
              description: "Esta es..",
              email: "prueba@..."
              full_name: "Josue A..."
              username: "jos"
              website: "es.stac..."
          };

Lo que he intentado es esto:

let textTrunc = text.map(item => {
  return {
    description: `${item.description.substring(0, 14)}...`,
    email: `${item.email.substring(0, 14)}...`,
    etc
  };
});
5
  • Creo que lo que quieres hacer es usar esos datos para ponerlos en algun contenedor, contenedor el cual dependiendo de la cantidad de informacion o digitos o si depronto no cabe en el contenedor, en vez de dividirse en otra linea mostrara ... supongo yo entonces que si tu idea es realmente esa entonces no lo hagas desde javascript, ya que puedes tener la informacion completa en javascript y acomodar eso con solamente HTML y CSS, si quieres puedes ir investigando acerca de text-overflow: developer.mozilla.org/es/docs/Web/CSS/text-overflow
    – Layer
    Commented el 17 jun. 2020 a las 20:26
  • @BetaM Ya actualize lo que e intentado. Commented el 17 jun. 2020 a las 20:27
  • 1
    @JosueMartinez La verdad que yo reformularia la pregunta, porque no creo que haya una forma correcta, quizás haya alguna mas eficiente que otra...
    – Marcos
    Commented el 17 jun. 2020 a las 20:30
  • 1
    @Marcos tiene razon, el titulo de la pregunta roza el ambito basado en opiniones.
    – Layer
    Commented el 17 jun. 2020 a las 20:31
  • @Riven Lo logre asi como tu me lo dijiste igual, ocupe algunas propiedades de bootstrap: class="d-inline-block text-truncate" style="max-width: 150px;" Commented el 17 jun. 2020 a las 21:53

3 respuestas 3

3

Lo que muestras no es un array sino un objeto, pero según lo que te entiendo puedes hacerlo de la siguiente manera:

  1. Iterar el objeto con clave, valor
  2. Cambiar el valor por cada iteración

let userInformation = {
  description: "Esta es mi descripción",
  email: "[email protected]",
  full_name: "Josue Ayala",
  username: "jos",
  website: "es.stackoverflow.com/users/136931/josue-martinez"
};

for (const [key, value] of Object.entries(userInformation)) {
  if (value.length >= 7) {
    userInformation[key] = value.substring(0, 7) + "...";
  }
}
console.log(userInformation)

3
  • Pues... esto funcionaria pero estarias creando un objeto nuevo cada vez no se si el usuario quiera mas bien reemplazar la informacion, pero pues habra que esperar a ver si esto es enrealidad lo que desea el usuario... por lo pronto solo dire que esto puede funcionar.
    – Layer
    Commented el 17 jun. 2020 a las 20:35
  • @JosueMartinez te recomiendo que igual leas el comentario que deje en la pregunta, quiza si lo que yo pienso que es para lo que vas a usar esa informacion entonces es buena idea que leas sobre text-overflow de css.
    – Layer
    Commented el 17 jun. 2020 a las 20:42
  • Por cierto, recuerda que si esa respuesta te fue de ayuda puedes darla como aceptada dandole al boton que parece un chulo, asi le ayudaras a la persona que se tomo el tiempo de responderte (Gerardo Flores).
    – Layer
    Commented el 17 jun. 2020 a las 20:42
0

Inicializa el objeto donde vas a almacenar los textos truncados, recorre el objeto original, analizando la longitud de la cadena y, si es mayor de 7, la truncas, de lo contrario, se queda el valor original.

let userInformation = {
          description: "Esta es mi descripción",
          email: "[email protected]",
          full_name: "Josue Ayala",
          username: "jos",
          website: "es.stackoverflow.com/users/136931/josue-martinez"
};
// Inicializar objeto nuevo
let textTrunc = {};
for(let key in userInformation) {
    // Si el valor es mayor de 7 caracteres
    textTrunc[key] = (userInformation[key].length > 7)
        // Truncar y agregar puntos suspensivos
        ? userInformation[key].substring(0,7) + '...'
        // Valor sin modificar
        : userInformation[key];
}
console.log(textTrunc);

0
let userInformation = {
          description: "Esta es mi descripción",
          email: "[email protected]",
          full_name: "Josue Ayala",
          username: "jos",
          website: "es.stackoverflow.com/users/136931/josue-martinez"
      };

En primera debemos obtener los valores del objeto y lo convertimos a un array

 var toArray=Object.values(userInformation);

Iteramos sobre el array aplicando el substring al valor

 var newArr = toArray.map(function(val, index){ 

 return  `${val.substring(0, 7)}...`; 
        }) 
          
 console.log(newArr) 
2
  • Gracias por tu contribución, considera revisar Cómo responder, saludos
    – Jorgesys
    Commented el 17 jun. 2020 a las 20:56
  • Muchas gracias por tu comentario! Commented el 17 jun. 2020 a las 21:54

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.