قسمت سوم - مفاهیم و الگوهای برنامه نویسی تابعی (Functional) در جاوااسکریپت

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

اما فقط در زبان هایی که برنامه نویسی تابعی را پشتیبانی می کنند شما می توانید مانند جاوااسکریپت عبارت زیر را داشته باشید و تابع را به یک متغییر تخصیص دهید.

پس همانطور که در قسمت اول این گفتار اشاره‌ای داشتیم :

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

در ادامه کاربردهای این قابلیت را توضیح خواهیم داد.

توابع Higher-order

تابعی که تابع دیگر را به عنوان پارامتر و همانطور که گفتیم به عنوان یک مقدار قبول می کند و یا تابعی را به عنوان نتیجه بر می گرداند تابع Higher-order نامیده می‌شود.

اما این قابلیت چه کاربردی دارد؟

با توابع Higher-order ما می توانیم چند فانکشن را با هم ترکیب کنیم و کد را خوانا و کمتر کنیم.

فرض کنید ما یک آرایه از اشخاص داریم و می خواهیم اشخاصی که ایرانی هستند جدا کنیم.

راه اول این است که با یک حلقه for این کار را انجام دهیم مثال زیر:

اما همین کار را می توانیم با filter انجام دهیم

به این صورت که اول یک فانکشن بنویسیم که ملیت شخص را چک کند و نتیجه آن را به تابع فیلتر به صورت زیر ارسال کنیم.

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

لازم بذکر است که می توانیم با قابلیت های ES6 در جاوااسکریپت کد فوق را کمتر هم به صورت زیر بنماییم.


تابعی Map مثل filter که در قسمت فوق صحبت کردیم یک تابع Higher Order دیگر است و مثل filter یک آرایه را می پیماید و برخلاف filter که چند رکورد از آرایه را بر می گرداند، map آرایه ورودی را می تواند تغییر شکل دهد.

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

روش اول با استفاده for..loop به صورت زیر است.

اما همین کد را می توانیم با استفاده از تابع map با استفاده از برنامه نویسی تابعی به صورت زیر بنویسیم.

و با استفاده از Es6 به صورت ساده و خوانا زیر بنویسیم.

تابع دیگری که می خواهیم اینجا اشاره‌ای داشته باشیم، reduce است، reduce بر خلاف توابع فوق یعنی filter و map که یک آرایه دیگر برمی گردانند تابع reduce با اجرای فانکشن reduce که شما برای هر عنصر آرایه تولید می کنید در نهایت یک مقدار برمی گرداند.

به عنوان مثال شما اگر بخواهید مجموع مقادیر آرایه زیر را باهم جمع کنید.

ابتدا یک فانکشن reduce به صورت زیر ایجاد می‌کنیم

و این فانکشن را به تابع reduce ارسال می کنیم

توجه داشته باشید که تابع reduce دو مقدار می گیرد، currentValue مقدار جاری هر عنصر آرایه و accumulator جمع مقادیر است

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

خروجی کد فوق به صورت زیر است.

این قسمت را اینجا پایان می دهیم در قسمت بعدی Closures و Currying بررسی خواهیم کرد.

لینک قسمت های قبلی رانیز می‌توانید مشاهده فرمایید.

قسمت اول

https://virgool.io/@amini.hooman/%D9%85%D9%81%D8%A7%D9%87%DB%8C%D9%85-%D9%88-%D8%A7%D9%84%DA%AF%D9%88%DB%8C-%D9%87%D8%A7%DB%8C-%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87-%D9%86%D9%88%DB%8C%D8%B3%DB%8C-%D8%AA%D8%A7%D8%A8%D8%B9%DB%8C-functional-%D8%AF%D8%B1-%D8%AC%D8%A7%D9%88%D8%A7%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA-%D9%82%D8%B3%D9%85%D8%AA-%D8%A7%D9%88%D9%84-hkn5rmvuwnl5

قسمت دوم

https://virgool.io/@amini.hooman/%D9%82%D8%B3%D9%85%D8%AA-%D8%AF%D9%88%D9%85-%D9%85%D9%81%D8%A7%D9%87%DB%8C%D9%85-%D9%88-%D8%A7%D9%84%DA%AF%D9%88%D9%87%D8%A7%DB%8C-%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87-%D9%86%D9%88%DB%8C%D8%B3%DB%8C-%D8%AA%D8%A7%D8%A8%D8%B9%DB%8C-functional-%D8%AF%D8%B1-%D8%AC%D8%A7%D9%88%D8%A7%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA-w7tfysqmkvmt