⌨️ 5 روش برای تعریف تابع در جاوا اسکریپت

1️⃣ Function Declaration :

function sum (a, b){
    return a + b;
}
sum (2, 3) // 5

این دسته از توابع به صورت خودکار اجرا نمیشن ، بلکه ما باید اون هارو فراخوانی کنیم یا به قول خودمون «صدا بزنیم» (به انگلیسی میگیم invoke کردن).ماهیتشون به این شکل هست که برای استفاده در آینده ذخیره میشن.
🔥🔥🔥🔥🔥🔥🔥🔥
2️⃣Function Expression :

let sum = function (a, b){
    return a + b;
}
sum (2, 3) // 5

دوستان این تابع اغلب زمانی استفاده میشه که شما می‌خواید یک تابع رو به یک متغیر اختصاص بدید یا اون رو به عنوان یک آرگومان به تابع دیگه ای ارسال کنید. اونا انعطاف‌پذیری رو در نحوه تعریف و استفاده از توابع تو جاوا اسکریپت فراهم میکنن.
🔥🔥🔥🔥🔥🔥🔥🔥
3️⃣Arrow function :

let sum = (a, b) => {
    return a + b;
}
sum (2, 3) // 5

توابع Arrow به شما اجازه میده تا با استفاده از => به سرعت یک تابع جاوااسکریپتی رو همراه با پارامتر و یا بدون پارامتر ایجاد کنید. یکی از بزرگترین مزیت‌ های این حالت این هست که شما می‌تونین بدون استفاده از کلمه کلیدی function و یا return یک تابع جاوااسکریپتی رو بسازید.
🔥🔥🔥🔥🔥🔥🔥🔥
4️⃣IIFE Function :

(function (a, b) {
    return a + b;
}) (2, 3) // 5

کلمه ی IIFE مخفف عبارت (Immediately Invoked Function Expression) هست. درسته یک اسم پیچیده، ولی یک مفهوم بسیار ساده!
در واقع IIFE به تابعی گفته میشه که به محض تعریف شدن، اجرا میشه.
🔥🔥🔥🔥🔥🔥🔥🔥
5️⃣Function Constructor :

let sum = new Function(
    'a',
    'b',
    'return a + b'
);
sum (2, 3) // 5

این constructor function تابعی تو جاوااسکریپت هست که برای ایجاد کردن و برگردوندن یک empty object به کار میرن.
🔥🔥🔥🔥🔥🔥🔥🔥
⭕️ تو این پست سعی کردم تمامی Function هارو به همراه نحوه ی عملکردشون بهتون به طور خلاصه و مفید توضیح بدم.
⭕️ توی پست های بعدی میام نحوه ی عملکرد ، ویژگی و مقایسه تک تک این فانکشن هارو براتون با مثال بررسی میکنم.
هدفم اینه که 0 تا 100 فانکشن هارو همینجا باهم یاد بگیریم😉🔥

#javascript #function
☕️ @CodeExplore

🔵 ایجاد پالت های رنگی با استفاده از تابع ()color-mix در CSS

تابع ()color-mix به ما این اجازه رو میده تا دو رنگی که می خوایم مخلوط کنیم رو مشخص کنیم و بعدش نتیجه رو خروجی بده. ما می تونیم مقدار هر رنگ در مخلوط رو کنترل کنیم، همچنین فضای تداخل رنگ رو مشخص کنیم که تعیین میکنه چطوری رنگ ها با همدیگه ترکیب میشن.

ما مقدار هر رنگ رو به صورت درصد مشخص می کنیم. اگر درصدهای هر دو رنگ رو حذف کنیم، تابع ()color-mix به طور پیش فرض برای هر کدوم از اونها از 50% حساب میکنه. همونطور که تو کد زیر نشان دادیم ، مخلوط کردن رنگ قرمز و آبی با مقدار برابر، به ما یک سایه بنفش خروجی میده.

.result {
  background-color: color-mix(in srgb, blue, red);
}

#css #function #color‌
☕️ @CodeExplore

🔵 یک نکته خفن تو CSS

👍 از توابع مثلثاتی تو CSS می تونیم تاخیر انتقال پلکانی روون بسازیم

.character {
  transition-delay:
    calc(sin((var(--index) / 12) * 45deg) * 0.475s);
}

#css #function
☕️ @CodeExplore