Bagaimana cara mendapatkan nilai berbeda dari berbagai objek dalam JavaScript?

Dengan asumsi saya memiliki yang berikut ini:

var array = 
    [
        {"name":"Joe", "age":17}, 
        {"name":"Bob", "age":17}, 
        {"name":"Carl", "age": 35}
    ]

Apa cara terbaik untuk bisa mendapatkan array dari semua umur yang berbeda sehingga saya mendapatkan array hasil:

[17, 35]

Apakah ada beberapa cara saya bisa menyusun data atau metode yang lebih baik sehingga saya tidak perlu beralih melalui setiap array memeriksa nilai "usia" dan memeriksa terhadap array lain untuk keberadaannya, dan menambahkannya jika tidak?

Jika ada cara saya bisa menarik usia yang berbeda tanpa iterasi ...

Cara tidak efisien saat ini saya ingin meningkatkan ... Jika itu berarti bahwa alih-alih "array" menjadi array objek, tetapi "peta" objek dengan beberapa kunci unik (yaitu "1,2,3") yang akan menjadi oke juga. Saya hanya mencari cara yang paling efisien kinerja.

Berikut ini adalah bagaimana saya saat ini melakukannya, tetapi bagi saya, iterasi tampaknya hanya payah untuk efisiensi meskipun itu berfungsi ...

var distinct = []
for (var i = 0; i < array.length; i++)
   if (array[i].age not in distinct)
      distinct.push(array[i].age)

Jika ini PHP, saya akan membuat array dengan kunci dan mengambil array_keyspada akhirnya, tetapi JS tidak memiliki kemewahan seperti itu. Alih-alih, coba ini:

var flags = [], output = [], l = array.length, i;
for( i=0; i<l; i++) {
    if( flags[array[i].age]) continue;
    flags[array[i].age] = true;
    output.push(array[i].age);
}

Jika Anda menggunakan ES6 / ES2015 atau lebih baru, Anda dapat melakukannya dengan cara ini:

const unique = [...new Set(array.map(item => item.age))];

Berikut adalah contoh cara melakukannya.

menggunakan ES6

let array = [
  { "name": "Joe", "age": 17 },
  { "name": "Bob", "age": 17 },
  { "name": "Carl", "age": 35 }
];
array.map(item => item.age)
  .filter((value, index, self) => self.indexOf(value) === index)

> [17, 35]

Anda bisa menggunakan pendekatan kamus seperti ini. Pada dasarnya Anda menetapkan nilai yang ingin Anda bedakan sebagai kunci dalam "kamus" (di sini kami menggunakan array sebagai objek untuk menghindari mode kamus). Jika kunci tidak ada maka Anda menambahkan nilai itu sebagai berbeda.

Ini demo yang berfungsi:

var array = [{"name":"Joe", "age":17}, {"name":"Bob", "age":17}, {"name":"Carl", "age": 35}];
var unique = [];
var distinct = [];
for( let i = 0; i < array.length; i++ ){
  if( !unique[array[i].age]){
    distinct.push(array[i].age);
    unique[array[i].age] = 1;
  }
}
var d = document.getElementById("d");
d.innerHTML = "" + distinct;

<div id="d"></div>

Ini akan menjadi O (n) di mana n adalah jumlah objek dalam array dan m adalah jumlah nilai unik. Tidak ada cara yang lebih cepat daripada O (n) karena Anda harus memeriksa setiap nilai setidaknya satu kali.

Versi sebelumnya ini menggunakan objek, dan untuk in. Ini sifatnya minor, dan sejak itu sedikit diperbarui di atas. Namun, alasan tampaknya kemajuan dalam kinerja antara dua versi di jsperf asli adalah karena ukuran sampel data yang sangat kecil. Dengan demikian, perbandingan utama dalam versi sebelumnya adalah melihat perbedaan antara peta internal dan penggunaan filter versus pencarian mode kamus.

Saya telah memperbarui kode di atas, sebagaimana dicatat, namun, saya juga memperbarui jsperf untuk melihat melalui 1000 objek, bukan 3. 3 mengabaikan banyak jebakan kinerja yang terlibat ( jsperf usang ).

Performa

https://jsperf.com/filter-vs-dictionary-more-data Ketika saya menjalankan kamus ini 96% lebih cepat.

Ini adalah bagaimana Anda akan menyelesaikan ini menggunakan Set baru melalui ES6 untuk mengeskrip pada 25 Agustus 2017

