روشهای مختلف برای حذف مقادیر تکراری از آرایه در Javascript

در این مطلب قصد داریم روش هایی رو خدمتتون معرفی کنیم که به کمک اون بتونید مقادیر تکراری رو از آرایه‌ها در Javascript حذف کنید و عناصر باقی مانده رو درون یک آرایه جدید قرار بدید و از اونا استفاده کنید.

یکی از روش‌های موجود استفاده از کد زیر هست:

var names = ["Mike","Matt","Nancy","Adam","Matt","Nancy","Carl"];

uniqueArray = names.filter(function(item, pos, self) {
    return self.indexOf(item) == pos;
})

console.log(uniqueArray); // ["Mike","Matt","Adam","Nancy","Carl"]

در این کد از متد فیلتر استفاده میشه به نحوی که یک آرایه رو می‌گیره و یک تابع رو به ازای تمامی عناصر آرایه اجرا می‌کنه. در صورتی که در آرایه names عنصر item تکرار شده باشد، indexOf(item)  اولین موقعیت item رو که در در آرایه می‌بیند در اختیار ما می‌گذارد . اما pos در هر تکرار موقعیت دقیق عنصر مربوطه رو مشخص می‌کنه. بنابراین هر گاه مقدار pos و indexOf(item)  یکسان بود، به این معناست که عنصر بررسی شده تکراری نیست و به آرایه جدید وارد می‌شود اما اگر برابر نبود، اون عنصر در آرایه جدید حذف میشه.

اما این روش به دلیل این که تک تک عناصر رو باید بررسی کنه برای آرایه‌های بزرگ روش بهینه ای به حساب نمیاد و بهتره که از اون استفاده نکنیم.

در روش دوم ابتدا آرایه رو sort می‌کنیم و از عنصر دوم به بعد، هر عنصر رو با عنصر قبل از خودش چک می‌کنیم. اگر این دو عنصر متفاوت بودن بدیهی است که اون عنصر در آرایه جدید قرار میگیره در غیر این صورت عنصری که بررسی می‌کنیم تکراری هست و به آرایه جدید اضافه نمیشه. به کد زیر توجه کنید:

function uniq(names) {
    return names.sort().filter(function(item, position, array) {
        return !position || item != array[position - 1];
    })
}

دقت کنید که sort فقط برای آرایه‌ها کاربرد داره و برای شی یا Object نمی‌تونیم ازش استفاده کنیم. نکته بعد درباره این روش اینه که با sort  کردن ، آرایه به هم می‌ریزه. پس در صورتی که به آرایه اولی نیاز ندارید این روش می‌تونه کاربرد داشته باشه و در غیر اینصورت بهتره که از این روش استفاده نشه.

در روش سوم از set که یکی از امکانات جدید ES6 هست استفاده می‌کنیم که کار رو بسیار راحت می‌کنه. به کد زیر توجه کنید:

function uniq(names) {
   return Array.from(new Set(names));
}

یکی از ویژگی‌های set اینه که عناصر تکراری رو قبول نمی‌کنه و مجموعه ای از عناصر غیر تکراری رو می‌سازه. در کد بالا ابتدا از آرایه names یک مجموعه یا Set ساختیم و بعد از اون با استفاده از Array.from اون رو تبدیل به آرایه کردیم.

این کد رو می‌تونیم به صورت کامل با استفاده از ES6 بنویسیم. بصورت زیر:

let uniq = a => [...new Set(a)];

دو کد بالا دقیقا یک کار رو انجام میدن. در این کد از Arrow function و Rest parameters که در ES6 اضافه شده اند نیز استفاده شده است.

اگر شما در کارتون به یک آرایه با عناصر غیرتکراری نیاز دارید می‌تونید از همون ابتدا به جای آرایه از Set که هیچ وقت مقادیر تکراری رو قبول نمی‌کنه استفاده کنید.

نویسنده

محمد اسفندیاری

بسیار به طراحی وب علاقمندم و به سرعت در حال یادگیری تمام مباحث پیشرفته هستم و دوست دارم که به دیگران هم یاد بدهم.