JavaScript는 전 세계에서 가장 널리 사용되는 프로그래밍 언어 중 하나로, 클라이언트 측과 서버 측 모두에서 활용됩니다. 유연하고 동적이며 끊임없이 발전하는 언어입니다. 하지만 JavaScript로 코드를 작성하는 일은 결코 단순하지 않습니다. JavaScript는 중괄호로 블록을 구분하고 Python은 들여쓰기로 구분합니다. 또한 Java가 정적 타입 언어인 것과 달리 JavaScript는 동적 타입 언어입니다. 비교적 관대하면서도 작은 함정이 많습니다. 세미콜론을 빠뜨리거나, 불필요한 쉼표를 넣거나, 중괄호를 닫지 않으면 프로그램 전체가 멈출 수 있습니다. 하루에 몇 시간씩 키보드 앞에 앉아 있는 개발자에게 정확성은 필수적입니다. 타자 연습에서는 키보드를 보지 않고 코드를 정확하게 입력하는 방법을 익힙니다. 매번 키를 찾는 데 주의를 빼앗기지 않으면 입력하면서 코드의 로직을 살펴보기 수월해집니다.

동적 타입과 변수 선언

JavaScript는 동적 타입 언어로, 변수에 어떤 값이든 담을 수 있고 실행 중에 타입이 바뀔 수도 있습니다. 이러한 유연성은 배우기 쉽다는 장점이 있지만, 동시에 오류의 원인이 되기도 합니다. 새 변수를 선언할 때는 일반적으로 let과 const를 사용하며, 둘 다 블록 스코프를 가집니다. let으로 선언한 변수에는 새 값을 할당할 수 있지만 const로 선언한 변수에는 재할당할 수 없습니다. var도 여전히 유효하며 함수, 스크립트 또는 모듈 스코프를 가집니다. 작은 오타나 잘못된 선택이 찾기 어려운 버그로 이어질 수 있습니다. 타자 연습에서는 const와 let을 정확히 입력하는 연습도 할 수 있습니다. 어떤 키워드를 사용할지는 프로그램에서 변수를 어떻게 사용할지에 따라 결정합니다.

// 변경될 수 있는 변수에는 let 사용
let counter = 0;
counter++;

// 상수에는 const 사용
const PI = 3.14159;

// var는 현대 코드에서 피해야 함
var legacy = "구식 스타일";

세미콜론과 자동 삽입

JavaScript의 가장 논란이 많은 특징 중 하나는 세미콜론 자동 삽입입니다. 많은 문장이 세미콜론 없이도 작성될 수 있지만, 생략하면 예상치 못한 오류가 발생할 수 있습니다. 대표적인 예는 return 뒤에 값을 다음 줄에 작성할 때인데, JavaScript는 이를 return;으로 해석합니다. 반환할 표현식은 return과 같은 줄에서 시작해야 하며, 세미콜론을 추가하는 것만으로는 이 문제를 해결할 수 없습니다. 세미콜론을 명시하는 스타일도 생략하는 스타일도 있으므로 프로젝트의 규칙을 따르세요. 타자 연습을 통해 이 반복적인 작은 동작도 자연스럽게 습관화됩니다.

// 위험: undefined 반환
function bad() {
  return
  {
    name: "철수"
  };
}

// 올바름: 세미콜론으로 값이 반환됨
function good() {
  return {
    name: "철수"
  };
}

객체와 JSON

JavaScript는 객체 중심 언어입니다. 객체 리터럴에는 중괄호 {}, 콜론 :, 쉼표 ,가 정확한 위치에 있어야 합니다. JavaScript 객체 문법을 기반으로 하는 JSON은 엄격하여, 쉼표 하나만 잘못 들어가도 파일 전체가 무효가 됩니다. 타자 연습을 통해 이러한 기호 입력을 자동화하면 데이터 구조 자체에 집중할 수 있습니다.

// 객체 리터럴
const user = {
  id: 1,
  name: "철수",
  active: true
};

함수: 선언, 표현식, 화살표 함수

JavaScript에서는 함수를 여러 가지 방식으로 정의할 수 있습니다. 고전적인 선언, 익명 함수 표현식, 화살표 함수 등이 있습니다. 화살표 함수는 =>를 사용하는데, 이 입력은 쉽게 실수할 수 있습니다. 초보자는 괄호를 빼먹거나 화살표를 잘못 배치하곤 합니다. 타자 연습을 통해 이 패턴을 습관화할 수 있습니다. 또한 JavaScript는 기본 매개변수, rest 매개변수 (...args), 매개변수 구조 분해도 지원합니다. 언어가 표현력이 풍부해지는 만큼 입력 정확성도 요구됩니다.

// 고전적인 함수
function greet(name) {
  return "안녕하세요 " + name;
}

// 화살표 함수
const greetArrow = (name) => "안녕하세요 " + name;

// 기본 매개변수와 rest 매개변수
function log(message = "Info", ...args) {
  console.log(message, args);
}

클로저와 콜백

JavaScript의 특징 중 하나는 클로저입니다. 함수는 외부 스코프의 변수를 "캡처"할 수 있습니다. 이는 강력한 기능이지만, 루프나 비동기 코드에서는 오류의 원인이 되기도 합니다. 콜백을 작성하다 보면 중괄호와 괄호가 많아지게 됩니다. 타자 연습을 통해 이러한 반복 구조도 원활하고 정확하게 입력할 수 있습니다.

