مقایسه دو آرایه در جاوا اسکریپت: یک راهنمای جامع

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

چرا باید دو آرایه را در جاوا اسکریپت مقایسه کنیم؟

مقایسه آرایه‌ها در سناریوهای مختلف برنامه‌نویسی کاربرد دارد. برای مثال، ممکن است بخواهید بررسی کنید که آیا دو آرایه حاوی داده‌های یکسانی هستند یا خیر. این کار در مدیریت لیست‌های کار، مقایسه نتایج محاسبات و موارد دیگر مفید است.

دوره جامع آموزش جاوا اسکریپت به صورت کاربردی

کلیک کنید

در ادامه این مطلب انواع روش‌های مقایسه آرایه ها در جاوا اسکریپت را بررسی خواهیم کرد.

اپراتور مقایسه مساوی (===) برای آرایه‌ها در جاوا اسکریپت

در نگاه اول، به نظر می‌رسد که می‌توان از اپراتور مقایسه مساوی (===) برای بررسی برابری دو آرایه استفاده کرد. با این حال، این رویکرد فریبنده است. در جاوا اسکریپت، اپراتور === نه تنها مقادیر را بررسی می‌کند، بلکه به نوع داده‌ها نیز توجه دارد. از آنجایی که آرایه‌ها خود اشیاء هستند، حتی اگر عناصر آن‌ها یکسان باشند، دو آرایه مجزا هرگز با اپراتور === برابر نخواهند بود.

مقایسه دو آرایه در جاوا اسکریپت بر اساس عناصر: رویکرد برابری عمیق

برای مقایسه صحیح دو آرایه در جاوا اسکریپت، به روشی برای بررسی برابری تک تک عناصر آن‌ها نیاز داریم. این همان مفهوم برابری عمیق (deep equality) است. چندین راه برای دستیابی به برابری عمیق در جاوا اسکریپت وجود دارد:

پیشنهاد مطالعه: Map در جاوا اسکریپت – آموزش مپ به صورت ساده و کامل

1. استفاده از حلقه for:

این روش شامل پیمایش هر دو آرایه با استفاده از حلقه for و مقایسه عناصر آن‌ها در هر موقعیت است. اگر در هر نقطه عدم تطابقی پیدا شود، آرایه‌ها برابر نیستند. در غیر این صورت، آن‌ها برابر در نظر گرفته می‌شوند.

function deepEqual(arr1, arr2) {
if (arr1.length !== arr2.length) return false;
for (let i = 0; i < arr1.length; i++) {
if (arr1[i] !== arr2[i]) return false;
}
return true;
}

2. استفاده از متد every()‎:

متد every()‎ روشی قدرتمند برای بررسی اینکه آیا همه عناصر یک آرایه شرط خاصی را برآورده می‌کنند یا خیر، ارائه می‌دهد. در این مورد، شرط این است که عنصر فعلی در آرایه اول با عنصر مربوطه در آرایه دوم برابر باشد.

function deepEqual(arr1, arr2) {
return arr1.length === arr2.length && arr1.every((val, index) => val === arr2[index]);
}

3. استفاده از کتابخانه‌های جانبی برای مقایسه دو آرایه در جاوا اسکریپت

کتابخانه‌های جاوا اسکریپت مانند Lodash یا Underscore دارای توابعی برای برابری عمیق هستند. این توابع اغلب کارهای اضافی مانند رسیدگی به انواع داده‌های پیچیده را انجام می‌دهند و می‌توانند راه‌حلی تمیز و مختصر برای مقایسه آرایه‌ها ارائه دهند.

const _ = require('lodash');

function deepEqual(arr1, arr2) {
return _.isEqual(arr1, arr2);
}

مقایسه دو آرایه در جاوا اسکریپت بر اساس طول و ترتیب عناصر

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

دوره آموزش جامع طراحی سایت فرانت اند

کلیک کنید

برای این منظور، می‌توانیم از روش‌های زیر استفاده کنیم:

1. مقایسه طول آرایه‌ها:

