JavaScript(6)-1

Minji Lee·2023년 10월 12일
0

javascript

목록 보기
6/11
post-thumbnail

Ch06 표준 내장 객체

문자(String)

.length

문자의 길이(숫자) 반환

const str = "Hello world!";
//           012345678901

console.log(str.length); // 12

.includes()

대상 문자에 주어진 문자가 포함되어 있는지(불린) 확인

  • 대소문자 구분함
  • 두번째 인자로 시작위치를 지정할 수 있음 → 지정한 위치부터 확인
const str = "Hello world!";
console.log(str.includes("Hello")); // true
console.log(str.includes("Hello", 0)); // true
console.log(str.includes("Hello", 1)); // false

.indexOf()

대상 문자에서 주어진 문자와 일치하는 첫 번째 인덱스(숫자)를 반환

  • 일치하는 문자가 없으면 -1을 반환 → 문자가 포함되어 있는지 확인할 때 사용가능
const str = "Hello world!";

console.log(str.indexOf("world")); // 6
console.log(str.indexOf("HEROPY")); // -1

if (str.indexOf("HEROPY") === -1) {
  console.log("HEROPY가 없습니다.");
}

.padEnd()

대상 문자의 길이(length)가 지정된 길이보다 작으면, 주어진 문자를 지정된 길이까지 끝에 붙여 새로운 문자를 반환

  • 주어진 대상 문자가 지정된 길이보다 긴 경우 그대로 반환
  • 원본의 데이터는 손상되지 않음
const str = "1234567";
console.log(str.padEnd(10, "0")); // 1234567000

.padStart()

대상 문자의 길이(length)가 지정된 길이보다 작으면, 주어진 문자를 지정된 길이까지 앞에 붙여 새로운 문자를 반환

  • 주어진 대상 문자가 지정된 길이보다 긴 경우 그대로 반환
  • 원본의 데이터는 손상되지 않음
const str = "1234567";
console.log(str.padStart(10, "0")); // 0001234567

.replace()

대상 문자에서 패턴(문자, 정규식)과 일치하는 부분을 교체한 새로운 문자를 반환

  • 정규표현식 → /문자/g (g: 전역): 문자가 들어간 모든 부분을 찾아서 바꿈
  • 원본의 데이터는 손상되지 않음
const str = "Hello, Hello!";

console.log(str.replace("Hello", "Hi")); // Hi, Hello!
console.log(str.replace(/Hello/g, "Hi")); // Hi, Hi!

.slice()

대상 문자의 일부를 추출해 새로운 문자를 반환

  • 두 번째 인수 직전까지 추출하고, 두 번째 인수를 생략하면 대상 문자의 끝까지 추출
  • 음수를 사용하면 끝에서부터 추출
  • 원본의 데이터는 손상되지 않음
const str = "Hello world!";

console.log(str.slice(0, 5)); // Hello
console.log(str.slice(6, -1)); // world
console.log(str.slice(6)); // world!
console.log(str.slice()); // Hello world!

.split()

대상 문자를 주어진 구분자로 나눠 배열로 반환

  • 두 번째 인수 직전까지 추출하고, 두 번째 인수를 생략하면 대상 문자의 끝까지 추출
const str = "Apple, Banana, Cherry";
console.log(str.split(", ")); // ["Apple", "Banana", "Cherry"]
console.log(str.split("")); // ["A", "p", "p", "l", "e", ",", " ", "B", "a", "n", "a", "n", "a", ",", " ", "C", "h", "e", "r", "r", "y"]

.toLowerCase()

대상 문자를 영어 소문자로 반환해 새로운 문자로 반환

  • 원본 데이터는 손상되지 않음
const str = "Apple, Banana, Cherry";
console.log(str.toLowerCase()); // apple, banana, cherry

.toUpperCase()

대상 문자를 영어 대문자로 반환해 새로운 문자로 반환

  • 원본 데이터는 손상되지 않음
const str = "Apple, Banana, Cherry";
console.log(str.toUpperCase()); // APPLE, BANANA, CHERRY

.trim()

대상 문자의 얖뒤 공백 문자(space, tab 등)를 제거한 새로운 문자를 반환

  • 중간중간 공백은 제거되지 않음
  • 원본 데이터는 손상되지 않음
const str = "    HEROPY!  ";
console.log(str.trim()); // HEROPY!(앞뒤 공백 제거)

숫자(Number)

.toFixed()

숫자를 지정된 고정 소수점 표기(자릿수)까지 표현하는 문자로 반환

