Codespian | کدسپین – Telegram
Codespian | کدسپین
52 subscribers
22 photos
2 videos
12 files
82 links
Codespian Official Community Channel
Admin: @AMIRALI_H0SSEINI
Download Telegram
Codespian | کدسپین
https://javanoscript.info/function-basics #JS
▎نام‌گذاری توابع

این مثال‌ها معانی رایج پیشوندها را فرض می‌کنند. شما و تیم‌تان آزاد هستید تا بر معانی دیگری توافق کنید، اما معمولاً تفاوت چندانی ندارند. در هر صورت، باید درک دقیقی از معنای هر پیشوند داشته باشید و بدانید که یک تابع با پیشوند مشخص چه کارهایی می‌تواند و چه کارهایی نمی‌تواند انجام دهد. تمام توابع با پیشوند یکسان باید از قوانین پیروی کنند و تیم باید این دانش را به اشتراک بگذارد.

نام‌های فوق‌العاده کوتاه برای توابع

توابعی که به طور مکرر استفاده می‌شوند، گاهی نام‌های فوق‌العاده کوتاهی دارند.

به عنوان مثال، فریم‌ورک jQuery یک تابع با نام $ تعریف می‌کند. کتابخانه Lodash نیز تابع اصلی خود را با نام _ دارد.

این‌ها استثنا هستند. به طور کلی، نام توابع باید مختصر و توصیفی باشد.

▎تابع = نظرات

توابع باید کوتاه باشند و دقیقاً یک کار انجام دهند. اگر آن کار بزرگ است، شاید ارزشش را داشته باشد که تابع را به چند تابع کوچکتر تقسیم کنیم. گاهی اوقات پیروی از این قاعده ممکن است آسان نباشد، اما قطعاً چیز خوبی است.

یک تابع جداگانه نه تنها آزمایش و اشکال‌زدایی آن آسان‌تر است، بلکه وجود آن خود یک نظر عالی است!

برای مثال، دو تابع showPrimes(n) زیر را مقایسه کنید. هر کدام اعداد اول تا n را نمایش می‌دهند.

نسخه اول از یک برچسب استفاده می‌کند:

نسخه دوم از یک تابع اضافی به نام isPrime(n) برای بررسی اول بودن استفاده می‌کند:

نسخه دوم آسان‌تر قابل درک است، درست است؟ به جای قطعه کد، نام عمل (isPrime) را مشاهده می‌کنیم. گاهی اوقات مردم به چنین کدی به عنوان خودتوصیف اشاره می‌کنند.

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

▎خلاصه

اعلام یک تابع به این شکل است:

مقادیر ارسال شده به یک تابع به عنوان پارامترها به متغیرهای محلی آن کپی می‌شوند.

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

یک تابع می‌تواند یک مقدار را بازگرداند. اگر این کار را نکند، نتیجه‌اش undefined خواهد بود.

برای تمیز و قابل فهم نگه‌داشتن کد، توصیه می‌شود عمدتاً از متغیرهای محلی و پارامترها در تابع استفاده کنید، نه از متغیرهای خارجی.

همیشه درک یک تابع که پارامترها را دریافت می‌کند، با آن‌ها کار می‌کند و یک نتیجه بازمی‌گرداند، آسان‌تر از یک تابع است که هیچ پارامتری دریافت نمی‌کند اما متغیرهای خارجی را به عنوان اثر جانبی تغییر می‌دهد.

▎نام‌گذاری توابع:

• نام باید به وضوح توصیف کند که تابع چه کاری انجام می‌دهد. وقتی ما یک فراخوانی تابع را در کد مشاهده می‌کنیم، یک نام خوب بلافاصله به ما درک می‌دهد که چه کاری انجام می‌دهد و چه چیزی برمی‌گرداند.


• یک تابع یک عمل است، بنابراین نام‌های توابع معمولاً فعلی هستند.

• پیشوندهای توابع معروفی مانند create…، show…، get…، check… و غیره وجود دارد. از آن‌ها برای اشاره به اینکه یک تابع چه کاری انجام می‌دهد استفاده کنید.