اولین قدم مقایسه طول دو آرایه با استفاده از اپراتور length است. اگر طول‌ها برابر نباشد، آرایه‌ها نمی‌توانند ترتیب یکسانی داشته باشند.

function sameLengthAndOrder(arr1, arr2) {
return arr1.length === arr2.length;
}

2. مقایسه عناصر با استفاده از حلقه for:

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

function sameLengthAndOrder(arr1, arr2) {
if (arr1.length !== arr2.length) return false;
for (let i = 0; i < arr1.length; i++) {
if (arr1[i] !== arr2[i]) return false;
}
return true;
}

3. استفاده از توابع مرتب‌سازی:

می‌توانیم از توابع مرتب‌سازی داخلی جاوا اسکریپت مانند sort(‎) برای مرتب‌سازی هر دو آرایه و سپس مقایسه آن‌ها با استفاده از اپراتور === استفاده کنیم. اگر آرایه‌ها پس از مرتب‌سازی برابر باشند، ترتیب عناصر آن‌ها نیز یکسان است.

function sameLengthAndOrder(arr1, arr2) {
if (arr1.length !== arr2.length) return false;
arr1.sort();
arr2.sort();
return arr1 === arr2;
}

مقایسه آرایه‌ها با انواع داده‌های پیچیده

تاکنون، ما بر روی آرایه‌های حاوی عناصر ساده مانند اعداد یا رشته‌ها تمرکز کرده‌ایم. با این حال، آرایه‌ها می‌توانند شامل اشیاء پیچیده نیز باشند که خود دارای خواص و مقادیر متعددی هستند. در ادامه این روش‌ها ذکر خواهند شد.

پیشنهاد مطالعه: آموزش Hoisting در جاوا اسکریپت به زبان ساده

1. استفاده از توابع بازگشتی:

می‌توانیم از توابع بازگشتی برای پیمایش اشیاء درون آرایه‌ها و مقایسه خواص و مقادیر آن‌ها به طور عمیق استفاده کنیم. این روش به طور خاص برای ساختارهای داده‌ای درختی یا نمودار مفید است.

2. استفاده از کتابخانه‌های جانبی:

کتابخانه‌های جاوا اسکریپت مانند Lodash یا Underscore دارای توابعی برای برابری عمیق اشیاء هستند. این توابع از الگوریتم‌های پیچیده‌تری برای رسیدگی به انواع داده‌های مختلف و ساختارهای داده‌ای استفاده می‌کنند.

پیشنهاد مطالعه: آموزش Var در جاوا اسکریپت به زبان ساده

ملاحظات مربوط به کارایی در مقایسه دو آرایه در جاوا اسکریپت

هنگام انتخاب روشی برای مقایسه آرایه‌ها، باید به ملاحظات مربوط به کارایی نیز توجه داشته باشید. اگر با آرایه‌های بزرگ کار می‌کنید، استفاده از روش‌های ساده‌تر مانند حلقه for یا توابع مرتب‌سازی داخلی می‌تواند کارآمدتر باشد. برای آرایه‌های پیچیده یا ساختارهای داده‌ای عمیق، کتابخانه‌های جانبی می‌توانند عملکرد بهتری ارائه دهند، اما ممکن است سربار پردازشی بیشتری نیز داشته باشند.

مثال عملی پیچیده از مقایسه دو آرایه در جاوا اسکریپت

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

دوره آموزش جامع HTML و  CSS

کلیک کنید

در اینجا یک نمونه کد جاوا اسکریپت برای انجام این کار ارائه شده است:

const cart1 = [
{ product: "Laptop", quantity: 1, price: 1200 },
{ product: "Mouse", quantity: 2, price: 50 },
{ product: "Keyboard", quantity: 1, price: 80 },
];

const cart2 = [
{ product: "Keyboard", quantity: 1, price: 80 },
{ product: "Mouse", quantity: 1, price: 50 },
{ product: "Laptop", quantity: 1, price: 1200 },
];

