자바에서 자바스크립트 넘어가면서 추가적으로 알아야 할 것들

이동영·2026년 2월 6일

웹개발

목록 보기
33/37

우선 개념적으로 자바는 객체 지향 프로그래밍 언어이고, 자바스크립트는 스크립팅 언어이다.
하지만 오늘 내가 쓸 주제는 그런 기술적인 차이보다는 실제 쓰는 문법의 차이를 다루려고 한다.
아직 자바스크립트를 조금 밖에 배우지는 않았지만, 비슷한 부분이 많으면서도 새로운 부분도 많았기에 여기에 한 번 정리를 해보려고 한다.

1. =====

Java에서 객체 비교 시 ==은 주소값을, .equals()는 값을 비교한다. 반면 JavaScript에서는 '동등'과 '일치'의 개념으로 나뉜다.

  • ==(동등) : 타입이 다르면 암묵적으로 형변환을 수행한 뒤 비교한다. 1 == '1'true가 된다. 이는 예상치 못한 버그의 주범인다.
  • ===(일치) : 값과 타입을 모두 비교한다. Java의 타입 안전성을 유지하려면 반드시 ===을 사용하는 것이 관례다.

2. nullundefined

Java의 null은 참조할 객체가 없음을 의미하지만, JavaScript는 '없음'을 두 가지로 나눈다.

  • null : 값이 없음을 명시적으로 할당한 상태다. (Java의 null과 유사)
  • undefined : 변수를 선언만 하고 값을 할당하지 않았거나, 객체에 존재하지 않는 프로퍼티에 접근했을 때 엔진이 자동으로 부여하는 값이다.

서비스에서 Script 객체를 조회할 때, 데이터베이스에 해당 ID가 없다면 null을, 아직 제목(title) 속성이 정의되지 않았다면 undefined를 반환하는 식으로 구분된다.

3. ifTruthy/Falsy

Java의 if문 조건식은 반드시 boolean 타입만 올 수 있다. 하지만 JavaScript는 모든 타입을 조건식에 넣을 수 있으며, 이를 TruthyFalsy로 구분한다.

  • Falsy : false, 0, "" (빈 문자열), null, undefined, NaN.
  • Truthy : Falsy를 제외한 모든 것. (빈 배열 [], 빈 객체 {}true임에 주의해야 한다.)

이 특성을 활용하면 if (scriptContent) 만으로도 긴 null 체크나 빈 문자열 체크를 생략할 수 있어 생산성이 높다.

4. 구조 분해 할당

Java에서 객체의 필드를 꺼내려면 Getter를 사용하거나 여러 줄의 변수 선언이 필요하다. JavaScript는 이를 한 줄로 끝낸다.

// Java style
const title = script.getTitle();
const author = script.getAuthor();

// Node.js style
const { title, author, price } = script;

배열에서도 동일하게 적용되며, 스타트업의 빠른 MVP 개발 시 코드의 가독성을 비약적으로 높여준다.

5. 화살표 함수 =>

Java 8의 람다(Lambda)와 유사하다. 하지만 단순히 Syntatic Sugar를 넘어, 자신만의 this 바인딩을 갖지 않고 상위 스코프의 this를 그대로 사용한다는 특징이 있다. Node.js에서는 function 키워드보다 화살표 함수를 사용하는 것이 기본이다.

6. map

이름 때문에 혼동하기 쉽지만, JS의 map은 Java의 HashMap이 아니라 Stream.map() 해당한다.

  • 배열의 각 요소를 순회하며 새로운 형태의 배열을 반환하는 함수형 프로그래밍 도구다.
  • 서비스에서 객체 리스트를 UI용 DTO 리스트로 변환할 때 필수적으로 사용된다.
  • 참고 : Java의 HashMap 역할은 JS의 Map 객체나 일반 Object {}가 수행한다.

7. filter

Java의 Stream.filter()와 완벽히 대응된다. 조건에 맞는 요소만 걸러내어 새로운 배열을 만든다.

// 판매 중인 대본만 필터링
const onSaleScripts = scripts.filter(script => script.status === 'ON_SALE');

8. reduce