توابع بلوک‌های اصلی اسکریپت‌ها هستند. اکنون اصول اولیه را پوشش داده‌ایم، بنابراین واقعاً می‌توانیم شروع به ایجاد و استفاده از آن‌ها کنیم. اما این فقط آغاز راه است. ما بارها به آن‌ها بازخواهیم گشت و به ویژگی‌های پیشرفته‌تر آن‌ها خواهیم پرداخت.
توابع ناشناس و تفاوت‌های بین اعلام تابع و بیان تابع

در اینجا، توابع به‌طور مستقیم در داخل فراخوانی ask(...) اعلام شده‌اند. این توابع نام ندارند و به همین دلیل به آن‌ها توابع ناشناس (Anonymous Functions) گفته می‌شود. چنین توابعی از خارج از ask قابل دسترسی نیستند (زیرا به متغیرها اختصاص داده نشده‌اند)، اما این دقیقاً همان چیزی است که ما در اینجا می‌خواهیم.

این نوع کد به‌طور طبیعی در اسکریپت‌های ما ظاهر می‌شود و با روحیه جاوااسکریپت سازگار است.

یک تابع یک مقدار است که نمایانگر یک "عمل" است

مقادیر معمولی مانند رشته‌ها یا اعداد نمایانگر داده‌ها هستند.

یک تابع می‌تواند به‌عنوان یک عمل درک شود.

ما می‌توانیم آن را بین متغیرها منتقل کنیم و هر زمان که بخواهیم اجرا کنیم.

تفاوت بین اعلام تابع و بیان تابع

بیایید تفاوت‌های کلیدی بین اعلام تابع (Function Declarations) و بیان تابع (Function Expressions) را فرموله کنیم.

اول، نحوه تشخیص آن‌ها در کد:

اعلام تابع: تابعی که به‌عنوان یک بیانیه جداگانه در جریان اصلی کد تعریف شده است:

function sayHi() {
console.log("Hello!");
}


بیان تابع: تابعی که در داخل یک عبارت یا ساختار نحوی دیگر ایجاد می‌شود. در اینجا، تابع در سمت راست عبارت انتساب (=) ایجاد می‌شود:

let sum = function(a, b) {
return a + b;
};


تفاوت ظریف‌تر: زمانی که تابع توسط موتور جاوااسکریپت ایجاد می‌شود.

یک بیان تابع زمانی ایجاد می‌شود که اجرا به آن نقطه برسد و تنها از آن لحظه قابل استفاده است.

زمانی که جریان اجرا به سمت راست عبارت انتساب let sum = function... می‌رسد، تابع ایجاد شده و از آن زمان می‌توان از آن استفاده کرد (به آن اختصاص داد، فراخوانی کرد و غیره).

اعلام توابع متفاوت هستند.

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

به‌عنوان مثال، یک اعلام تابع جهانی در کل اسکریپت قابل مشاهده است، هرچند که در کجا قرار داشته باشد.

این به دلیل الگوریتم‌های داخلی است. وقتی جاوااسکریپت آماده اجرای اسکریپت می‌شود، ابتدا به دنبال اعلام‌های تابع جهانی در آن می‌گردد و توابع را ایجاد می‌کند. می‌توانیم این مرحله را به‌عنوان یک "مرحله اولیه" در نظر بگیریم.

و پس از پردازش تمام اعلام‌های تابع، کد اجرا می‌شود. بنابراین به این توابع دسترسی دارد.

به‌عنوان مثال، این کار می‌کند:

sayHi(); // Hello!
function sayHi() {
console.log("Hello!");
}


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

…اگر این یک بیان تابع بود، پس این کار نمی‌کرد:

بیان‌های تابع زمانی ایجاد می‌شوند که اجرا به آن‌ها برسد. این فقط در خط (*) اتفاق می‌افتد. خیلی دیر است.

ویژگی خاص دیگر اعلام توابع

ویژگی خاص دیگر اعلام توابع، دامنه بلوکی آن‌هاست.

در حالت سخت (Strict Mode)، وقتی یک اعلام تابع درون یک بلوک کد قرار دارد، در تمام نقاط داخل آن بلوک قابل مشاهده است. اما نه خارج از آن.

