[웹개발] JavaScript 주요 메서드 1

문자열(String)

메서드	설명
length	문자열 길이 반환
toUpperCase()	대문자로 변환
toLowerCase()	소문자로 변환
trim()	앞뒤 공백 제거
slice(start, end)	부분 문자열 추출
substring(start, end)	부분 문자열 추출
replace("찾을값", "바꿀값")	문자열 치환
split("구분자")	문자열을 배열로 변환
includes("문자")	특정 문자 포함 여부 확인
indexOf("문자")	특정 문자 위치 반환(없으면 -1)

let text = " Hello JavaScript! ";
console.log(text.length); // 19
console.log(text.toUpperCase()); // " HELLO JAVASCRIPT! "
console.log(text.trim()); // "Hello JavaScript!"
console.log(text.slice(0, 5)); // "Hello"
console.log(text.replace("JavaScript", "JS")); // " Hello JS! "
console.log(text.split(" ")); // ["", "Hello", "JavaScript!", ""]
console.log(text.includes("JavaScript")); // true

배열(Array)

메서드	설명
length	배열 길이 반환
push(item)	배열 끝에 요소 추가
pop()	배열 끝 요소 제거
shift()	배열 첫 요소 제거
unshift(item)	배열 앞에 요소 추가
concat(arr2)	배열 합치기
join("구분자")	배열을 문자열로 변환
slice(start, end)	배열 일부 추출
splice(start, deleteCount, item)	배열 요소 추가/삭제
indexOf(item)	요소의 위치 반환
includes(item)	요소 포함 여부 확인
find(callback)	조건을 만족하는 첫 번쨰 요소 반환
filter(callback)	조건을 만족하는 모든 요소 반환
map(callback)	모든 요소를 변환한 새 배열 반환
forEach(callback)	각 요소에 함수 실행
reduce(callback, 초기값)	누적 계산 수행

let arr = [1, 2, 3, 4, 5];

console.log(arr.push(6)); // [1, 2, 3, 4, 5, 6]
console.log(arr.pop()); // 6
console.log(arr.shift()); // 1
console.log(arr.unshift(0)); // [0, 2, 3, 4, 5]
console.log(arr.slice(1, 3)); // [2, 3]
console.log(arr.concat([6, 7])); // [0, 2, 3, 4, 5, 6, 7]
console.log(arr.join("-")); // "0-2-3-4-5"

console.log(arr.find((num) => num > 3)); // 4
console.log(arr.filter((num) => num % 2 === 0)); // [2, 4]
console.log(arr.map((num) => num * 2)); // [0, 4, 6, 8, 10]
console.log(arr.reduce((acc, num) => acc + num, 0)); // 14

객체(Object)

메서드	설명
Object.keys(obj)	객체의 모든 키 배열 반환
Object.values(obj)	객체의 모든 값 배열 반환
Object.entries(obj)	[키, 값] 배열 반환
Object.assign(target, source)	객체 복사
Object.hasOwnProperty(key)	특정 키 존재 여부 확인

let user = { name: "Alice", age: 25, city: "Seoul" };

console.log(Object.keys(user)); // ["name", "age", "city"]
console.log(Object.values(user)); // ["Alice", 25, "Seoul"]
console.log(Object.entries(user)); // [["name", "Alice"], ["age", 25], ["city", "Seoul"]]

let newUser = Object.assign({}, user, { age: 30 });
console.log(newUser); // { name: "Alice", age: 30, city: "Seoul" }

console.log(user.hasOwnProperty("age")); // true

날짜(Date)

메서드	설명
new Date()	현재 날짜 & 시간 객체 생성
getFullYear()	연도 반환
getMonth()	월 반환(0부터 시작)
getDate()	일 반환
getDay()	요일 반환(0: 일요일)
getHours()	시간 반환
getMinutes()	분 반환
getSeconds()	초 반환
getTime()	1970년 1월 1일부터 경과 시간(ms) 반환

let now = new Date();
console.log(now.getFullYear()); // 2025
console.log(now.getMonth() + 1); // 4 (월은 0부터 시작)
console.log(now.getDate()); // 2
console.log(now.getDay()); // 3 (수요일)
console.log(now.getHours()); // 14

수학(Math)

메서드	설명
Math.abs(x)	절댓값
Math.ceil(x)	올림
Math.floor(x)	내림
Math.round(x)	반올림
Math.max(a, b, c)	최댓값
Math.min(a, b, c)	최솟값
Math.random()	0-1 난수 반환

console.log(Math.abs(-10)); // 10
console.log(Math.ceil(4.3)); // 5
console.log(Math.floor(4.7)); // 4
console.log(Math.round(4.5)); // 5
console.log(Math.max(1, 5, 10, 3)); // 10
console.log(Math.random()); // 0~1 사이 난수
console.log(Math.floor(Math.random() * 100)); // 0~99 사이 난수

 

JSON

메서드	설명
JSON.stringify(obj)	객체 → JSON 문자열 변환
JSON.parse(json)	JSON 문자열 → 객체 변환

let person = { name: "Alice", age: 25 };
let json = JSON.stringify(person);
console.log(json); // '{"name":"Alice","age":25}'

let parsed = JSON.parse(json);
console.log(parsed.name); // "Alice"