Java의 Stream.reduce()와 동일하다. 배열의 요소를 하나로 응축할 때 사용한다.

  • 예를 들어, 장바구니에 담긴 여러 물품의 총 결제 금액을 합산할 때 유용하다.
  • Java보다 문법이 간결하여 복잡한 데이터 가공 시 매우 강력하다.

9. 비동기 처리 : Promiseasync/await

Java의 CompletableFuture나 멀티스레드 기반의 Blocking I/O 방식에 익숙하다면, Node.js의 Non-blocking I/O는 패러다임의 전환을 요구한다.

  • Promise : 비동기 작업의 미래 결과를 담는 객체다. (Java의 Future와 유사)
  • async/await : 비동기 코드를 마치 동기 코드처럼 읽히게 작성할 수 있도록 돕는 문법이다.

10. constlet (그리고 var 금지)

Java의 변수 선언은 타입을 명시하지만, JavaScript는 재할당 여부에 집중한다.

  • const : Java의 final 변수와 같다. 한 번 할당하면 재할당이 불가능하다. 객체의 속성은 변경 가능하므로 주의해야 한다.
  • let : 재할당이 가능한 지역 변수다.
  • var : 호이스팅(Hoisting)과 함수 스코프 문제로 인해 현대적인 Node.js 개발에서는 사용을 엄격히 금지한다.

11. 객체 리터럴과 프로퍼티 축약

Java에서는 객체를 생성하려면 클래스 정의가 필수적이지만, JavaScript는 중괄호 {}만으로 즉석에서 객체를 생성할 수 있다.

const title = "그 해 우리는";
const author = "이나은";

// Java라면 new Script(title, author) 했겠지만...
// 프로퍼티 이름과 변수명이 같으면 아래처럼 축약 가능
const script = { title, author };

MVP를 구축할 때, 복잡한 DTO 클래스 설계 없이도 빠르게 데이터를 구조화할 수 있는 강력한 장점이다.

12. Optional Chaining (?.)

Java에서 NullPointerException을 피하기 위해 Optional.ofNullable().map().orElse()를 길게 쓰던 고통에서 해방될 수 있다.

// Java: Optional.ofNullable(script).map(Script::getAuthor).map(Author::getName).orElse(null);
const authorName = script?.author?.name;

scriptauthornull 또는 undefined이면 에러를 던지는 대신 즉시 undefined를 반환한다.

13. Spread 연산자 (...)

Java에서는 배열이나 List를 복사하거나 합치려면 Collections.addAll()을 쓰거나 Stream을 생성해 collect해야 한다. 하지만 JavaScript에서는 ... 하나로 끝난다.

  • 배열 합치기 (Concat) : Java의 Stream.concat(listA.stream(), listB.stream()) 보다 훨씬 직관적이다.
const existingScripts = ['대본1', '대본2'];
const newScripts = ['대본3', '대본4'];

// 두 배열을 합쳐 새로운 배열 생성
const allScripts = [...existingScripts, ...newScripts];
  • 객체 복사 및 속성 덮어쓰기 : 객체지향에서 '불변 객체'를 만들 때 매우 유용하다. 기존 객체를 수정하지 않고(Side-effect 방지), 특정 필드만 바뀐 새로운 객체를 생성할 수 있다.
const script = { title: '드라마켓 가이드', price: 5000 };

// 기존 script는 유지하면서 가격만 수정된 새 객체 생성
const discountedScript = { ...script, price: 3000 };
  • 배열/객체의 얕은 복사(Shallow Copy) : Java의 clone()이나 복사 생성자 대신 사용한다. 메모리 주소값을 공유하지 않는 새로운 인스턴스를 즉시 생성하므로, 스타트업의 빠른 로직 구현에서 데이터 오염을 방지하는 핵심 도구다.

14. 템플릿 문자열(`)

백틱(`) 내에 ${변수} 형식으로 변수를 더하기 기호 없이 문자열에 넣을 수 있다. 게다가 기존 따옴표 대신 백틱을 사용하므로 큰따옴표나 작은따옴표와 함께 사용할 수도 있다.

0개의 댓글