| کانال توسعه‌دهندگان جاوااسکریپت |
3.87K subscribers
63 photos
3 videos
40 links
⭕️ کانال توسعه‌دهندگان جاوااسکریپت دولوپیکس

💠 دولوپیکس | جامعه توسعه‌دهندگان ایرانی

💎 @Developix
🚀 Developix.ir

📌 پشتیبانی و تبلیغات:
@DevelopixSupport
Download Telegram
‌‎پاک‌سازی توابع با تکنیک «Early Return» در JavaScript 🚿

یکی از ساده‌ترین و مؤثرترین تکنیک‌های Clean Code در جاوااسکریپت، استفاده از Early Return است؛ یعنی به‌جای پیچوندن منطق داخل ifهای تودرتو، در همان اول تابع، شرایط نامعتبر را سریع برگردانیم.

این تکنیک توابع را:

• کوتاه‌تر و خواناتر می‌کند ✨
• از Nested if‌های عمیق جلوگیری می‌کند
• باعث می‌شود مسیرهای خطا و edge caseها واضح‌تر دیده شوند


نمونه کد قبل از refactor (کد سخت‌خوان)
function createUser(data) {
if (data) {
if (data.email) {
if (data.password && data.password.length >= 8) {
// save to DB
return { ok: true, user: data };
} else {
return { ok: false, error: 'Weak password' };
}
} else {
return { ok: false, error: 'Email is required' };
}
} else {
return { ok: false, error: 'No data' };
}
}


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


Refactor با Early Return ✅
function createUser(data) {
if (!data) {
return { ok: false, error: 'No data' };
}

if (!data.email) {
return { ok: false, error: 'Email is required' };
}

if (!data.password || data.password.length < 8) {
return { ok: false, error: 'Weak password' };
}

// happy path
return { ok: true, user: data };
}


الان:

• هر شرط invalid در بالا «قطع» می‌شود 🔪
• مسیر اصلی (happy path) در انتها واضح و تمیز است
• اضافه‌کردن شرط جدید فقط یعنی اضافه کردن چند خط دیگر بالای happy path


نمونه در Express / Node.js 🌐
app.post('/login', async (req, res) => {
const { email, password } = req.body;

if (!email || !password) {
return res.status(400).json({ message: 'Missing credentials' });
}

const user = await findUserByEmail(email);
if (!user) {
return res.status(404).json({ message: 'User not found' });
}

const valid = await comparePassword(password, user.passwordHash);
if (!valid) {
return res.status(401).json({ message: 'Invalid password' });
}

// happy path
res.json({ token: createToken(user) });
});


هر مرحله نامعتبر به‌سرعت return می‌شود و منطق login مثل یک «چک‌لیست» خطی خوانده می‌شود.

نکته مهم 🔍

Early Return با Single Responsibility خیلی خوب جفت می‌شود؛ اگر تابع خیلی طولانی شد، علاوه بر early return، آن را به چند تابع کوچک‌تر با نام‌های خوب بشکنید.

منابع برای مطالعهٔ بیشتر:
• MDN – Control Flow
• Refactoring.Guru

این سبک نوشتن را کم‌کم در هندلرهای Express، سرویس‌های Node.js یا حتی توابع React خودتان وارد کنید؛ بعد از مدتی، خواندن و نگه‌داری کد برای خودتان و تیم‌تان به‌وضوح راحت‌تر می‌شود 🙌

🔖 #Javascript #JS #جاوااسکریپت #clean_code #early_return #javascript #nodejs #express #refactoring

👤 Developix

💎 Channel: @DevelopixJavascript
👍4❤3
یکی از ساده‌ترین تکنیک‌های Refactoring برای تمیزتر شدن کد جاوااسکریپت، استفاده از الگوی Early Return است ✨

در این الگو به‌جای اینکه یک تابع را با if تو در تو و بلاک‌های بزرگ بپیچیم، شرط‌های نامعتبر را زودتر برمی‌گردانیم و مسیر «عادی» تابع را خوانا و سرراست نگه می‌کنیم.

نمونه کد شلوغ بدون Early Return 👇
function createOrder(user, items) {
if (user) {
if (user.isActive) {
if (Array.isArray(items) && items.length > 0) {
const total = items.reduce((sum, it) => sum + it.price, 0);
if (total > 0) {
return { userId: user.id, total, status: "CREATED" };
} else {
throw new Error("Total must be positive");
}
} else {
throw new Error("Items required");
}
} else {
throw new Error("User not active");
}
} else {
throw new Error("User required");
}
}


خواندن این تابع سخت است؛ منطق اصلی بین ifهای تودرتو گم شده.

همان منطق با Early Return 🧼
function createOrder(user, items) {
if (!user) {
throw new Error("User required");
}

if (!user.isActive) {
throw new Error("User not active");
}

if (!Array.isArray(items) || items.length === 0) {
throw new Error("Items required");
}

const total = items.reduce((sum, it) => sum + it.price, 0);

if (total <= 0) {
throw new Error("Total must be positive");
}

return { userId: user.id, total, status: "CREATED" };
}


حالا:

• تمام شرط‌های نامعتبر بالا جمع شده‌اند و سریع تابع را ترک می‌کنند ✅
• «مسیر خوشحال» وسط تابع مثل یک داستان خطی و قابل‌خواندن است ✅
• دیباگ و لاگ‌گرفتن ساده‌تر شده است ✅

نکته کاربردی در پروژه‌های React / Node.js

در هندلرهای API و کنترلرهای Express هم همین الگو کمک زیادی می‌کند تا از callback hell جدید یعنی if hell فرار شود:

export const handler = async (req, res) => {
const { user } = req;

if (!user) {
return res.status(401).json({ message: "Unauthorized" });
}

if (!user.isActive) {
return res.status(403).json({ message: "Inactive user" });
}

const data = await loadDashboardData(user.id);
return res.json(data);
};


در مستندات MDN درباره return و جریان کنترل توضیحات بیشتری آمده که مطالعه‌اش دید خوبی می‌دهد.

هرجا تابعی دیدۀ می‌شود که تو در تو و سخت‌خوان است، یک بار با Early Return بازنویسی‌اش، هم برای خودتان هم برای تیم، خوانایی کد را چند درجه بالا می‌برد 🚀


🔖 #Javascript #JS #جاوااسکریپت #JavaScript #Clean_Code #Refactoring #Early_Return #Node_js #Express #Readability

👤 Developix

💎 Channel: @DevelopixJavascript
👍6❤2