JavaScript Development
Write modern, clean JavaScript and TypeScript.
When to Use
Writing JavaScript/TypeScript code
Async debugging and optimization
Node.js development
Browser compatibility issues
Module system questions
Modern JavaScript Patterns
Async/Await
// Prefer async/await over promise chains
async
function
fetchData
(
)
{
try
{
const
response
=
await
fetch
(
url
)
;
if
(
!
response
.
ok
)
throw
new
Error
(
HTTP
${
response
.
status
}
)
;
return
await
response
.
json
(
)
;
}
catch
(
error
)
{
console
.
error
(
"Fetch failed:"
,
error
)
;
throw
error
;
}
}
// Parallel execution
const
[
users
,
posts
]
=
await
Promise
.
all
(
[
fetchUsers
(
)
,
fetchPosts
(
)
]
)
;
// Error handling for multiple promises
const
results
=
await
Promise
.
allSettled
(
[
task1
(
)
,
task2
(
)
,
task3
(
)
]
)
;
const
succeeded
=
results
.
filter
(
(
r
)
=>
r
.
status
===
"fulfilled"
)
;
Destructuring and Spread
// Object destructuring with defaults
const
{
name
,
age
=
0
,
...
rest
}
=
user
;
// Array methods
const
active
=
users
.
filter
(
(
u
)
=>
u
.
active
)
.
map
(
(
u
)
=>
u
.
name
)
;
// Object spread for immutable updates
const
updated
=
{
...
user
,
name
:
"New Name"
}
;
Classes and Modules
// ES modules
export
class
UserService
{
privateField
; // Private field constructor ( config ) { this .
privateField
= config . secret ; } async getUser ( id ) { return await this .
fetch
(
/users/
${
id
}
)
;
}
}
// Named and default exports
export
{
UserService
}
;
export
default
UserService
;
TypeScript Patterns
// Interfaces over types for objects
interface
User
{
id
:
string
;
name
:
string
;
email
?
:
string
;
}
// Generics
function
first
<
T
( arr : T [ ] ) : T | undefined { return arr [ 0 ] ; } // Utility types type CreateUser = Omit < User , "id"
; type ReadonlyUser = Readonly < User
; Node.js Patterns // ESM in Node.js import { readFile } from "fs/promises" ; import { fileURLToPath } from "url" ; const __dirname = fileURLToPath ( new URL ( "." , import . meta . url ) ) ; // Streams for large files import { createReadStream , createWriteStream } from "fs" ; import { pipeline } from "stream/promises" ; await pipeline ( createReadStream ( "input" ) , transform , createWriteStream ( "output" ) , ) ; Common Gotchas this binding (use arrow functions or .bind()) Floating promises (always await or handle) == vs === (always use ===) Array mutation (map/filter return new arrays, sort mutates) Examples Input: "Fix async issue" Action: Check for unhandled promises, race conditions, proper error handling Input: "Convert to TypeScript" Action: Add types, interfaces, fix type errors, configure tsconfig