const num = 3.141592;
console.log(num.toFixed(2)); // 3.14(string)
console.log(parseFloat(num.toFixed(2))); // 3.14(number)

.toLocalString()

숫자를 현지 언어 형식의 문자로 반환

  • 세 자리마다 쉼표를 찍어서 반환가능
const num = 1000000;
console.log(num.toLocaleString()); // 1,000,000
console.log(`${num.toLocaleString()}`); // 1,000,000원

Number.isInteger()

숫자가 정수(integer)인지 아닌지 판별

  • 클래스에서 바로 사용 가능한 정적 메서드(인스턴스 생성 없이 사용 가능)
const num = 123;
const pi = 3.14;

console.log(Number.isInteger(num)); // true
console.log(Number.isInteger(pi)); // false

Number.isNaN()

주어진 값이 'NaN'인지 판별

  • 정적메서드
const num1 = NaN;
const num2 = 123;
const str = "Hello world";
const nul = null;

console.log(Number.isNaN(num1)); // true
console.log(Number.isNaN(num2)); // false
console.log(Number.isNaN(str)); // false
console.log(Number.isNaN(nul)); // false

Number.pareInt() 또는 parseInt()

주어진 값(숫자, 문자)을 파싱해 특정 진수(radix)의 정수로 반환

const str = "3.141592";
const num = 3.141592;

console.log(Number.parseInt(str, 10)); // 3(10진수)
console.log(Number.parseInt(num, 10)); // 3(10진수)

Number.parseFloat() 또는 parseFloat()

주어진 값(숫자, 문자)을 파싱해 부동소수점 실수로 반환(숫자)

  • parseInt와 달리 두번째 인수인 진수(radix)를 받지 않음
const str = "3.141592";
const num = 3.141592;

console.log(Number.parseFloat(str)); // 3.141592
console.log(Number.parseFloat(num)); // 3.141592

Math(수학)

수학적인 상수와 함수를 위한 속성과 메서드를 가진 내장 객체

Math.abs()

주어진 숫자의 절댓값을 반환

console.log(Math.abs(2)); // 2
console.log(Math.abs(-2)); // 2

Math.ceil()

주어진 숫자를 올림해 정수를 반환

console.log(Math.ceil(3.141592)); // 4
console.log(Math.ceil(-3.141592)); // -3

Math.floor()

주어진 숫자를 내림해 정수를 반환

console.log(Math.floor(3.141592)); // 3
console.log(Math.floor(-3.141592)); // -4

Math.max()

주어진 숫자 중 가장 큰 숫자를 반환

console.log(Math.max(1, 22, 38, 192)); // 192

Math.min()

주어진 숫자 중 가장 작은 숫자를 반환

console.log(Math.min(1, 22, 38, 192)); // 1

Math.pow()

주어진 숫자의 거듭제곱한 값을 반환

console.log(Math.pow(4, 2)); // 16
console.log(Math.pow(7, 2)); // 49
console.log(Math.pow(10, 3)); // 1000

Math.random()

숫자 0 이상, 1 미만의 난수를 반환

console.log(Math.random()); // 0.7030188097849545
// 특정 범위의 랜덤 정수를 얻는 함수
function random(min = 0, max = 10) {
  return Math.floor(Math.random() * (max - min)) + min;
}
console.log(random()); // 0 ~ 10 사이의 랜덤 정수
console.log(random(11, 20)); // 11 ~ 20 사이의 랜덤 정수

Math.round()

주어진 숫자를 반올림해 정수를 반환

const num1 = 3.141;
const num2 = 3.768;

console.log(Math.round(num1)); // 3
console.log(Math.round(num2)); // 4

날짜(Date)

💡 타임스탬프
1970년 1월 1일 00:00:00 UTC(협정 세계시)로부터 경과한 시간을 밀리초로 나타낸 것

const date = new Date();
console.log(date); // Thu Oct 12 2023 15:59:33 GMT+0900 (대한민국 표준시)

const d1 = new Date(2022, 11, 16, 12, 57, 30);
// 년 월 일 시 분 초
console.log(d1); // Fri Dec 16 2022 12:57:30 GMT+0900 (대한민국 표준시)
// 1월은 0부터 시작

const d2 = new Date("Fri Dec 16 2022 12:57:30 GMT+0900");
console.log(d2); // Fri Dec 16 2022 12:57:30 GMT+0900 (대한민국 표준시)
console.log(d2.getFullYear()); // 2022 // 해당 날짜의 연도 추출(프로토타입 메서드)

