پاکسازی توابع با تکنیک «Early Return» در JavaScript 🚿
یکی از سادهترین و مؤثرترین تکنیکهای Clean Code در جاوااسکریپت، استفاده از Early Return است؛ یعنی بهجای پیچوندن منطق داخل ifهای تودرتو، در همان اول تابع، شرایط نامعتبر را سریع برگردانیم.
این تکنیک توابع را:
• کوتاهتر و خواناتر میکند ✨
• از Nested ifهای عمیق جلوگیری میکند
• باعث میشود مسیرهای خطا و edge caseها واضحتر دیده شوند
نمونه کد قبل از refactor (کد سختخوان)
این تابع کارش را انجام میدهد، اما هر شرط جدیدی که اضافه شود، عمق ifها بیشتر میشود و دیباگ سختتر.
Refactor با Early Return ✅
الان:
• هر شرط invalid در بالا «قطع» میشود 🔪
• مسیر اصلی (happy path) در انتها واضح و تمیز است
• اضافهکردن شرط جدید فقط یعنی اضافه کردن چند خط دیگر بالای happy path
نمونه در Express / Node.js 🌐
هر مرحله نامعتبر بهسرعت 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
یکی از سادهترین و مؤثرترین تکنیکهای 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
قانون «یک سطح انتزاع در هر تابع» در JavaScript 🧠✨
یکی از نکات طلایی در Clean Code این است که هر تابع فقط با یک سطح انتزاع کار کند. یعنی یا درگیر جزئیات low-level باشد، یا فقط کارهای high-level را صدا بزند؛ نه هر دو را قاطی.
این قانون کمک میکند:
• خوانایی کد بالا برود 👀
• Refactor کردن سادهتر شود 🔧
• تستنویسی راحتتر شود ✅
🍂 یک مثال از کد شلوغ در Node.js / Express
این تابع هم validation انجام میدهد، هم کار دیتابیس، هم جزئیات hash، هم پاسخ HTTP. سطحهای انتزاع قاطی شدهاند.
🌱 Refactor با یک سطح انتزاع در هر تابع
حالا:
• تابع
• تابع
• route handler فقط orchestration انجام میدهد ✅
این جداسازی باعث میشود بعداً راحتتر TypeScript اضافه کنید، Unit Test بنویسید، یا منطق ساخت کاربر را در سرویس دیگری (مثلاً در یک worker) استفاده کنید.
منابع برای مطالعه بیشتر:
• Refactoring.Guru
• MDN – Learn JS
قدمبهقدم همین الگو را روی قسمتهای شلوغ پروژههای Node.js / React / Next.js خود پیاده کنید؛ هر بار که یک تابع را به یک سطح انتزاع محدود میکنید، کدتان قابلاعتمادتر و نگهداریپذیرتر میشود 🚀
🔖 #Javascript #JS #جاوااسکریپت #Clean_Code #JavaScript #Node_js #Express #Refactoring #Best_Practices
👤 Developix
💎 Channel: @DevelopixJavascript
یکی از نکات طلایی در Clean Code این است که هر تابع فقط با یک سطح انتزاع کار کند. یعنی یا درگیر جزئیات low-level باشد، یا فقط کارهای high-level را صدا بزند؛ نه هر دو را قاطی.
این قانون کمک میکند:
• خوانایی کد بالا برود 👀
• Refactor کردن سادهتر شود 🔧
• تستنویسی راحتتر شود ✅
🍂 یک مثال از کد شلوغ در Node.js / Express
app.post('/api/users', async (req, res) => {
const { email, password } = req.body;
if (!email || !password) {
return res.status(400).json({ message: 'Invalid data' });
}
if (!email.includes('@')) {
return res.status(400).json({ message: 'Invalid email' });
}
const exists = await db.collection('users').findOne({ email });
if (exists) {
return res.status(409).json({ message: 'Already exists' });
}
const hash = await bcrypt.hash(password, 10);
const user = {
email,
password: hash,
createdAt: new Date()
};
await db.collection('users').insertOne(user);
res.status(201).json({ id: user._id, email: user.email });
});این تابع هم validation انجام میدهد، هم کار دیتابیس، هم جزئیات hash، هم پاسخ HTTP. سطحهای انتزاع قاطی شدهاند.
🌱 Refactor با یک سطح انتزاع در هر تابع
const validateUserPayload = (body) => {
const { email, password } = body;
if (!email || !password) return 'Invalid data';
if (!email.includes('@')) return 'Invalid email';
return null;
};
const createUser = async ({ email, password }, db, hasher) => {
const exists = await db.collection('users').findOne({ email });
if (exists) return { error: 'Already exists' };
const passwordHash = await hasher(password);
const user = {
email,
password: passwordHash,
createdAt: new Date()
};
const result = await db.collection('users').insertOne(user);
return { id: result.insertedId, email: user.email };
};
app.post('/api/users', async (req, res) => {
const validationError = validateUserPayload(req.body);
if (validationError) {
return res.status(400).json({ message: validationError });
}
const result = await createUser(
req.body,
db,
(password) => bcrypt.hash(password, 10)
);
if (result.error) {
return res.status(409).json({ message: result.error });
}
res.status(201).json(result);
});حالا:
• تابع
validateUserPayload فقط validation است ✅• تابع
createUser فقط منطق ساخت کاربر را دارد ✅• route handler فقط orchestration انجام میدهد ✅
این جداسازی باعث میشود بعداً راحتتر TypeScript اضافه کنید، Unit Test بنویسید، یا منطق ساخت کاربر را در سرویس دیگری (مثلاً در یک worker) استفاده کنید.
منابع برای مطالعه بیشتر:
• Refactoring.Guru
• MDN – Learn JS
قدمبهقدم همین الگو را روی قسمتهای شلوغ پروژههای Node.js / React / Next.js خود پیاده کنید؛ هر بار که یک تابع را به یک سطح انتزاع محدود میکنید، کدتان قابلاعتمادتر و نگهداریپذیرتر میشود 🚀
🔖 #Javascript #JS #جاوااسکریپت #Clean_Code #JavaScript #Node_js #Express #Refactoring #Best_Practices
👤 Developix
💎 Channel: @DevelopixJavascript
👍4❤3👎3
یکی از سادهترین تکنیکهای Refactoring برای تمیزتر شدن کد جاوااسکریپت، استفاده از الگوی Early Return است ✨
در این الگو بهجای اینکه یک تابع را با if تو در تو و بلاکهای بزرگ بپیچیم، شرطهای نامعتبر را زودتر برمیگردانیم و مسیر «عادی» تابع را خوانا و سرراست نگه میکنیم.
نمونه کد شلوغ بدون Early Return 👇
خواندن این تابع سخت است؛ منطق اصلی بین ifهای تودرتو گم شده.
همان منطق با Early Return 🧼
حالا:
• تمام شرطهای نامعتبر بالا جمع شدهاند و سریع تابع را ترک میکنند ✅
• «مسیر خوشحال» وسط تابع مثل یک داستان خطی و قابلخواندن است ✅
• دیباگ و لاگگرفتن سادهتر شده است ✅
نکته کاربردی در پروژههای React / Node.js
در هندلرهای API و کنترلرهای Express هم همین الگو کمک زیادی میکند تا از callback hell جدید یعنی if hell فرار شود:
در مستندات MDN درباره return و جریان کنترل توضیحات بیشتری آمده که مطالعهاش دید خوبی میدهد.
هرجا تابعی دیدۀ میشود که تو در تو و سختخوان است، یک بار با Early Return بازنویسیاش، هم برای خودتان هم برای تیم، خوانایی کد را چند درجه بالا میبرد 🚀
🔖 #Javascript #JS #جاوااسکریپت #JavaScript #Clean_Code #Refactoring #Early_Return #Node_js #Express #Readability
👤 Developix
💎 Channel: @DevelopixJavascript
در این الگو بهجای اینکه یک تابع را با 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