برای مثال، فرض کنید که ما نیاز داریم تا تابع welcome() را بر اساس متغیر age که در زمان اجرا دریافت می‌کنیم، اعلام کنیم. سپس قصد داریم از آن بعداً استفاده کنیم.

اگر از اعلام تابع استفاده کنیم، این کار به‌درستی انجام نمی‌شود:

if (age > 18) {
function welcome() {
console.log("Welcome!");
}
}
welcome(); // Error: welcome is not defined


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

راه‌حل

چه کار کنیم تا welcome خارج از if قابل مشاهده باشد؟

روش صحیح این است که از بیان تابع استفاده کرده و welcome را به متغیری که خارج از if اعلام شده و دارای دید مناسب است اختصاص دهیم.

این کد به‌درستی کار می‌کند:

let welcome;

if (age > 18) {
welcome = function() {
console.log("Welcome!");
};
}

welcome(); // Welcome!


یا می‌توانیم این را حتی ساده‌تر کنیم با استفاده از عملگر سوالی ?:

let welcome = age > 18 ? function() { console.log("Welcome!"); } : null;


چه زمانی باید از اعلام تابع و چه زمانی از بیان تابع استفاده کنیم؟

به‌طور کلی، وقتی نیاز داریم تا یک تابع را اعلام کنیم، اولین چیزی که باید در نظر بگیریم، نحو اعلام تابع است. این نحو آزادی بیشتری برای سازماندهی کد ما فراهم می‌کند، زیرا می‌توانیم چنین توابعی را قبل از اینکه تعریف شوند فراخوانی کنیم.
Codespian | کدسپین
https://javanoscript.info/function-expressions #JS
این همچنین برای خوانایی بهتر است، زیرا پیدا کردن function f(…) {…} در کد آسان‌تر از let f = function(…) {…}; است. اعلام توابع بیشتر "جلب توجه" می‌کنند.

…اما اگر به هر دلیلی اعلام تابع مناسب ما نباشد، یا نیاز به یک اعلام شرطی داشته باشیم (که در مثال قبلی دیدیم)، پس باید از بیان تابع استفاده کنیم.

▎خلاصه

توابع مقادیر هستند. آن‌ها می‌توانند اختصاص داده شوند، کپی شوند یا در هر جایی از کد اعلام شوند.

اگر تابع به‌عنوان یک بیانیه جداگانه در جریان اصلی کد اعلام شود، به آن "اعلام تابع" گفته می‌شود.

اگر تابع به‌عنوان بخشی از یک عبارت ایجاد شود، به آن "بیان تابع" گفته می‌شود.

▎اعلام توابع و بیان توابع در جاوااسکریپت

اعلام توابع قبل از اینکه بلوک کد اجرا شود، پردازش می‌شوند. این توابع در تمام نقاط بلوک قابل مشاهده هستند.

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

در اکثر موارد، زمانی که نیاز به اعلام یک تابع داریم، استفاده از اعلام تابع ترجیح داده می‌شود، زیرا این توابع قبل از خود اعلام قابل مشاهده هستند. این ویژگی به ما انعطاف‌پذیری بیشتری در سازماندهی کد می‌دهد و معمولاً خوانایی بیشتری دارد.

بنابراین، ما باید از بیان تابع تنها زمانی استفاده کنیم که اعلام تابع برای وظیفه مورد نظر مناسب نباشد. در این فصل چند مثال از این موضوع را دیده‌ایم و در آینده نیز بیشتر خواهیم دید.
پرامپت درست = یادگیری سریع 👌🏻

وقتی در حال مطالعه داکیومنت یه قسمتی رو خوب متوجه نمیشین و برای درک بیشتر می‌خواین از هوش مصنوعی استفاده کنین، متن داکیومنت رو براش ارسال کنین و به جای ″درخواست ترجمه″ ازش بخواین اون موضوع رو بهتون ″یاد بده″

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

با همین نکته ریز هوش مصنوعی با دیدِ تدریس بهتون جواب میده و برای درک بهتر اون موضوع براتون چندتا مثال می‌زنه✌️🏻❤️