// 변수를 캡처하는 클로저
function makeCounter() {
  let count = 0;
  return function() {
    count++;
    return count;
  };
}

const counter = makeCounter();
console.log(counter()); // 1
console.log(counter()); // 2

비동기 코드: 콜백, Promise, async/await

JavaScript는 비동기 작업을 지원합니다. 콜백, Promise, async/await를 사용해 이러한 작업을 처리할 수 있습니다. 각각 입력할 때의 특성이 있습니다. 콜백은 중괄호가 많고, Promise는 .then() 체인이나 await로 처리할 수 있으며, async/await는 새로운 키워드를 사용합니다. 타자 연습을 꾸준히 하면 try { ... } catch(e) { ... }나 await fetch(...) 같은 반복 패턴도 빠르고 정확하게 입력할 수 있습니다.

// Promise 사용 예시
fetch("/api/data")
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(err => console.error(err));

// async/await 사용 예시
async function loadData() {
  try {
    const response = await fetch("/api/data");
    const data = await response.json();
    console.log(data);
  } catch (err) {
    console.error(err);
  }
}

스타일과 코딩 규칙

Python에서 "pythonic"이라는 개념이 있듯이, JavaScript에서는 Airbnb, StandardJS, Google과 같은 스타일 가이드가 자주 논의됩니다. 들여쓰기(스페이스 2개 또는 4개), 세미콜론 사용, 명명 규칙(변수는 camelCase, 클래스는 PascalCase), 줄 길이 등이 다뤄집니다. ESLint나 Prettier 같은 도구는 설정에 따라 코드 스타일을 검사하거나 서식을 정리할 수 있습니다. 타자 연습을 통해 화살표 함수, 메서드 체인 등 반복적인 패턴을 입력할 때도 규칙을 자연스럽게 지킬 수 있습니다.

자주 발생하는 구문 오류

JavaScript에서 자주 발생하는 오류에는 템플릿 문자열에서 backtick을 닫지 않는 것, 작은따옴표와 큰따옴표를 혼동하는 것, 괄호를 닫지 않는 것 등이 있습니다. 보간을 포함한 템플릿 문자열 ${...}은 강력하지만, backtick, 달러 기호, 중괄호라는 정확한 순서가 필요합니다. 타자 연습을 통해 이러한 입력도 자연스럽게 습득할 수 있습니다.

// 보간을 사용하는 템플릿 문자열
const name = "철수";
console.log(`안녕하세요, ${name}!`);

클래스와 객체지향 프로그래밍

ES6 이전의 JavaScript는 프로토타입을 사용했습니다. 현재는 클래스 문법이 도입되었지만, 내부적으로는 여전히 프로토타입이 동작합니다. constructor 메서드는 인스턴스를 초기화하지만 직접 정의하지 않아도 됩니다. 파생 클래스에서 생성자를 직접 정의할 때는 super로 부모 클래스의 생성자를 호출합니다. 메서드는 function 키워드 없이 정의합니다. this를 빠뜨리거나 중괄호를 잘못 배치하는 것은 흔한 실수입니다. 타자 연습을 통해 이러한 반복 구조도 더 정확하게 입력할 수 있습니다. Java와 마찬가지로 JavaScript에서도 클래스 이름은 PascalCase로 작성하는 것이 일반적이며, 일관성이 요구됩니다.

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() {
    console.log(`${this.name} 소리를 냅니다.`);
  }
}

class Dog extends Animal {
  speak() {
    console.log(`${this.name} 짖습니다.`);
  }
}

모듈과 import

현대 JavaScript는 import와 export를 사용하는 ES 모듈을 채택합니다. 종종 긴 경로나 중괄호가 포함됩니다. 예를 들어 import { readFile, writeFile } from "fs";와 같은 문장을 정확하게 입력하는 것은 쉽지 않습니다. 타자 연습을 통해 중괄호와 따옴표 입력이 자연스러워집니다.

import { readFile, writeFile } from "fs";
import express from "express";

정리

JavaScript는 동적이고 유연하며 표현력이 풍부한 언어입니다. 문법에는 중괄호, 대괄호, 콜론, 쉼표, 세미콜론, backtick 등 다양한 기호가 포함되어 있어 정확한 입력은 끊임없는 도전입니다. Java와 마찬가지로 JavaScript도 대소문자를 구분하며, 문법에 필요한 기호가 빠지면 프로그램이 실행되지 않을 수 있습니다. Python처럼 들여쓰기를 강제하지는 않지만, 커뮤니티는 일관된 포맷을 기대합니다. 타자 연습을 통해 개발자는 이러한 요구를 더 잘 충족할 수 있습니다. 오류를 줄이고, 화살표 함수나 import 문과 같은 반복적인 패턴을 더 빨리 작성하며, 프로그램 설계에 집중할 수 있습니다. 매일 JavaScript를 작성한다면 타자 연습으로 코드를 정확하게 입력하는 능력을 기를 수 있습니다. 프로그램이 올바르게 동작하려면 코드의 로직을 이해하고 실제 동작도 확인해야 합니다.