Pertanyaan Cara menggabungkan dua larik dalam JavaScript dan item yang tidak terduplikasi


Saya memiliki dua array JavaScript:

var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];

Saya ingin hasilnya:

var array3 = ["Vijendra","Singh","Shakya"];

Array output harus kata-kata yang diulang dihapus.

Bagaimana cara menggabungkan dua larik dalam JavaScript sehingga saya hanya mendapatkan item unik dari setiap larik dalam urutan yang sama yang disisipkan ke dalam larik yang asli?


976
2017-10-18 08:34


asal


Jawaban:


Untuk hanya menggabungkan array (tanpa menghapus duplikat)

Versi ES5 digunakan Array.concat:

var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];

var array3 = array1.concat(array2); // Merges both arrays
// [ 'Vijendra', 'Singh', 'Singh', 'Shakya' ]

Versi ES6 digunakan merusak

const array1 = ["Vijendra","Singh"];
const array2 = ["Singh", "Shakya"];
const array3 = [...array1, ...array2];

Karena tidak ada cara 'built in' untuk menghapus duplikat (ECMA-262 sebenarnya memiliki Array.forEach yang akan sangat bagus untuk ini), kita harus melakukannya secara manual:

Array.prototype.unique = function() {
    var a = this.concat();
    for(var i=0; i<a.length; ++i) {
        for(var j=i+1; j<a.length; ++j) {
            if(a[i] === a[j])
                a.splice(j--, 1);
        }
    }

    return a;
};

Kemudian, untuk menggunakannya:

var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
// Merges both arrays and gets unique items
var array3 = array1.concat(array2).unique(); 

Ini juga akan mempertahankan susunan larik (mis., Tidak perlu penyortiran).

Karena banyak orang kesal tentang augmentasi prototipe Array.prototype dan for in loop, di sini adalah cara yang kurang invasif untuk menggunakannya:

function arrayUnique(array) {
    var a = array.concat();
    for(var i=0; i<a.length; ++i) {
        for(var j=i+1; j<a.length; ++j) {
            if(a[i] === a[j])
                a.splice(j--, 1);
        }
    }

    return a;
}

var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
    // Merges both arrays and gets unique items
var array3 = arrayUnique(array1.concat(array2));

Bagi mereka yang cukup beruntung untuk bekerja dengan browser di mana ES5 tersedia, Anda dapat menggunakannya Object.defineProperty seperti ini:

Object.defineProperty(Array.prototype, 'unique', {
    enumerable: false,
    configurable: false,
    writable: false,
    value: function() {
        var a = this.concat();
        for(var i=0; i<a.length; ++i) {
            for(var j=i+1; j<a.length; ++j) {
                if(a[i] === a[j])
                    a.splice(j--, 1);
            }
        }

        return a;
    }
});

1233
2017-10-18 08:42



Dengan Underscore.js atau Lo-Dash dapat Anda lakukan:

_.union([1, 2, 3], [101, 2, 1, 10], [2, 1]);
=> [1, 2, 3, 101, 10]

http://underscorejs.org/#union

http://lodash.com/docs#union


510
2018-05-08 13:24



Pertama gabungkan dua larik, selanjutnya saring hanya item yang unik.

var a = [1, 2, 3], b = [101, 2, 1, 10];
var c = a.concat(b);
var d = c.filter(function (item, pos) {return c.indexOf(item) == pos});

// d is [1,2,3,101,10]

http://jsfiddle.net/simo/98622/

Edit

Seperti yang disarankan oleh @Dmitry (lihat komentar kedua di bawah) solusi yang lebih bijaksana kinerja akan menyaring item unik di b sebelum bersatu dengan a

var a = [1, 2, 3], b = [101, 2, 1, 10];
var c = a.concat(b.filter(function (item) {
    return a.indexOf(item) < 0;
}));

// d is [1,2,3,101,10]

193
2018-04-15 10:08



Ini adalah solusi ECMAScript 6 menggunakan operator menyebar dan susunan generik.

Saat ini hanya berfungsi dengan Firefox, dan mungkin Pratinjau Teknis Internet Explorer.

Tetapi jika Anda menggunakan Babel, Anda dapat memilikinya sekarang.

// Input: [ [1, 2, 3], [101, 2, 1, 10], [2, 1] ]
// Output: [1, 2, 3, 101, 10]
function mergeDedupe(arr)
{
  return [...new Set([].concat(...arr))];
}

119
2017-12-27 06:28



ES6

array1.push(...array2) // => don't remove duplication 

ATAU

[...array1,...array2] //   =>  don't remove duplication 

ATAU

[...new Set([...array1 ,...array2])]; //   => remove duplication

86
2017-08-14 08:08



Berikut ini adalah pengulangan yang sedikit berbeda. Dengan beberapa pengoptimalan di versi terbaru Chrome, ini adalah metode tercepat untuk menyelesaikan penyatuan dua larik (Chrome 38.0.2111).

http://jsperf.com/merge-two-arrays-keeping-only-unique-values