.getFullYear().setFullYear()

날짜 인스턴스의 '연도'를 반환하거나 지정

const date = new Date();
console.log(date.getFullYear()); // 2023

date.setFullYear(2023);
console.log(date.getFullYear()); // 2023
console.log(date); // Thu Oct 12 2023 16:01:12 GMT+0900 (대한민국 표준시)

.getMonth().setMonth()

날짜 인스턴스의 '월'을 반환하거나 지정

  • 0부터 시작(Zero-based numbering)
const date = new Date();
console.log(date.getMonth()); // 9
console.log(date); // Thu Oct 12 2023 16:01:38 GMT+0900 (대한민국 표준시)

date.setMonth(0);
console.log(date.getMonth()); // 0
console.log(date); // Thu Jan 12 2023 16:01:38 GMT+0900 (대한민국 표준시)

.getDate().setDate()

날짜 인스턴스의 '일'을 반환하거나 지정

const date = new Date();
console.log(date.getDate()); // 12
console.log(date); // Thu Oct 12 2023 16:01:58 GMT+0900 (대한민국 표준시)

date.setDate(11);
console.log(date.getDate()); // 11
console.log(date); // Wed Oct 11 2023 16:01:58 GMT+0900 (대한민국 표준시)

.getHours().setHours()

날짜 인스턴스의 '시간'을 반환하거나 지정

const date = new Date();
console.log(date.getHours()); // 16
console.log(date); // Thu Oct 12 2023 16:02:18 GMT+0900 (대한민국 표준시)

date.setHours(7);
console.log(date.getHours()); // 7
console.log(date); // Thu Oct 12 2023 07:02:18 GMT+090 (대한민국 표준시)

.getMinutes().setMinutes()

날짜 인스턴스의 '분'을 반환하거나 지정

const date = new Date();
console.log(date.getMinutes()); // 3
console.log(date); // Thu Oct 12 2023 16:03:53 GMT+0900 (대한민국 표준시)

date.setMinutes(2);
console.log(date.getMinutes()); // 2
console.log(date); // Thu Oct 12 2023 16:02:53 GMT+0900 (대한민국 표준시)

.getSeconds().setSeconds()

날짜 인스턴스의 '초'를 반환하거나 지정

const date = new Date();
console.log(date.getSeconds()); // 19
console.log(date); // Thu Oct 12 2023 16:05:19 GMT+0900

date.setSeconds(57);
console.log(date.getSeconds()); // 57
console.log(date); // Thu Oct 12 2023 16:05:57 GMT+0900

.getDay()

날짜 인스턴스의 '요일'을 반환

const date = new Date();
const day = date.getDay();

console.log(day); // 4
console.log(getDayKo(day)); // 목요일

function getDayKo(day) {
  switch (day) {
    case 0:
      return "일요일";
    case 1:
      return "월요일";
    case 2:
      return "화요일";
    case 3:
      return "수요일";
    case 4:
      return "목요일";
    case 5:
      return "금요일";
    case 6:
      return "토요일";
  }
}

.getTime().setTime()

  • '1970-01-01 00:00:00'(유닉스타임)부터 경과한, 날짜 인스턴스의 '밀리초(ms)'로 반환하거나 지정
const date = new Date();
console.log(date.getTime()); // 1697095280809
console.log(date); // Thu Oct 12 2023 16:21:20 GMT+0900 (대한민국 표준시)

date.setTime(1700000000000);
console.log(date.getTime()); // 1700000000000
console.log(date); // Wed Nov 15 2023 07:13:20 GMT+0900 (대한민국 표준시)
Date.prototype.isAfter = function (date) {
  const a = this.getTime();
  const b = this.getTime();
  console.log(a);
  console.log(b);
  return a > b;
};

const d1 = new Date("Sat Jan 01 2022 00:00:00 GMT+0900 (대한민국 표준시)");
const d2 = new Date("Sun Jan 01 2023 00:00:00 GMT+0900 (대한민국 표준시)");

console.log(d1.isAfter(d2)); // false
console.log(d2.isAfter(d1)); // true

Date.now()

'1970-01-01 00:00:00'(유닉스타임)부터 경과한, 메서드가 호출될 때의 '밀리초(ms)'를 반환

  • 정적메서드
const time = new Date().getTime();
console.log(Date.now()); // 1697096605344
console.log(time); // 1697096605344

setTimeout(() => {
  console.log(Date.now()); // 1697096606346
  console.log(time); // 1697096605344
}, 1000);

0개의 댓글