Array.from(new Set(yourArray.map((item: any) => item.id)))

Menggunakan fitur ES6, Anda dapat melakukan sesuatu seperti:

const uniqueAges = [...new Set( array.map(obj => obj.age)) ];

Saya baru saja memetakan dan menghapus dups:

var ages = array.map(function(obj) { return obj.age; });
ages = ages.filter(function(v,i) { return ages.indexOf(v) == i; });

console.log(ages); //=> [17, 35]

Sunting: Aight! Bukan cara yang paling efisien dalam hal kinerja, tetapi IMO yang paling mudah dibaca. Jika Anda benar-benar peduli tentang optimasi mikro atau Anda memiliki jumlah data yang besar, maka forperulangan reguler akan lebih "efisien".

var unique = array
    .map(p => p.age)
    .filter((age, index, arr) => arr.indexOf(age) == index)
    .sort(); // sorting is optional

// or in ES6

var unique = [...new Set(array.map(p => p.age))];

// or with lodash

var unique = _.uniq(_.map(array, 'age'));

Contoh ES6

const data = [
  { name: "Joe", age: 17}, 
  { name: "Bob", age: 17}, 
  { name: "Carl", age: 35}
];

const arr = data.map(p => p.age); // [17, 17, 35]
const s = new Set(arr); // {17, 35} a set removes duplications, but it's still a set
const unique = [...s]; // [17, 35] Use the spread operator to transform a set into an Array
// or use Array.from to transform a set into an array
const unique2 = Array.from(s); // [17, 35]

Bagi mereka yang ingin mengembalikan objek dengan semua properti unik dengan kunci

const array =
  [
    { "name": "Joe", "age": 17 },
    { "name": "Bob", "age": 17 },
    { "name": "Carl", "age": 35 }
  ]

const key = 'age';

const arrayUniqueByKey = [...new Map(array.map(item =>
  [item[key], item])).values()];

console.log(arrayUniqueByKey);

   /*OUTPUT
       [
        { "name": "Bob", "age": 17 },
        { "name": "Carl", "age": 35 }
       ]
   */

 // Note: this will pick the last duplicated item in the list.

Sudah banyak jawaban yang valid, tetapi saya ingin menambahkan satu yang hanya menggunakan reduce()metode karena bersih dan sederhana.

function uniqueBy(arr, prop){
  return arr.reduce((a, d) => {
    if (!a.includes(d[prop])) { a.push(d[prop]); }
    return a;
  }, []);
}

Gunakan seperti ini:

var array = [
  {"name": "Joe", "age": 17}, 
  {"name": "Bob", "age": 17}, 
  {"name": "Carl", "age": 35}
];

var ages = uniqueBy(array, "age");
console.log(ages); // [17, 35]

The forEachVersi jawaban @ travis-j ini (membantu pada browser modern dan dunia Node JS):

var unique = {};
var distinct = [];
array.forEach(function (x) {
  if (!unique[x.age]) {
    distinct.push(x.age);
    unique[x.age] = true;
  }
});

34% lebih cepat di Chrome v29.0.1547: http://jsperf.com/filter-versus-dictionary/3

Dan solusi umum yang mengambil fungsi mapper (sedikit lebih lambat dari peta langsung, tapi itu diharapkan):

function uniqueBy(arr, fn) {
  var unique = {};
  var distinct = [];
  arr.forEach(function (x) {
    var key = fn(x);
    if (!unique[key]) {
      distinct.push(key);
      unique[key] = true;
    }
  });
  return distinct;
}

// usage
uniqueBy(array, function(x){return x.age;}); // outputs [17, 35]

Saya sudah mulai menempel Garis Bawah di semua proyek baru secara default, jadi saya tidak pernah harus memikirkan masalah kecil data-munging ini.

var array = [{"name":"Joe", "age":17}, {"name":"Bob", "age":17}, {"name":"Carl", "age": 35}];
console.log(_.chain(array).map(function(item) { return item.age }).uniq().value());

Menghasilkan [17, 35].

Berikut cara lain untuk menyelesaikan ini:

var result = {};
for(var i in array) {
    result[array[i].age] = null;
}
result = Object.keys(result);

Saya tidak tahu seberapa cepat solusi ini dibandingkan dengan yang lain, tapi saya suka tampilan yang lebih bersih. ;-)

EDIT: Oke, di atas tampaknya menjadi solusi paling lambat di sini.

Saya telah membuat case test kinerja di sini: http://jsperf.com/distinct-values-from-array

