[Javascript]자바스크립트 완벽 가이드: 모든 내장 함수 총정리!

자바스크립트는 웹 개발에서 가장 많이 사용되는 언어 중 하나입니다. 그중에서도 내장 함수는 개발자들이 코드를 더 효율적으로 작성할 수 있게 도와줍니다. 이 글에서는 자바스크립트의 모든 내장 함수를 체계적으로 정리하여 소개하겠습니다.

≣ 목차

• 자바스크립트 내장 함수란?🤔
• 문자열(String) 관련 함수📝
• 배열(Array) 관련 함수🛒
• 숫자(Number) 관련 함수🔢
• 객체(Object) 관련 함수🎨
• 날짜(Date) 관련 함수📆
• 함수(Function) 관련 함수⭐
• 유틸리티(Utility) 함수🔧

---

01. 자바스크립트 내장 함수란?🤔

내장 함수의 개념과 역할 

내장 함수는 자바스크립트에서 기본적으로 제공하는 함수들로, 별도의 정의 없이 바로 사용할 수 있습니다. 이러한 함수들은 개발자의 생산성을 높여주며, 복잡한 작업을 쉽게 수행할 수 있게 합니다.

내장 함수를 사용하는 이유와 장점 

내장 함수는 코드의 가독성을 높이고, 표준화된 방법으로 특정 작업을 수행할 수 있게 해 줍니다. 이를 통해 개발자는 코드 작성 시간을 줄이고, 보다 안정적인 코드를 작성할 수 있습니다.

---

02. 문자열(String) 관련 함수📝

• charAt(): 문자열에서 특정 위치에 있는 문자를 반환

let str = "Hello";
console.log(str.charAt(1)); // "e"

• concat(): 두 개 이상의 문자열을 결합

let str1 = "Hello";
let str2 = "World";
console.log(str1.concat(" ", str2)); // "Hello World"

• includes(): 문자열에 특정 문자열이 포함되어 있는지 확인

let str = "Hello World";
console.log(str.includes("World")); // true

• indexOf(): 문자열에서 특정 문자열의 첫 번째 위치를 반환

let str = "Hello World";
console.log(str.indexOf("World")); // 6

• slice(): 문자열의 일부분을 반환

let str = "Hello World";
console.log(str.slice(0, 5)); // "Hello"

• split(): 문자열을 배열로 분할

let str = "Hello World";
console.log(str.split(" ")); // ["Hello", "World"]

• toLowerCase(): 문자열을 소문자로 변환

let str = "Hello World";
console.log(str.toLowerCase()); // "hello world"

• toUpperCase(): 문자열을 대문자로 변환

let str = "Hello World";
console.log(str.toUpperCase()); // "HELLO WORLD"

• padStart(): 문자열의 시작을 다른 문자열로 채워, 주어진 길이를 만족하는 새로운 문자열을 반환

let str = "5";
console.log(str.padStart(2, "0")); // "05"

• padEnd(): 문자열의 끝을 다른 문자열로 채워, 주어진 길이를 만족하는 새로운 문자열을 반환

let str = "5";
console.log(str.padEnd(2, "0")); // "50"

• length: 문자열의 길이를 반환

let str = "Hello";
console.log(str.length); // 5

---

03. 배열(Array) 관련 함수🛒

• concat(): 두 개 이상의 배열을 결합

let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
console.log(arr1.concat(arr2)); // [1, 2, 3, 4, 5, 6]

• every(): 배열의 모든 요소가 주어진 조건을 만족하는지 확인

let arr = [1, 2, 3, 4, 5];
console.log(arr.every(num => num > 0)); // true

• filter(): 주어진 조건을 만족하는 모든 요소를 새로운 배열로 반환

let arr = [1, 2, 3, 4, 5];
console.log(arr.filter(num => num > 3)); // [4, 5]

• forEach(): 배열의 각 요소에 대해 주어진 함수를 실행

let arr = [1, 2, 3];
arr.forEach(num => console.log(num * 2)); // 2, 4, 6

• indexOf(): 배열에서 특정 요소의 첫 번째 위치를 반환

let arr = [1, 2, 3, 4, 5];
console.log(arr.indexOf(3)); // 2

• join(): 배열의 모든 요소를 문자열로 결합

let arr = ["Hello", "World"];
console.log(arr.join(" ")); // "Hello World"

• map(): 배열의 각 요소에 주어진 함수를 적용한 결과를 새로운 배열로 반환

let arr = [1, 2, 3];
console.log(arr.map(num => num * 2)); // [2, 4, 6]

• reduce(): 배열의 모든 요소를 하나의 값으로 결합

let arr = [1, 2, 3, 4, 5];
console.log(arr.reduce((sum, num) => sum + num)); // 15

• sort(): 배열의 요소를 정렬

let arr = [5, 3, 8, 1];
console.log(arr.sort((a, b) => a - b)); // [1, 3, 5, 8]

---

04. 숫자(Number) 관련 함수🔢

• toFixed(): 소수점 자리수를 지정하여 문자열로 변환

let num = 5.56789;
console.log(num.toFixed(2)); // "5.57"

• toPrecision(): 전체 자릿수를 지정하여 문자열로 변환

let num = 5.56789;
console.log(num.toPrecision(3)); // "5.57"

• toString(): 숫자를 문자열로 변환

let num = 255;
console.log(num.toString(16)); // "ff" (16진수)

• valueOf(): 객체의 원시 값을 반환

