پرش به مطلب اصلی

توابع

توابع مهم js از جمله map, filter, find, reduce, ...

Arrow Functions

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

const arrowFunction = (inputs) =>{
// your code

return (outputs)
}

Callback Functions

توابعی که ورودی آنها یک تابع است مانند useEffect در react.js


const callbackFunction = (callback, a, b) => {
if (!a || !b) return 0;
return callback(a, b);
}

console.log(callbackFunction((a, b) => (a + b), 10, 11)) // 21
console.log(callbackFunction((a, b) => (a - b), 20, 11)) // 9

Map

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

const numbers = [12, 10, 3, 4, 7, 8, 13]
const newNumbers = numbers.map((number, index) => number * index); // [0, 10, 6, 12, 28, 40, 78]

Filter

روی یک آرایه پیمایش میکنه و نکته‌ی مهم این هست که بعد از اتمام پیمایش یک آرایه‌ی جدید برمیگردونه و مقادیری که از شرط گذر کنن باقی میمونن یعنی در شرط filter باید صدق کنند و نکته ای که هست اینه که اگر به ازای هر عضو آرایه شرط برقرار باشه مقدار همون عضو رو برمیگردونه

const numbers = [12, 10, 3, 4, 7, 8, 13]
const newNumbers = numbers.filter((number, index) => number * index > 8); // [10, 4, 7, 8, 13]

Find

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

const numbers = [12, 10, 3, 4, 7, 8, 13]
const newNumbers = numbers.filter((number, index) => number * index > 8); // 10

Reduce

وظیفه‌ی این تابع این هست که تمام مقادیر یک آرایه رو کاهش بده به یک چیز و خروجیش یک عضو هست دو مقدار accumulator و currentValue میگیره که accumulator مقدار نهایی رو نگه میداره و هر تغییری باید روی این اعمال بشه.

نکته: توی خط آخر بخش هایلایت شده مقدار 0 مقدار اولیه‌ی accumulator است

const numbers = [12, 10, 3, 4, 7, 8, 13]
const sum = numbers.reduce((accumulator, currentValue) => {
return accumulator + currentValue;
}, 0); // 57 = 12 + 10 + 3 + 4 + 7 + 9 + 13

Returns

در جاواسکریپت اگر مقدار بازگشتی یک تابع صرفا یک چیز باشد و نیاز به موارد دیگر نباشد میتوان عبارت return(...) را با (...) جایگزین کرد

const numbers = [12, 3, 54, 12, 45, 1]
const newNumbers = numbers.map(number => {
const newNum = number*2+1;
return newNum
}) // [25, 7, 109, 25, 91, 3]

میتوان با کد زیر جایگزین کرد

const numbers = [12, 3, 54, 12, 45, 1]
const newNumbers = numbers.map(number => (number*2+1)) // [25, 7, 109, 25, 91, 3]