function compareCarts(cart1, cart2) {
// بررسی برابری طول سبدهای خرید
if (cart1.length !== cart2.length) return false;

// مرتب‌سازی سبدهای خرید بر اساس نام محصول
cart1.sort((a, b) => a.product.localeCompare(b.product));
cart2.sort((a, b) => a.product.localeCompare(b.product));

// مقایسه عمیق هر محصول در سبدهای خرید
for (let i = 0; i < cart1.length; i++) {
if (
cart1[i].product !== cart2[i].product ||
cart1[i].quantity !== cart2[i].quantity ||
cart1[i].price !== cart2[i].price
) {
return false;
}
}

// اگر تمام محصولات برابر باشند، سبدهای خرید نیز برابر هستند
return true;
}

const areCartsEqual = compareCarts(cart1, cart2);
console.log(areCartsEqual ? "سبدهای خرید برابر هستند" : "سبدهای خرید متفاوت هستند");

توضیح:

• تعریف سبدهای خرید: دو آرایه cart1 و cart2 تعریف شده‌اند که هر کدام لیستی از اشیاء را شامل می‌شوند. هر شیء اطلاعات مربوط به یک محصول را در سبد خرید نشان می‌دهد، شامل نام محصول (product)، تعداد (quantity) و قیمت واحد (price).
• تابع compareCarts: این تابع دو سبد خرید را به عنوان آرگومان دریافت می‌کند و برابری آن‌ها را بررسی می‌کند.
  بررسی طول: ابتدا طول سبدهای خرید با استفاده از cart1.length !== cart2.length مقایسه می‌شود. اگر طول‌ها برابر نباشد، سبدهای خرید نمی‌توانند محتوای یکسانی داشته باشند.
• مرتب‌سازی سبدهای خرید: از متد sort()‎ برای مرتب‌سازی سبدهای خرید بر اساس نام محصول استفاده می‌شود. این کار مقایسه محصولات را در موقعیت‌های مشابه در هر دو سبد آسان‌تر می‌کند.
• مقایسه عمیق محصولات: یک حلقه for برای پیمایش هر دو سبد به طور همزمان استفاده می‌شود. در هر تکرار، محصولات در موقعیت‌های فعلی با استفاده از cart1[i].product === cart2[i].product و غیره مقایسه می‌شوند. اگر هر عدم تطابقی پیدا شود، سبدهای خرید برابر نیستند.
• بازگشت نتیجه: اگر تمام محصولات در هر دو سبد با موفقیت مقایسه شوند، تابع true را برمی‌گرداند، به این معنی که سبدهای خرید محتوای یکسانی دارند. در غیر این صورت، false برگردانده می‌شود.
• بررسی برابری سبدهای خرید: در نهایت، تابع compareCarts برای دو سبد cart1 و cart2 اجرا می‌شود و نتیجه در متغیر areCartsEqual ذخیره می‌شود. سپس از یک عبارت شرطی برای چاپ پیام مربوط به اینکه آیا سبدهای خرید برابر هستند یا خیر استفاده می‌شود.
  چه زمانی باید از اپراتور === برای مقایسه آرایه‌ها استفاده کرد؟

از اپراتور === هرگز برای مقایسه آرایه‌ها استفاده نکنید. این اپراتور فقط برابری اشیاء را بررسی می‌کند، نه محتوای آن‌ها. از آنجایی که دو آرایه مجزا اشیاء متفاوتی هستند، حتی اگر عناصر آن‌ها یکسان باشند، با اپراتور === برابر نخواهند بود.

بهترین روش برای مقایسه برابری عمیق دو آرایه چیست؟

هیچ پاسخ قطعی برای این سوال وجود ندارد، زیرا بهترین روش به عوامل مختلفی مانند اندازه و پیچیدگی آرایه‌ها و ملاحظات مربوط به کارایی بستگی دارد. با این حال، به طور کلی، استفاده از حلقه for یا متد every()‎ همراه با بررسی برابری عمیق برای عناصر، رویکردی ساده و کارآمد برای آرایه‌های کوچک تا متوسط ​​است. برای آرایه‌های بزرگ یا پیچیده، استفاده از کتابخانه‌های جانبی مانند Lodash یا Underscore که توابع بهینه‌شده برای برابری عمیق اشیاء ارائه می‌دهند، می‌تواند مفید باشد.