📌 اگه باز هم متوجه نشدین مجددا ازش بخواین مثال های بیشتری براتون بزنه یا بیشتر توضیح بده.
2👍1
داشتن اپلیکیشن های مرتبط با برنامه نویسی باعث میشن ناخودآگاه وقتمون رو بیشتر صرف یادگیری و پیشرفت بکنیم


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


این اسکرین‌شات از ۹ اپلیکیشن مربوط به کوئیزها، سوالات مصاحبه‌ای و ... هست که خودم ازشون استفاده می‌کنم و پیشنهاد می‌کنم اگه شما هم با جاوا اسکریپت کار می‌کنین نصب کرده و ازشون استفاده کنین💡


تک تک این اپلیکیشن‌ها رو می‌تونین از Google Play دانلود کنین و لذتشو ببرین ❤️
👍1
🔧 اهمیت ریفکتور کردن کد (Refactoring) + منابع پیشنهادی

برنامه‌نویسی فقط نوشتن کد نیست، نگه‌داری و بهبود اون هم به همون اندازه مهمه.
ریفکتور کردن یعنی بازنویسی کد بدون تغییر در عملکردش، با هدف خواناتر، ساده‌تر و قابل نگهداری‌تر شدنش.

چرا ریفکتور مهمه؟

کاهش پیچیدگی کد

جلوگیری از ایجاد باگ در آینده

آمادگی برای افزودن قابلیت‌های جدید

همکاری بهتر در تیم

افزایش سرعت توسعه در بلندمدت

💡 نشونه‌هایی که بهت میگن وقت ریفکتوره:

کدی که حتی خودت هم نمی‌فهمیش 😅

توابع خیلی طولانی

تکرار زیاد تو کد

وابستگی‌های زیاد بین بخش‌ها

📚 منابع پیشنهادی برای یادگیری ریفکتور:

🔹 کتاب "Refactoring" نوشته‌ی Martin Fowler
یه مرجع کلاسیک و کاربردی برای درک اصول و تکنیک‌های ریفکتور.

🔹 وب‌سایت Refactoring.guru
ساده، مصور، و به شدت آموزنده!
🌐 https://refactoring.guru
تکنیک "trace" در برنامه‌نویسی به معنای ردیابی و ثبت مراحل اجرای یک برنامه یا بخشی از آن است. این تکنیک معمولاً برای بررسی رفتار کد و شناسایی مشکلات یا اشکالات استفاده می‌شود. در مورد حلقه‌ها، تکنیک trace می‌تواند شامل ثبت مقادیر متغیرها، وضعیت‌ها و هر گونه اطلاعات دیگری باشد که به درک بهتر از نحوه عملکرد حلقه کمک می‌کند.

روش‌های اجرای تکنیک Trace در حلقه‌ها

1. استفاده از console.log:
با استفاده از console.log می‌توانید مقادیر متغیرها را در هر تکرار حلقه چاپ کنید تا ببینید چه اتفاقی در حال رخ دادن است.

   for (let i = 0; i < 5; i++) {
console.log(Iteration: ${i});
}


2. استفاده از debugger:
با قرار دادن دستور debugger درون حلقه، می‌توانید اجرای کد را متوقف کرده و وضعیت متغیرها را بررسی کنید.

   for (let i = 0; i < 5; i++) {
debugger; // اجرای کد در اینجا متوقف می‌شود
console.log(Iteration: ${i});
}


3. استفاده از ابزارهای توسعه‌دهنده:
مرورگرهای مدرن ابزارهای توسعه‌دهنده‌ای دارند که به شما اجازه می‌دهند نقاط شکست (breakpoints) قرار دهید و وضعیت متغیرها را در زمان واقعی بررسی کنید.

4. نوشتن تابع کمکی:
می‌توانید تابعی بنویسید که اطلاعات مربوط به هر تکرار را ثبت کند.

   function traceIteration(i) {
console.log(Current iteration: ${i});
}

for (let i = 0; i < 5; i++) {
traceIteration(i);
}