Alih-alih menguji untuk usia (Integer), saya memilih untuk membandingkan nama (Strings).

Metode 1 (solusi TS) sangat cepat. Yang cukup menarik, Metode 7 mengungguli semua solusi lain, di sini saya baru saja menyingkirkan .indexOf () dan menggunakan implementasi "manual", menghindari panggilan fungsi yang berulang:

var result = [];
loop1: for (var i = 0; i < array.length; i++) {
    var name = array[i].name;
    for (var i2 = 0; i2 < result.length; i2++) {
        if (result[i2] == name) {
            continue loop1;
        }
    }
    result.push(name);
}

Perbedaan dalam kinerja menggunakan Safari & Firefox adalah luar biasa, dan sepertinya Chrome melakukan pekerjaan terbaik pada optimasi.

Saya tidak begitu yakin mengapa cuplikan di atas sangat cepat dibandingkan dengan yang lain, mungkin seseorang yang lebih bijak dari saya punya jawabannya. ;-)

menggunakan lodash

var array = [
    { "name": "Joe", "age": 17 },
    { "name": "Bob", "age": 17 },
    { "name": "Carl", "age": 35 }
];
_.chain(array).pluck('age').unique().value();
> [17, 35]

Menggunakan Lodash

var array = [
    { "name": "Joe", "age": 17 },
    { "name": "Bob", "age": 17 },
    { "name": "Carl", "age": 35 }
];

_.chain(array).map('age').unique().value();

Pengembalian [17,35]

function get_unique_values_from_array_object(array,property){
    var unique = {};
    var distinct = [];
    for( var i in array ){
       if( typeof(unique[array[i][property]]) == "undefined"){
          distinct.push(array[i]);
       }
       unique[array[i][property]] = 0;
    }
    return distinct;
}

underscore.js _.uniq(_.pluck(array,"age"))

Berikut adalah solusi serbaguna yang menggunakan pengurangan, memungkinkan untuk pemetaan, dan mempertahankan urutan penyisipan.

barang : sebuah array

mapper : Fungsi unary yang memetakan item ke kriteria, atau kosong untuk memetakan item itu sendiri.

function distinct(items, mapper) {
    if (!mapper) mapper = (item)=>item;
    return items.map(mapper).reduce((acc, item) => {
        if (acc.indexOf(item) === -1) acc.push(item);
        return acc;
    }, []);
}

Pemakaian

const distinctLastNames = distinct(items, (item)=>item.lastName);
const distinctItems = distinct(items);

Anda dapat menambahkan ini ke prototipe Array Anda dan meninggalkan parameter item jika itu gaya Anda ...

const distinctLastNames = items.distinct( (item)=>item.lastName) ) ;
const distinctItems = items.distinct() ;

Anda juga dapat menggunakan Set alih-alih Array untuk mempercepat pencocokan.

function distinct(items, mapper) {
    if (!mapper) mapper = (item)=>item;
    return items.map(mapper).reduce((acc, item) => {
        acc.add(item);
        return acc;
    }, new Set());
}

Baru saja menemukan ini dan saya pikir ini berguna

_.map(_.indexBy(records, '_id'), function(obj){return obj})

Sekali lagi menggunakan garis bawah , jadi jika Anda memiliki objek seperti ini

var records = [{_id:1,name:'one', _id:2,name:'two', _id:1,name:'one'}]

itu akan memberi Anda objek unik saja.

Apa yang terjadi di sini adalah indexBymengembalikan peta seperti ini

{ 1:{_id:1,name:'one'}, 2:{_id:2,name:'two'} }

dan hanya karena ini peta, semua kunci unik.

Lalu saya hanya memetakan daftar ini kembali ke array.

Jika Anda hanya perlu nilai yang berbeda

_.map(_.indexBy(records, '_id'), function(obj,key){return key})

Perlu diingat bahwa keydikembalikan sebagai string sehingga, jika Anda membutuhkan bilangan bulat, Anda harus melakukannya

_.map(_.indexBy(records, '_id'), function(obj,key){return parseInt(key)})

saya pikir Anda mencari fungsi groupBy (menggunakan Lodash)

_personsList = [{"name":"Joe", "age":17}, 
                {"name":"Bob", "age":17}, 
                {"name":"Carl", "age": 35}];
_uniqAgeList = _.groupBy(_personsList,"age");
_uniqAges = Object.keys(_uniqAgeList);

menghasilkan hasil:

17,35

