通用编码标准、最佳实践和模式,适用于TypeScript、JavaScript、React和Node.js开发。
技能概述
coding-standards 技能提供了适用于所有项目的通用编码标准和最佳实践指南。该技能强调代码质量原则,包括可读性优先、KISS(保持简单)、DRY(不要重复自己)和YAGNI(你不会需要它)等核心理念,帮助开发者编写清晰、可维护的代码。
下载地址:https://github.com/affaan-m/everything-claude-code/tree/main/skills
主要功能
- 代码质量原则: 可读性优先、KISS、DRY、YAGNI等核心原则
- 命名规范: 变量、函数、组件的命名最佳实践
- 不可变性模式: 使用展开运算符避免直接变异
- 错误处理: 全面的错误处理和异常管理
- 异步编程: Async/Await最佳实践和并行执行优化
- 类型安全: TypeScript类型定义和类型检查
- React最佳实践: 组件结构、自定义Hook、状态管理
触发条件
在以下情况下应该调用此技能:
- 编写新的代码或功能模块
- 重构现有代码以提高质量
- 进行代码审查和质量检查
- 设计组件和函数接口
- 处理异步操作和错误处理
- 定义TypeScript类型和接口
使用场景
场景1: 新项目初始化
当开始新项目时,使用此技能建立统一的编码规范和最佳实践标准。
场景2: 代码审查
在进行代码审查时,参照此技能的标准检查代码质量和规范性。
场景3: 重构优化
当重构代码时,使用此技能的原则指导重构方向,提高代码可维护性。
处理过程
1. 应用代码质量原则
遵循可读性优先原则,编写自文档化的代码,避免过度工程化。
2. 遵循命名规范
使用描述性的变量和函数名称,采用动词-名词模式命名函数。
// ✅ GOOD: 描述性名称
const marketSearchQuery = 'election';
const isUserAuthenticated = true;
const totalRevenue = 1000;// ❌ BAD: 不清晰的名称
const q = 'election';
const flag = true;
const x = 1000;
3. 实现不可变性
使用展开运算符创建新对象,避免直接变异。
4. 错误处理
实现全面的错误处理,包括try-catch、错误日志和用户友好的错误消息。
5. 异步优化
使用Promise.all并行执行独立的异步操作,提高性能。
输入要求
使用此技能时,用户需要提供:
- 项目使用的编程语言和框架
- 需要审查或优化的代码片段
- 项目的编码规范要求(如果有)
- 性能和可维护性目标
输出说明
技能将提供:
- 符合规范的代码示例
- 代码质量改进建议
- 命名规范指导
- 错误处理模式
- 异步编程最佳实践
- TypeScript类型定义示例
使用示例
示例1: 不可变性模式
// ✅ ALWAYS use spread operator
const updatedUser = { ...user, name: 'New Name' };
const updatedArray = [...items, newItem];// ❌ NEVER mutate directly
user.name = 'New Name'; // BAD
items.push(newItem); // BAD
示例2: 错误处理
async function fetchData(url: string) {
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
}
return await response.json();
} catch (error) {
console.error('Fetch failed:', error);
throw new Error('Failed to fetch data');
}
}
示例3: 异步并行执行
// ✅ GOOD: 并行执行
const [users, markets, stats] = await Promise.all([
fetchUsers(),
fetchMarkets(),
fetchStats()
]);// ❌ BAD: 不必要的顺序执行
const users = await fetchUsers();
const markets = await fetchMarkets();
const stats = await fetchStats();
示例4: React组件结构
interface ButtonProps {
children: React.ReactNode;
onClick: () => void;
disabled?: boolean;
variant?: 'primary' | 'secondary';
}export function Button({
children,
onClick,
disabled = false,
variant = 'primary'
}: ButtonProps) {
return (
<button
onClick={onClick}
disabled={disabled}
className={`btn btn-${variant}`}
>
{children}
</button>
);
}
最佳实践
- 可读性优先: 代码被阅读的次数远多于被编写的次数
- 保持简单: 选择最简单有效的解决方案,避免过度设计
- 不要重复: 提取通用逻辑到函数和组件中
- 避免过早优化: 只在需要时添加复杂性
- 使用类型: 避免使用any,定义明确的类型和接口
- 处理错误: 实现全面的错误处理和日志记录
- 并行执行: 对独立的异步操作使用Promise.all
核心原则详解
- 可读性优先: 代码被阅读的次数远多于被编写的次数,清晰的命名和结构比聪明的代码更重要
- KISS原则: 保持简单,选择最简单有效的解决方案,避免过度工程化和过早优化
- DRY原则: 不要重复自己,提取通用逻辑到函数和组件,避免复制粘贴编程
- YAGNI原则: 你不会需要它,不要构建尚未需要的功能,从简单开始,需要时再重构