5. استفاده از آرایه‌ها و متدهای آرایه:
اگر با آرایه‌ها کار می‌کنید، می‌توانید از متدهایی مثل forEach استفاده کنید که به شما اجازه می‌دهد بر روی هر عنصر آرایه یک تابع اعمال کنید.

   const arr = [1, 2, 3, 4, 5];

arr.forEach((item, index) => {
console.log(Index: ${index}, Item: ${item});
});


نتیجه‌گیری

تکنیک trace به شما کمک می‌کند تا به طور دقیق‌تر بفهمید که چه اتفاقی در هر مرحله از اجرای حلقه می‌افتد. این تکنیک به ویژه زمانی که با کدهای پیچیده یا اشکالات مواجه هستید، بسیار مفید است. با استفاده از روش‌های مختلف ردیابی، می‌توانید به راحتی رفتار کد خود را تحلیل کنید و مشکلات را شناسایی نمایید.
🚀 تگ <symbol> در SVG

با <symbol> می‌تونی یه بار یه شکل SVG رو تعریف کنی و هر چند بار که خواستی تو صفحه استفاده‌ش کنی، بدون تکرار کد! 😍

🛠 کاربردش چیه؟
برای ساخت آیکون‌هایی که قراره بارها استفاده بشن، عالیه. شکل رو با <symbol> تعریف می‌کنی و با <use> هر جا لازم بود، صداش می‌زنی.

باعث می‌شه کدت تمیزتر بشه، سریع‌تر رندر بشه و مصرف حافظه کم‌تر باشه.
خیلی جاها مثل کتابخونه‌های آیکون SVG (مثلاً Heroicons) ازش استفاده می‌شه.
کاملاً با CSS و جاوااسکریپت هم قابل کنترل و استایل‌دادنه.

🔗 منبع: MDN – SVG <symbol> Element
سلام دوستان 🌟

امیدوارم حال همگی خوب باشه ❤️

به خاطر یک سفر تفریحی که داشتم، نتونستم در چند روز گذشته محتوا جدیدی منتشر کنم. اما حالا با انرژی بیشتر و ایده‌های جدید برگشتم و آماده‌ام تا با شما به اشتراک بذارم

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

منتظر باشید 💻
4
چرا هوش هیجانی (EQ) برای برنامه‌نویسان حیاتی است؟ 🧠💡 

برخلاف باور رایج، موفقیت در برنامه‌نویسی فقط به ضریب هوشی (IQ) وابسته نیست! هوش هیجانی (EQ) همان چیزی است که شما را از یک کدنویس معمولی به یک توسعه‌دهنده استثنایی تبدیل میکند. 

چرا EQ در برنامه‌نویسی مهم است؟ 
• مدیریت استرس 🧘‍♂️
  پروژههای فشرده و باگهای پیچیده بخشی از زندگی برنامهنویس هستند. EQ به شما کمک میکند تحت فشار، آرام و متمرکز بمانید. 
• همکاری مؤثر 👥
  توانایی درک احساسات هم‌تیمی‌ها و ارتباط سازنده، محیط کار را بهبود میبخشد. 
• درک نیاز کاربران 🎯
  توسعهدهندگان با EQ بالا میتوانند خود را جای کاربر بگذارند و محصولاتی کاربرپسندتر بسازند. 

چگونه هوش هیجانی خود را تقویت کنیم؟ 
• خودآگاهی: احساسات و واکنشهای خود را در موقعیتهای مختلف شناسایی کنید. 
• همدلی: سعی کنید دیدگاه دیگران را بفهمید، حتی اگر با آن مخالف هستید. 
• مدیریت تعارض: به جای بحثهای بی پایان، به دنبال راه حل های سازنده باشید. 
3
فایل فیگما برای سایت رزرو بلیط مسافرتی و تور آماده شده است! ✈️🌍 این یک فرصت عالی برای طراحان وب و برنامه‌نویسان فرانت‌اند است تا مهارت‌های خود را تقویت کنند. 🎨💻

برای دانلود فایل به لینک زیر مراجعه کنید:
🔗 دانلود فایل 📥

همین حالا شروع به طراحی کنید و سفرهای جذاب را به کاربران خود معرفی کنید! 🚀🌟
1