1

Tengo los siguientes datos en json que se almacen en mi data vue js

proveedoresSeleccionados: [{id: 1, texto: "ORSIS S.A.C", check: false },
                          {id: 2, texto: "ABS S.A.C",check: false },
                          {id: 2, texto: "ABS S.A.C",check: false },
                          {id: 3, texto: "ERT S.A.C" , check: false},
                          {id: 4, texto: "APPLE S.A.C" , check: false}]

estoy intentando con esto pero no me devuelve nada.

 const resultado = uniq(this.proveedoresSeleccionados.filter((proveedor)=> {
           proveedor.id
        }).map((proveedor)=>{
          return proveedor;
        }))

Alguna sugerencia como puedo hacer para obtener una nueva matriz pero de elementos no repetidos?

3 respuestas 3

1

Tienes la solución clásica de recorrer el array de objetos en un bucle pero creo que es más elegante utilizar Reduce filtrando por el valor que quieras (id o texto)

<script>

var proveedoresSeleccionados = [{id: 1, texto: "ORSIS S.A.C", check: false },
                          {id: 2, texto: "ABS S.A.C",check: false },
                          {id: 2, texto: "ABS S.A.C",check: false },
                          {id: 3, texto: "ERT S.A.C" , check: false},
                          {id: 4, texto: "APPLE S.A.C" , check: false}]

console.log(
Object.values(proveedoresSeleccionados.reduce((prev,next)=>Object.assign(prev,{[next.texto]:next}),{})));


</script>

Edito con una explicación al código:

Lo primero, Reduce ejecuta la función indicada por cada elemento del array. En este caso la función a ejecutar sería:

function(prev,next){
return Object.assign(prev,{[next.text]:next}),{});
}

Que con expresiones de tipo flecha queda resumida a:

(prev,next)=>Object.assign(prev,{[next.texto]:next}),{}));

Reduce puede tomar 4 valores:

  • valorAnterior
  • valorActual
  • indiceActual
  • array

La primera vez que se llama la función, valorAnterior y valorActual pueden tener uno de dos valores. Si se proveyó un valorInicial al llamar a reduce, entonces valorAnterior será igual al valorInicial y valorActual será igual al primer elemento del array. Si no se proveyó un valorInicial, entonces valorAnterior será igual al primer valor en el array y valorActual será el segundo.

En este caso utilizaremos dos (el valor de la iteración anterior y el valor de la actual (prev y next))

Y llamaremos a Object.assign(). Como indica la documentación:

El método Object.assign() se utiliza para copiar los valores de todas la propiedades enumerables de uno o más objetos fuente a un objeto destino. Retorna el objeto destino

Además:

Las propiedades en el objeto destino serán sobrescritas por las propiedades en las fuentes si tienen la misma clave. Propiedades posteriores de las fuentes podrán sobrescribir las anteriores.

Es decir, vamos a copiar en un nuevo array de objetos los elementos que estamos iterando a través de reduce aprovechándonos de la característica que tiene assign de sobrescribir objetos si están repetidos.

Así pues, en la primera iteración toma el objeto:

 {id: 1, texto: "ORSIS S.A.C", check: false }

Y lo mete en el nuevo array de objetos siempre y cuando no exista ya un objeto con el mismo valor de la propiedad texto ({[next.texto]:next}). Es importante devolver el valor como un objeto (entre llaves) para que en la siguiente iteración pueda acceder a la propiedad texto del objeto..

En la segunda iteración hará lo mismo con el objeto:

{id: 2, texto: "ABS S.A.C",check: false }

Y como no existe ningún objeto todavía con el texto "ABS S.A.C" lo meterá sin problemas.

En la siguiente iteración obtendrá el objeto:

{id: 2, texto: "ABS S.A.C",check: false }

Y como ya existe un texto igual sobrescribirá el que ya existe en el array.

Con esto conseguimos un nuevo array con identificadores únicos (he filtrado por texto pero podrías hacerlo por id)

Espero haberme explicado :)

2
  • como funciona tu funcion? podrias explicarme? a que te refieres con esta linea Object.assign(prev,{[next.texto]:next}),{})))
    – HalleyRios
    Commented el 23 may. 2018 a las 16:08
  • Si me quedo claro tu explicacion Gracias.
    – HalleyRios
    Commented el 25 may. 2018 a las 16:21
1

puedes probar utilizando cualquiera de las dos soluciones:

El objeto Set te permite almacenar valores únicos de cualquier tipo

var proveedoresSeleccionados = [
  {id: 1, texto: "ORSIS S.A.C", check: false },
  {id: 2, texto: "ABS S.A.C",check: false },
  {id: 2, texto: "ABS S.A.C",check: false },
  {id: 3, texto: "ERT S.A.C" , check: false},
  {id: 4, texto: "APPLE S.A.C" , check: false}
]
var unique = [...new Set(proveedoresSeleccionados.map(item => item.texto))]             

console.log(unique)

Utilizando Array.filter para determinar que valores eliminar después de mapearlo

var proveedoresSeleccionados = [
  {id: 1, texto: "ORSIS S.A.C", check: false },
  {id: 2, texto: "ABS S.A.C",check: false },
  {id: 2, texto: "ABS S.A.C",check: false },
  {id: 3, texto: "ERT S.A.C" , check: false},
  {id: 4, texto: "APPLE S.A.C" , check: false}
]
var unique = proveedoresSeleccionados.map(item => item.texto)
  .filter((value, index, self) => self.indexOf(value) === index)
  
console.log(unique)

0

Yo cree una funcion tambien para filtrar por si alguien quiere usarla tambien.

function remove_duplicates(arreglo) {
    var no_duplicate = arreglo.filter((objeto, index, self) =>
     index === self.findIndex((t) => (t.id === objeto.id 
    )));
    return no_duplicate 
  }

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.