var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = [];

var arr = array1.concat(array2),
  len = arr.length;

while (len--) {
  var itm = arr[len];
  if (array3.indexOf(itm) === -1) {
    array3.unshift(itm);
  }
}

while loop: ~ 589k ops / s
filter: ~ 445k ops / s
lodash: 308k ops / s
untuk loop: 225k ops / s

Sebuah komentar menunjukkan bahwa salah satu variabel setup saya menyebabkan loop saya untuk mendahului yang lain, karena tidak perlu menginisialisasi array kosong untuk ditulis. Saya setuju dengan itu, jadi saya telah menulis ulang tes untuk bahkan lapangan bermain, dan termasuk opsi yang lebih cepat.

http://jsperf.com/merge-two-arrays-keeping-only-unique-values/21

var whileLoopAlt = function(array1, array2) {
    var array3 = [];
    var arr = array1.concat(array2);
    var len = arr.length;
    var assoc = {};

    while(len--) {
        var itm = arr[len];

        if(!assoc[itm]) { // Eliminate the indexOf call
            array3.unshift(itm);
            assoc[itm] = true;
        }
    }

    return array3;
};

Dalam solusi alternatif ini, saya telah menggabungkan satu solusi array asosiatif jawaban untuk menghilangkan .indexOf() panggil di loop yang memperlambat banyak hal dengan loop kedua, dan termasuk beberapa optimasi lain yang pengguna lain telah menyarankan dalam jawaban mereka juga.

Jawaban teratas di sini dengan loop ganda pada setiap nilai (i-1) masih jauh lebih lambat. lodash masih melakukan yang kuat, dan saya masih akan merekomendasikannya kepada siapa pun yang tidak keberatan menambahkan perpustakaan ke proyek mereka. Bagi mereka yang tidak mau, loop waktu saya masih merupakan jawaban yang bagus dan jawaban filter memiliki tampilan yang sangat kuat di sini, mengalahkan semua tes saya dengan Canary Chrome terbaru (44.0.2360) pada tulisan ini.

Periksa Jawaban Mike dan Jawaban Dan Stocker jika Anda ingin meningkatkan kecepatannya. Mereka adalah yang tercepat dari semua hasil setelah melalui hampir semua jawaban yang layak.


30
2017-08-04 14:14



Menggunakan sebuah Set (ECMAScript 2015), akan sesederhana itu:

const array1 = ["Vijendra", "Singh"];
const array2 = ["Singh", "Shakya"];
const array3 = Array.from(new Set(array1.concat(array2)));

27
2018-01-06 19:05



Anda dapat melakukannya hanya dengan ECMAScript 6,

var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = [...new Set([...array1 ,...array2])];
console.log(array3); // ["Vijendra", "Singh", "Shakya"];
  • Menggunakan operator menyebar untuk menggabungkan array.
  • Menggunakan Set untuk membuat kumpulan elemen yang berbeda.
  • Sekali lagi, gunakan operator penyebaran untuk mengubah Set menjadi array.

26
2018-04-07 07:26



Array.prototype.merge = function(/* variable number of arrays */){
    for(var i = 0; i < arguments.length; i++){
        var array = arguments[i];
        for(var j = 0; j < array.length; j++){
            if(this.indexOf(array[j]) === -1) {
                this.push(array[j]);
            }
        }
    }
    return this;
};

Fungsi penggabungan array yang jauh lebih baik.


14
2017-08-19 13:34



Hanya melempar dua sen saya.

function mergeStringArrays(a, b){
    var hash = {};
    var ret = [];

    for(var i=0; i < a.length; i++){
        var e = a[i];
        if (!hash[e]){
            hash[e] = true;
            ret.push(e);
        }
    }

    for(var i=0; i < b.length; i++){
        var e = b[i];
        if (!hash[e]){
            hash[e] = true;
            ret.push(e);
        }
    }

    return ret;
}

Ini adalah metode yang saya gunakan banyak, menggunakan objek sebagai tabel hashlookup untuk melakukan pemeriksaan duplikat. Dengan asumsi bahwa hash adalah O (1), maka ini berjalan dalam O (n) di mana n adalah a.length + b.length. Sejujurnya saya tidak tahu bagaimana peramban melakukan hash, tetapi kinerjanya bagus di ribuan titik data.


13
2017-12-12 19:50



Mengapa Anda tidak menggunakan suatu objek? Sepertinya Anda mencoba memodelkan satu set. Ini tidak akan mempertahankan pesanan.

var set1 = {"Vijendra":true, "Singh":true}
var set2 = {"Singh":true,  "Shakya":true}

// Merge second object into first
function merge(set1, set2){
  for (var key in set2){
    if (set2.hasOwnProperty(key))
      set1[key] = set2[key]
  }
  return set1
}

merge(set1, set2)

// Create set from array
function setify(array){
  var result = {}
  for (var item in array){
    if (array.hasOwnProperty(item))
      result[array[item]] = true
  }
  return result
}

13
2017-10-18 08:51