let num = new Number(123);
console.log(num.valueOf()); // 123

• isNaN(): 값이 NaN인지 여부를 확인

console.log(isNaN("Hello")); // true
console.log(isNaN(123)); // false

• isFinite(): 값이 유한한 숫자인지 여부를 확인

console.log(isFinite(10)); // true
console.log(isFinite(Infinity)); // false

• parseInt(): 문자열을 정수로 변환

console.log(parseInt("10")); // 10
console.log(parseInt("10.5")); // 10

• parseFloat(): 문자열을 부동 소수점 숫자로 변환

console.log(parseFloat("10.5")); // 10.5
console.log(parseFloat("10")); // 10

• Number.isInteger(): 값이 정수인지 여부를 확인

console.log(Number.isInteger(10)); // true
console.log(Number.isInteger(10.5)); // false

• Number.isSafeInteger(): 값이 안전한 정수인지 여부를 확인

console.log(Number.isSafeInteger(10)); // true
console.log(Number.isSafeInteger(Math.pow(2, 53))); // false

• Math.round(): 숫자를 반올림

let num = 5.56789;
console.log(Math.round(num)); // 6

• Math.floor(): 숫자를 내림

let num = 5.56789;
console.log(Math.floor(num)); // 5

• Math.ceil(): 숫자를 올림

let num = 5.56789;
console.log(Math.ceil(num)); // 6

• Math.trunc(): 소수점을 버림

let num = 5.56789;
console.log(Math.trunc(num)); // 5

• Math.random(): 0 이상 1 미만의 난수를 반환

console.log(Math.random()); // 0.123456789 (예시)

---

05. 객체(Object) 관련 함수🎨

• assign(): 하나 이상의 출처 객체로부터 대상 객체로 속성을 복사

let target = { a: 1 };
let source = { b: 2 };
let returnedTarget = Object.assign(target, source);
console.log(returnedTarget); // { a: 1, b: 2 }

• create(): 지정된 프로토타입 객체와 속성으로 새로운 객체를 생성

let person = {
  isHuman: false,
  printIntroduction: function() {
    console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
  }
};
let me = Object.create(person);
me.name = "Matthew";
me.isHuman = true;
me.printIntroduction(); // "My name is Matthew. Am I human? true"

• keys(): 객체의 열거 가능한 속성 이름을 배열로 반환

let obj = { a: 1, b: 2, c: 3 };
console.log(Object.keys(obj)); // ["a", "b", "c"]

• values(): 객체의 열거 가능한 속성 값을 배열로 반환

let obj = { a: 1, b: 2, c: 3 };
console.log(Object.values(obj)); // [1, 2, 3]

• entries(): 객체의 열거 가능한 속성 [key, value] 쌍을 배열로 반환

let obj = { a: 1, b: 2, c: 3 };
console.log(Object.entries(obj)); // [["a", 1], ["b", 2], ["c", 3]]

---

06. 날짜(Date) 관련 함수📆

• getDate(): 날짜의 일을 반환

let date = new Date();
console.log(date.getDate()); // 15 (예시)

• getDay(): 날짜의 요일을 반환

let date = new Date();
console.log(date.getDay()); // 3 (수요일, 예시)

• getFullYear(): 날짜의 연도를 반환

let date = new Date();
console.log(date.getFullYear()); // 2024 (예시)

• getMonth(): 날짜의 월을 반환 (0부터 시작)

let date = new Date();
console.log(date.getMonth()); // 6 (7월, 예시)

• getTime(): 1970년 1월 1일 00:00:00 UTC 이후의 밀리초를 반환

let date = new Date();
console.log(date.getTime()); // 1625678400000 (예시)

• setDate(): 날짜의 일을 설정

let date = new Date();
date.setDate(1);
console.log(date); // 새로운 날짜 객체 (예시)

• setFullYear(): 날짜의 연도를 설정

let date = new Date();
date.setFullYear(2025);
console.log(date); // 새로운 날짜 객체 (예시)

---

07. 함수(Function) 관련 함수⭐

• apply(): 주어진 this 값과 배열로 제공된 인수로 함수를 호출

function sum(a, b) {
  return a + b;
}
console.log(sum.apply(null, [1, 2])); // 3

• bind(): 새로운 함수를 생성하고 주어진 this 값 및 인수로 함수를 호출

let module = {
  x: 42,
  getX: function() {
    return this.x;
  }
};
let unboundGetX = module.getX;
let boundGetX = unboundGetX.bind(module);
console.log(boundGetX()); // 42

• call(): 주어진 this 값과 인수로 함수를 호출

function greet() {
  console.log(`Hello, my name is ${this.name}`);
}
let person = { name: "John" };
greet.call(person); // "Hello, my name is John"

• toString(): 함수를 문자열로 변환

function sum(a, b) {
  return a + b;
}
console.log(sum.toString()); // "function sum(a, b) { return a + b; }"

---

08. 유틸리티(Utility) 함수🔧

• alert(): 경고 대화 상자를 표시

alert("Hello, world!");

• console.log(): 콘솔에 메시지를 출력

console.log("Hello, world!");

• setTimeout(): 일정 시간 후에 함수를 실행

setTimeout(() => {
  console.log("3초 후에 실행됩니다.");
}, 3000);

• setInterval(): 일정 시간 간격으로 함수를 반복 실행

setInterval(() => {
  console.log("1초마다 실행됩니다.");
}, 1000);