بیاموزید که چگونه توابع جاوا اسکریپت می توانند انعطاف پذیر باشند و چگونه می توانید از آنها برای ایجاد کد انعطاف پذیر و قابل استفاده مجدد استفاده کنید.
جاوا اسکریپت یک زبان قدرتمند است که توسط اکثر مرورگرهای مدرن پشتیبانی می شود و برای مبتدیان یک انتخاب عالی است.
درست مانند بسیاری دیگر از زبان های برنامه نویسی مدرن، جاوا اسکریپت از توابعی پشتیبانی می کند که به شما امکان می دهد یک بلوک کد را ایزوله کرده و از آن در جایی دیگر استفاده مجدد کنید. همچنین می توانید از تخصیص توابع به متغیرها استفاده کنید و آنها را مانند مقادیر دیگر به عنوان پارامتر ارسال کنید.
توابع مرتبه بالاتر چیست؟
ساده ترین تعریف برای یک تابع مرتبه بالاتر، تابعی است که با پذیرش آنها به عنوان پارامتر یا برگرداندن آنها، عملیات روی سایر توابع انجام می دهد. توابع مرتبه بالاتر به شدت در پارادایم برنامه نویسی تابعی استفاده می شوند. اگر به تازگی با جاوا اسکریپت شروع کرده اید، درک توابع درجه بالاتر ممکن است کمی دشوار باشد.
به مثال زیر توجه کنید:
function transform(fn) {
let resultArray = [];
return function (array) {
for (let i = 0; i < array.length; i++) {
resultArray.push(fn(array[i]))
}
return resultArray
}
}
در بلوک کد بالا، تابع تبدیل یک تابع مرتبه بالاتر است که تابع fn را به عنوان پارامتر می گیرد و یک تابع ناشناس را که آرایه را به عنوان پارامتر می گیرد، برمی گرداند.
هدف از تابع تبدیل، اصلاح عناصر موجود در آرایه است. ابتدا کد یک متغیر resultArray را تعریف می کند و آن را به یک آرایه خالی متصل می کند.
تابع transform یک تابع ناشناس را برمی گرداند که از طریق هر عنصر در آرایه حلقه می زند، سپس عنصر را برای محاسبه به تابع fn می دهد و نتیجه را به آرایه نتیجه می دهد. پس از اتمام حلقه، تابع ناشناس آرایه نتیجه را برمی گرداند.
const function1 = transform((x) => x * 2)
console.log(function1([ 2, 3, 4, 5, 6 ])) /* [ 4, 6, 8, 10, 12] */
بلوک کد بالا تابع ناشناس برگردانده شده توسط تابع تبدیل را به متغیر ثابت function1 اختصاص می دهد. fn حاصل ضرب x را که جایگزینی برای آرایه[i] است برمی گرداند.
کد همچنین یک آرایه را به عنوان پارامتر به function1 ارسال می کند و سپس نتیجه را در کنسول ثبت می کند. یک راه کوتاهتر برای نوشتن این خواهد بود:
console.log(transform((x) => x * 2)([ 2, 3, 4, 5, 6 ]))
جاوا اسکریپت دارای یک تابع مرتبه بالاتر داخلی است که اساساً همان کار تبدیل را انجام می دهد که بعداً به آن خواهیم پرداخت.
امیدواریم که شما شروع به درک نحوه عملکرد توابع درجه بالاتر در جاوا اسکریپت کرده اید. به تابع زیر نگاهی بیندازید و ببینید آیا می توانید حدس بزنید چه کار می کند یا خیر.
function filterAndTransform(fn, arrayToBeFiltered, condition) {
let filteredArray = [];
for (let i = 0; i < arrayToBeFiltered.length; i++) {
if (condition(arrayToBeFiltered[i])) {
let y = transform(fn)([ arrayToBeFiltered[i] ])[0]
filteredArray.push(y)
} else {
filteredArray.push(arrayToBeFiltered[i])
}
}
return filteredArray
}
این بلوک کد تابعی را تعریف میکند که آنچه را که ممکن است مشکوک باشید انجام میدهد – عناصر موجود در آرایه را که شرایط خاصی را برآورده میکنند بررسی میکند و آنها را با تابع transform() تبدیل میکند. برای استفاده از این تابع، این کار را انجام دهید:
filterAndTransform((x) => x * 2, [ 1, 2, 3, 4, 5 ], (x) => x % 2 === 0)
برخلاف تابع تبدیل، تابع filterAndTransform دو تابع به عنوان پارامتر دارد: fn و شرط. تابع شرط بررسی می کند که آیا پارامتر پاس شده است یا خیر، یک عدد زوج است یا خیر، و مقدار true را برمی گرداند. در غیر این صورت، false برمی گردد.
اگر شرط به true تبدیل شود (شرط برقرار است)، تنها در این صورت تابع تبدیل فراخوانی می شود. اگر با یک آرایه کار می کنید و می خواهید عناصر خاصی را تغییر دهید، این منطق می تواند مفید باشد. اگر این کد را در کنسول مرورگر اجرا کنید، باید پاسخ زیر را دریافت کنید:
[ 1, 4, 3, 8, 5 ]
می بینید که تابع فقط عناصری را تغییر می دهد که شرایط خاصی را برآورده می کنند، و عناصری را که شرایط را برآورده نمی کنند، به همان صورت باقی می گذارد.
تابع Array.map() Higher-Order در جاوا اسکریپت
متدهای آرایه مانند map() توابع مرتبه بالاتری هستند که دستکاری آرایهها را آسانتر میکنند. در اینجا نحوه عملکرد آن آمده است.
let array = [ 1, 2, 3, 4, 5 ];
let transformedArray = array.map((x) => x * 2);
هنگامی که transformedArray را در کنسول مرورگر وارد می کنید، باید همان نتیجه را دریافت کنید، با تابع تبدیل که قبلاً ذکر شد دریافت کردید:
[ 2, 4, 6, 8, 10 ]
() array.map دارای دو پارامتر است، پارامتر اول به خود عنصر اشاره دارد، در حالی که پارامتر دوم به شاخص عنصر (موقعیت در آرایه) اشاره دارد. فقط با ()array.map می توانید به نتایج مشابه تابع filterAndTransform دست پیدا کنید. در اینجا نحوه انجام آن آمده است:
let array = [ 1, 2, 3, 4, 5 ];
let transformedArray = array.map((x) => x % 2 === 0 ? x * 2 : x);
در بلوک کد بالا، اگر عنصر زوج باشد، تابع حاصل ضرب عنصر فعلی و 2 را برمیگرداند. در غیر این صورت، عنصر را دست نخورده برمی گرداند.
با عملکرد نقشه داخلی، شما موفق شده اید نیاز به چندین خط کد را از بین ببرید، در نتیجه کد بسیار تمیزتر و شانس کمتری برای بروز اشکال ایجاد می کنید.
تابع Array.filter() در جاوا اسکریپت
وقتی متد فیلتر را روی یک آرایه فراخوانی می کنید، مطمئن شوید که مقدار بازگشتی تابعی که به متد ارسال می کنید درست یا نادرست است. متد فیلتر، آرایهای حاوی عناصری را برمیگرداند که شرایط ارسال شده را برآورده میکنند. در اینجا نحوه استفاده از آن آمده است.
function checkFirstLetter(word) {
let vowels = "aeiou"
if (vowels.includes(word[0].toLowerCase())) {
return word;
} else {
return;
}
}
let words = [ "Hello", "from", "the", "children", "of", "planet", "Earth" ];
let result = words.filter((x) => checkFirstLetter(x))
بلوک کد بالا از آرایه کلمات عبور می کند و هر کلمه ای را که حرف اول آن یک مصوت است فیلتر می کند. هنگامی که کد را اجرا می کنید و متغیر نتیجه را وارد می کنید، باید نتایج زیر را دریافت کنید:
[ 'of', 'Earth' ];
تابع Array.reduce() در جاوا اسکریپت
تابع درجه بالاتر ()reduce دارای دو پارامتر است. اولین پارامتر تابع کاهش است. این تابع کاهش وظیفه ترکیب دو مقدار و برگرداندن آن مقدار را بر عهده دارد. پارامتر دوم اختیاری است.
مقدار اولیه را برای ارسال به تابع تعریف می کند. اگر می خواهید مجموعی از تمام عناصر یک آرایه را برگردانید، می توانید موارد زیر را انجام دهید:
let a = [ 1, 2, 3, 4, 5];
let sum = 0;
for (let i = 0; i < a.length; i++) {
sum = sum + a[i];
}
console.log(sum);
اگر کد را اجرا می کنید، مجموع باید 15 باشد. همچنین می توانید رویکرد متفاوتی با تابع کاهش داشته باشید.
let a = [ 1, 2, 3, 4, 5 ];
sum = a.reduce((c, n) => c + n);
console.log(sum);
بلوک کد بالا در مقایسه با مثال قبلی بسیار تمیزتر است. در این مثال، تابع کاهش دو پارامتر دارد: c و n. c به عنصر فعلی اشاره دارد در حالی که n به عنصر بعدی در آرایه اشاره دارد.
هنگامی که کد اجرا می شود، تابع کاهنده از آرایه عبور می کند و مطمئن شوید که مقدار فعلی را به نتیجه مرحله قبل اضافه می کند.
قدرت توابع مرتبه بالاتر
توابع در جاوا اسکریپت قدرتمند هستند، اما توابع درجه بالاتر همه چیز را به سطح بالاتری می برند. آنها به طور گسترده در برنامه نویسی عملکردی استفاده می شوند و به شما امکان می دهند آرایه ها را به راحتی فیلتر، کاهش و نقشه برداری کنید.
توابع درجه بالاتر می توانند به شما در نوشتن کدهای ماژولار و قابل استفاده مجدد در هنگام ساخت برنامه ها کمک کنند.