Loading...
Loading...
TypeScript and JavaScript development standards for modern web and Node.js development. Covers strict TypeScript configuration, type safety patterns, ESM modules, async/await, testing with Jest/Vitest, and security best practices. Use when working with .ts, .tsx, .js, .mjs files, package.json, tsconfig.json, or when asking about TypeScript/JavaScript best practices.
npx skill4agent add kiraneswaran/engineering-skills typescript-javascriptanyeval| Aspect | TypeScript | JavaScript |
|---|---|---|
| Package Manager | | |
| Module System | ES Modules | ES Modules + |
| Linting | | |
| Formatting | Prettier | Prettier |
| Types | Strict mode | JSDoc types |
// 1. Use strict equality
if (value === 0) { } // ✅ GOOD
if (value == 0) { } // ❌ BAD
// 2. Handle Promise rejections
fetchData().catch(err => console.error(err)); // ✅ GOOD
// 3. Optional chaining and nullish coalescing
const name = user?.profile?.name ?? 'Guest'; // ✅ GOOD
// 4. Use Set/Map for lookups
const seen = new Set(); // ✅ GOOD (O(1))
const seen = []; // ❌ BAD (O(n))
// 5. Never use eval or new Function
eval(userInput); // ❌ NEVER DO THIS
// 6. Sanitize HTML
element.textContent = userInput; // ✅ GOOD
element.innerHTML = userInput; // ❌ BAD (XSS){
"compilerOptions": {
"target": "ES2022",
"module": "ESNext",
"moduleResolution": "bundler",
"strict": true,
"noImplicitAny": true,
"strictNullChecks": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noUncheckedIndexedAccess": true,
"esModuleInterop": true,
"skipLibCheck": true
}
}any// ❌ BAD - Loses all type safety
function processData(data: any): any {
return data.value;
}
// ✅ GOOD - Generic type
function processData<T>(data: T): T {
return data;
}
// ✅ GOOD - Unknown for truly unknown types
function processData(data: unknown): string {
if (typeof data === 'object' && data !== null && 'value' in data) {
return String((data as { value: unknown }).value);
}
throw new Error('Invalid data');
}type SuccessResponse = {
status: 'success';
data: { id: string; name: string };
};
type ErrorResponse = {
status: 'error';
error: { code: number; message: string };
};
type ApiResponse = SuccessResponse | ErrorResponse;
function handleResponse(response: ApiResponse): void {
if (response.status === 'success') {
console.log(response.data.id); // Type-safe
} else {
console.log(response.error.message); // Type-safe
}
}interface User {
id: string;
name: string;
email: string;
password: string;
}
type UserUpdate = Partial<User>; // All optional
type UserCredentials = Pick<User, 'email' | 'password'>;
type UserPublic = Omit<User, 'password'>; // Exclude password
type RequiredUser = Required<User>; // All required
type ReadonlyUser = Readonly<User>; // Immutable// Parallel execution
const [users, products] = await Promise.all([
fetchUsers(),
fetchProducts()
]);
// Handle partial failures
const results = await Promise.allSettled([
fetchUsers(),
fetchProducts()
]);
results.forEach(result => {
if (result.status === 'fulfilled') {
console.log(result.value);
} else {
console.error(result.reason);
}
});evalnew FunctioninnerHTMLtextContent| Type | Convention | Example |
|---|---|---|
| Functions/Variables | camelCase | |
| Classes/Interfaces | PascalCase | |
| Constants | UPPER_SNAKE_CASE | |
| Types | PascalCase | |