پیشنهاد مطالعه: Event در جاوا اسکریپت – راهنمای جامع

چگونه می‌توانم بررسی کنم که آیا یک آرایه زیرمجموعه‌ای از آرایه دیگر است؟

برای بررسی اینکه آیا یک آرایه زیرمجموعه‌ای از آرایه دیگر است، می‌توانید از رویکردهای مختلفی استفاده کنید. یک روش ساده این است که از حلقه for برای پیمایش آرایه کوچکتر و بررسی وجود هر عنصر در آرایه بزرگتر استفاده کنید. اگر هر عنصر پیدا شد، آرایه کوچکتر زیرمجموعه‌ای از آرایه بزرگتر است. روش دیگر استفاده از متد some()‎ است که بررسی می‌کند آیا حداقل یک عنصر در آرایه شرط خاصی را برآورده می‌کند. در این مورد، شرط این است که عنصر فعلی در آرایه کوچکتر در آرایه بزرگتر نیز وجود داشته باشد.

چگونه می‌توانم آرایه‌ها را بر اساس طول و ترتیب عناصر خود مرتب کنم؟

برای مرتب‌سازی آرایه‌ها بر اساس طول و ترتیب عناصر، می‌توانید از توابع مرتب‌سازی داخلی جاوا اسکریپت مانند sort()‎ استفاده کنید. این تابع آرایه را بر اساس یک تابع مقایسه مرتب می‌کند که ترتیب دو عنصر را تعیین می‌کند. برای مرتب‌سازی بر اساس طول، می‌توانید یک تابع مقایسه ساده بنویسید که طول دو عنصر را مقایسه می‌کند. برای مرتب‌سازی بر اساس ترتیب، می‌توانید از تابع مقایسه پیش‌فرض sort()‎ استفاده کنید که عناصر را بر اساس مقادیر آن‌ها مرتب می‌کند.

چگونه می‌توانم با آرایه‌های حاوی اشیاء پیچیده کار کنم؟

مقایسه آرایه‌های حاوی اشیاء پیچیده نیاز به بررسی برابری عمیق هر یک از اشیاء نیز دارد. می‌توانید از توابع بازگشتی برای پیمایش اشیاء درون آرایه‌ها و مقایسه خواص و مقادیر آن‌ها به طور عمیق استفاده کنید. کتابخانه‌های جانبی مانند Lodash یا Underscore نیز توابعی برای برابری عمیق اشیاء ارائه می‌دهند که می‌توانند از آن‌ها برای رسیدگی به ساختارهای داده‌ای پیچیده به طور کارآمد استفاده کرد.

توجه: مطلب بالا فقط یک راهنمای کلی برای مقایسه آرایه‌ها در جاوا اسکریپت است. منابع و اطلاعات بیشتری در مورد این موضوع به صورت آنلاین در دسترس است.

کلام پایانی

مقایسه آرایه‌ها در جاوا اسکریپت یک وظیلفه رایج است که در سناریوهای مختلف برنامه‌نویسی کاربرد دارد. با درک روش‌های مختلف موجود، از جمله برابری عمیق، مقایسه طول و ترتیب، و رسیدگی به انواع داده‌های پیچیده، می‌توانید رویکرد مناسب را برای نیازهای خود انتخاب کنید و به طور کارآمد و دقیق آرایه‌ها را مقایسه کنید.

دوره آموزش کامل نود جی اس از مبتدی تا پیشرفته

کلیک کنید

اگر به دنبال یادگیری حرفه‌ای و کامل جاوا اسکریپت هستید و دوست دارید در این زبان برنامه‌نویسی به تخصص و درآمد خوبی برسید، پیشنهاد ما به شما استفاده از دوره‌های آموزش جاوا اسکریپت مکتب خونه است. پلتفرم مکتب خونه با ارائه انواع دوره آموزش جاوا اسکریپت، آموزش برنامه نویسی و همچنین آموزش طراحی سایت در خدمات کاربران خواهد بود. همچنین مکتب خونه در پایان هر دوره به کاربران گواهینامه مرتبط با دوره را اعطا می‌کند.