STUDY/JavaScript

[JavaScript] 핵심 문법 요약

1juyoung 2025. 6. 23. 17:04

자바스크립트 핵심 문법 요약 정리

자바스크립트를 학습하거나 코딩 테스트 준비 중 자주 사용하는 문법과 내장 객체들을 요약 정리하였다.

Math 객체 주요 메서드

메서드 설명
Math.abs(x) 절대값 반환
Math.ceil(x) 올림 처리
Math.floor(x) 내림 처리
Math.round(x) 반올림 처리
Math.trunc(x) 소수점 이하 버림
Math.pow(a, b) a의 b 제곱 (a^b)

 

비트 연산자 헷갈리는 개념 위주

자바스크립트에서는 정수에 대해 비트 연산을 지원한다.

  • a << n: a를 왼쪽으로 n비트 이동 (2ⁿ 곱한 것과 동일)
  • a >> n: a를 오른쪽으로 n비트 이동 (2ⁿ으로 나눈 것과 동일)
13 & 4   // AND: 4
13 | 4   // OR: 13

 

논리 연산자 정리

13 && 4  // 앞이 true면 뒤 값 반환 → 결과: 4
13 || 4  // 앞이 true면 앞 값 반환 → 결과: 13

 

논리 연산자는 불리언뿐 아니라 값 자체를 반환하기 때문에 조건문 대체로도 사용된다.

 

부동소수점 오차와 EPSILON

자바스크립트는 실수를 정확히 표현하지 못하는 경우가 있다.

0.1 + 0.2 === 0.3  // false

 

이러한 오차를 처리하기 위해 Number.EPSILON을 활용할 수 있다.

let a = 0.1 + 0.1 + 0.1;
let b = 0.3;

if (Math.abs(a - b) < Number.EPSILON) {
  console.log("같은 값");
} else {
  console.log("다른 값");
}

 

문자열 관련 메서드

메서드 설명
.length 문자열 길이
.split(',') 문자열을 구분자로 분할
.startsWith('x') 특정 문자로 시작하는지 확인
.endsWith('x') 특정 문자로 끝나는지 확인
.includes('x') 특정 문자가 포함됐는지 확인
.indexOf('x') 첫 등장 위치 반환
.lastIndexOf('x') 마지막 등장 위치 반환
.replace(a, b) a를 b로 대체
.toUpperCase() / .toLowerCase() 대/소문자 변환
.trim() 양쪽 공백 제거
.concat(x) 문자열 연결

 

BigInt 타입

  • 123n 혹은 BigInt(123) 형태로 선언
  • BigInt와 Number는 혼합 연산이 불가능 (TypeError 발생)

 

참조 타입과 원시 타입의 차이

원시 타입

값 자체를 복사해서 저장함. 값 변경 시 새로운 메모리에 저장된다.

let a = 100;
let b = a;   // b는 a의 복사본
b = 200;     // a는 여전히 100

참조 타입

메모리 주소를 저장하며, 같은 주소를 참조하면 값이 같이 바뀐다.

let arr1 = [1, 2];
let arr2 = arr1;

arr1[0] = 3;
console.log(arr2[0]); // 3

 

 

객체 접근 및 삭제

const obj = { name: '홍길동', 'nick!': '길동이' };

obj.name      // '홍길동'
obj['nick!']  // '길동이'

delete obj.name  // name 속성 제거

 

배열 메서드처럼 .push(), .pop()을 객체에 쓰는 건 잘못된 예시이므로 배열에만 사용해야 함.

 

구조 분해 할당

배열 구조 분해

const arr = ['a', 'b', 'c'];
const [x, y] = arr;
console.log(x, y); // a b

객체 구조 분해

const obj = { name: '홍길동', publisher: '골든래빗' };
const { name, publisher } = obj;

// 다른 변수명으로 받기
const { name: author } = obj;

 

 

스프레드 연산자

배열 또는 객체를 펼쳐 병합하거나 복사할 수 있다.

const a = [1, 2];
const b = [...a, 3]; // [1, 2, 3]

const o1 = { name: 'a' };
const o2 = { ...o1, age: 10 }; // age로 덮어쓰기 가능

중복 제거

const names = ['a', 'b', 'a'];
const unique = [...new Set(names)]; // ['a', 'b']

 

논리 연산자를 조건문처럼 사용하기

const flag = true;
flag && console.log('실행됨');

const makeCompany = (showAddress) => ({
  name: '홍길동',
  ...(showAddress && { address: 'Seoul' })
});

 

 

자주 사용하는 연산과 메서드는 반복적으로 손에 익히는 것이 중요하다.

특히 부동소수점 오차, 참조 타입과 원시 타입의 차이, 구조 분해 할당과 스프레드 연산자는 실무와 테스트 모두에서 자주 활용된다.

코딩테스트 ... 부숴봅시다! 😎 @__@

'STUDY > JavaScript' 카테고리의 다른 글

[JavaScript] 자바스크립트 내장 함수  (1) 2025.06.27