چگونه از تابع map استفاده کنم؟!


لینک آپارات: https://www.aparat.com/v/yhQpz

https://www.aparat.com/v/yhQpz

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

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

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

حالا اینجا ما یک راهی رو میبینیم که با استفاده از آن چند عنصر یک آرایه را ویرایش کردیم.من اینجا، یک آرایه دارم که دارای 3 مقدار 5،6،7 است و من دارم یک تابع Foreach می نویسم که تمام این عناصر این آرایه را پیمایش کند. و Foreach همانند map، هم میتواند خود عنصر را بگیرد و هم شاخص آن عنصر را، شما میتوانید آرایه فوق را به عنوان آرگومان سوم اضافه کنید، که دیگر نخواهید اینطوری صدایش کنید. پس میتوانید ببینید که کاری میخواهیم اینجا بکنیم این است که عنصر آرایه را با شاخص آن حساب کرده و 1 دونه به مقدار آن اضافه کنیم. کاملا نرمال است درسته؟ پس وقتی Console.log آرایه اصلی رو میگیریم میبینیم که آن را ویرایش کرده، و الان عناصر ما به ترتیب مقادیر 6،7،8 را دارند. پس به آرایه اصلی ما را تغییر میدهد.

حالا بیایید یک نگاهی بیندازیم که چطور همین کار را با map انجام دهیم. اینجا ما همان عملکرد را داریم، ولی این دفعه با تابع map پیاده سازی شده و همانطور که میبینید آنقدر ها هم با مثال قبلی فرقی ندارد، منتهی ما در اینجا آرایه را گرفته و یک آرایه جدید از آن درست میکنیم. این بسیار مهم است چون map در واقع آرایه را برمی گرداند که دستکاری شده و شما میتوانید هر کاری که دوست داشتید با عناصر آن در این CallBack انجام دهید. و کاری که ما اینجا داریم انجام میدهیم به عناصر آرایه اصلی هیچ کاری ندارد و تمام تغییرات ما در یک کپی ریخته میشود. پس این یکی از تفاوت های اصلی بین تابع map و بقیه راهکار های پیمایش است همینطور تابع map را کمی جذابتر میکند. بیاید حالا یک نگاهی بیندازیم که چطور میتوان استفاده مفید تری از این تابع کرد.

اگر اینجا به کاری که ما داریم انجام میدهیم نگاه کنید، ما آمده ایم و Callback قبلی را برداشته، و آن را تبدیل به یک تابع جدا کردم که همینجا است. ما اسم این تابع را گذاشتیم INC مخفف Increment. این تابع یک آیتم را میگیرد، و آیتم +1 را برمیگرداند. حالا به جای CallBack ما در تابع Map مان این تابع را صدا کردیم، بنابراین کمی واضح تر میشود که map برای چه کاری طراحی شده. Map برای این طراحی شده که، مقداری دیتا را بگیرد و روی آن ها یک سری تغییرات انجام داده بدون اینکه دیتا اصلی تغییر کند حال بخاطر اینکه map یک آرایه جدید برمیگرداند، بدین معناست که ما همینطور می توانیم چندین تغییر را زنجیره وار به هم بچسبانیم.پس با وجود اینکه این همان کار را انجام میدهد، من فکر میکنم کمی جذاب تر میشد اگر کاری شبیه این میکردیم.

حالا ما در حال تعریف 2 نوع تغییرات هستیم. همانطور که میبینید این مثال مانند مثال قبلی است ما فقط داریم چند آیتم را به مقدارشان اضافه میکنیم، اما ما این تابع دیگر را هم تعریف کردیم که کارش این است که آیتم را به توان 2 برساند. حالا اگر به اینجا نگاه کنید، این قسمتی است که واقعا قضیه جذاب می شود، و این بخاطر این است که ما می توانیم یک تبدیل صورت را گرفته و برای یک تبدیل صورت دیگر پاس می دهیم. بنابراین در اینجا ما map را 2 بار صدا کردیم اولین بار به همه آیتم های آرایه 1 دانه اضافه کرده و برای بار دوم آن را به توان۲ میرسانیم. حال ما یک مورد استفاده جذاب تر از map اینجا داریم و من فکر میکنم اگر به map با این منظور نگاه کنیم می بینید که چرا اینقدر مهم است که به آرایه اصلی دست نزنیم بلکه، یک کپی از آن گرفته و آن را ویرایش کنیم در اینجا هست که map قدرت خود را نسبت به foreach نشان می دهد و یا حداقل استفاده از آنرا باحال تر میکند.