Demo jsFiddle: http://jsfiddle.net/4J2SX/201/

Jika seperti saya Anda lebih suka yang lebih "fungsional" tanpa mengurangi kecepatan, contoh ini menggunakan kamus cepat yang dibungkus di dalam mengurangi penutupan.

var array = 
[
    {"name":"Joe", "age":17}, 
    {"name":"Bob", "age":17}, 
    {"name":"Carl", "age": 35}
]
var uniqueAges = array.reduce((p,c,i,a) => {
    if(!p[0][c.age]) {
        p[1].push(p[0][c.age] = c.age);
    }
    if(i<a.length-1) {
        return p
    } else {
        return p[1]
    }
}, [{},[]])

Menurut tes ini solusi saya dua kali lebih cepat dari jawaban yang diusulkan

[...new Set([
    { "name": "Joe", "age": 17 },
    { "name": "Bob", "age": 17 },
    { "name": "Carl", "age": 35 }
  ].map(({ age }) => age))]

Saya tahu kode saya sedikit panjang dan sedikit kompleksitas waktu tetapi dapat dimengerti jadi saya mencoba cara ini.

Saya mencoba mengembangkan fungsi berbasis prototipe di sini dan kode juga berubah.

Di sini, Distinct adalah fungsi prototipe saya sendiri.

<script>
  var array = [{
      "name": "Joe",
      "age": 17
    },
    {
      "name": "Bob",
      "age": 17
    },
    {
      "name": "Carl",
      "age": 35
    }
  ]

  Array.prototype.Distinct = () => {
    var output = [];
    for (let i = 0; i < array.length; i++) {
      let flag = true;
      for (let j = 0; j < output.length; j++) {
        if (array[i].age == output[j]) {
          flag = false;
          break;
        }
      }
      if (flag)
        output.push(array[i].age);
    }
    return output;
  }
  //Distinct is my own function
  console.log(array.Distinct());
</script>

Jika Anda memiliki Array.prototype.includes atau bersedia untuk mengisinya , ini berfungsi:

var ages = []; array.forEach(function(x) { if (!ages.includes(x.age)) ages.push(x.age); });

Kode saya di bawah ini akan menunjukkan array umur yang unik dan juga array baru yang tidak memiliki usia duplikat

var data = [
  {"name": "Joe", "age": 17}, 
  {"name": "Bob", "age": 17}, 
  {"name": "Carl", "age": 35}
];

var unique = [];
var tempArr = [];
data.forEach((value, index) => {
    if (unique.indexOf(value.age) === -1) {
        unique.push(value.age);
    } else {
        tempArr.push(index);    
    }
});
tempArr.reverse();
tempArr.forEach(ele => {
    data.splice(ele, 1);
});
console.log('Unique Ages', unique);
console.log('Unique Array', data);```

Saya menulis sendiri di TypeScript, untuk kasus generik, seperti itu di Kotlin Array.distinctBy {}...

function distinctBy<T, U extends string | number>(array: T[], mapFn: (el: T) => U) {
  const uniqueKeys = new Set(array.map(mapFn));
  return array.filter((el) => uniqueKeys.has(mapFn(el)));
}

Di mana Uhashable, tentu saja. Untuk Objek, Anda mungkin perlu https://www.npmjs.com/package/es6-json-stable-stringify

Jika Anda perlu objek unik yang unik

const _ = require('lodash');

var objects = [
  { 'x': 1, 'y': 2 },
  { 'y': 1, 'x': 2 },
  { 'x': 2, 'y': 1 },
  { 'x': 1, 'y': 2 }
];

_.uniqWith(objects, _.isEqual);

[Obyek {x: 1, y: 2}, Obyek {x: 2, y: 1}]

Menjawab pertanyaan lama ini tidak ada gunanya, tetapi ada jawaban sederhana yang berbicara tentang sifat Javascript. Objek dalam Javascript pada dasarnya adalah tabel hash. Kita dapat menggunakan ini untuk mendapatkan hash kunci unik:

var o = {}; array.map(function(v){ o[v.age] = 1; });

Lalu kita bisa mengurangi hash ke array nilai unik:

var a2 = []; for (k in o){ a2.push(k); }

Itu yang kamu butuhkan. Array a2 hanya berisi usia unik.

Satu garis sederhana dengan kinerja luar biasa. 6% lebih cepat dari solusi ES6 dalam pengujian saya .

var ages = array.map(function(o){return o.age}).filter(function(v,i,a) {
    return a.indexOf(v)===i
});