10. 빌트인 객체

연우·2023년 1월 10일
DateStringbooleanmathnumber네이티브 객체래퍼객체빌트인전역객체프로퍼티
0

드림코딩

목록 보기
7/15
post-thumbnail

자바스크립트의 객체는 위와 같이 크게 3가지로 분류할 수 있다.

빌트인 객체란?

네이티브 객체(Native objects or Built-in objects or Global Objects)

  • Object, String, Number, Function, Array, RegExp, Date, Math와 같은 객체 생성에 관계가 있는 함수 객체와 메소드로 구성
  • 네이티브 객체를 Global Objects라고 부르기도 하는데 이것은 전역 객체(Global Object)와 다른 의미로 사용되므로 혼동에 주의

래퍼 객체 (Wrapper Object)

  • 원시값을 필요에 따라서 관련된 빌트인 객체로 변환한다.
  • number, string, bollean, symbol
    원시 타입의 메서드를 호출하면,
    1) 순간적으로 원시 타입에 해당하는 '객체'가 생성되고,
    2) 이 '객체'의 메서드가 호출된다.
    3) 메서드 처리가 끝나면 이 '객체'는 사라지고,
    4) 원래의 원시 타입만 남는다.
  • 순간적으로 생성되었다 사라지는 객체를 래퍼 객체라고 한다.

애초에 객체로 사용하지 않는 이유

  • 값 뿐만 아닌 함수와 다양한 정보를 가지고 있어 무겁고 느려짐
  • 원시 타입은 가볍고 빠르지만, 그냥 값 하나뿐이라는 단점
  • 원시 타입의 가벼움은 유지하면서, 객체의 유용한 기능도 쓰기 위한 방법
const number = 123; // number 원시 타입
console.log(number.toString());// number 원시타입을 감싸고 있는 Number 객체로 감싸짐

전역객체(Global Object)

  • 모든 객체의 유일한 최상위 객체
  • Browser-side에서는 window
  • Server-side(Node.js)에서는 global 객체를 의미

전역 프로퍼티

console.log(globalThis);
console.log(this);
console.log(Infinity); // 양/음의 무한대를 나타내는 숫자값
console.log(NaN); //  숫자가 아님(Not-a-Number)을 나타내는 숫자
console.log(undefined); // undefined

Boolean

  • new Boolean(value);
  • Falshy
    0, -0, null, NaN, undefined, '', /
  • Truthy
    1, -1, '0', 'false', [], {}
var foo = new Boolean(true);    // true
var foo = new Boolean('false'); // true
var foo = new Boolean(false); // false
var foo = new Boolean();      // false
  • Boolean 객체와 원시 타입 boolean을 혼동하기 쉽다
  • Boolean 객체는 true/false를 포함하고 있는 객체
var x = new Boolean(false);
if (x) { // x는 객체로서 존재한다. 따라서 참으로 간주된다.
  // . . . 이 코드는 실행된다.
}

Number

  • new Number(value) : 객체 생성
const num1 = 123;
const num2 = new Number(123);
console.log(typeof num1); // 원시타입 123
console.log(typeof num2); // 객체 [Number : 123]

Number 프로퍼티

  • 정적(static) 프로퍼티로 Number 객체를 생성할 필요없이 Number.propertyName의 형태로 사용한다
console.log(Number.MAX_VALUE); // js에서 사용 가능한 가장 큰 숫자 (1.7976931348623157e+308) 반환
console.log(Number.MIN_VALUE); // js에서 사용 가능한 가장 작은 숫자(5e-324) 반환
console.log(Number.MAX_SAFE_INTEGER); //js에서 안전한 최대 정수 값(2^53 - 1)
console.log(Number.MIN_SAFE_INTEGER); //js에서 안전한 최소 정수값(-(2^53 - 1))
console.log(Number.NaN); //숫자가 아님을 나타내는 숫자 값
console.log(Number.NEGATIVE_INFINITY); //음의 무한대 -Infinity 반환
console.log(Number.POSITIVE_INFINITY); //양의 무한대 Infinity 반환

Number 메서드

  • Number.isNaN(testValue)
  • 매개변수에 전달된 값이 NaN인지를 검사하여 그 결과를 Boolean으로 반환한다.

전역한수 isNaN()과의 차이점

  • 전역 함수 isNaN()는 인수를 숫자로 변환하여 검사를 수행
  • Number.isNaN()는 인수를 변환하지 않으며 숫자가 아닌 인수가 주어졌을 때 반환값은 언제나 false
if (num1 < Number.MAX_VALUE) {
}
if (Number.isNaN(num1)) {
}

// 지수표기법 (매우 크거나 작은 숫자를 표기할때 사용, 10의 n승으로 표기)
const num3 = 102;
console.log(num3.toExponential()); // 1.02e+2

// 반올림하여 문자열로 변환
const num4 = 1234.12;
console.log(num4.toFixed()); // 1234
//숫자 자체를 문자열로 변환
console.log(num4.toString());
// 나라에 맞는 숫자로 표기
console.log(num4.toLocaleString('ar-EG'));

// 원하는 자릿수까지 유효하도록 반올림
console.log(num4.toPrecision(5)); // 1234.1
console.log(num4.toPrecision(4));
// 전체 자릿수 표기가 안될때는 지수표기법
console.log(num4.toPrecision(2)); // 1.2e+3

if (Number.EPSILON > 0 && Number.EPSILON < 1) {
  console.log(Number.EPSILON); // 0과 1사이에서 나타낼 수 있는 가장 작은 숫자
}
const num = 0.1 + 0.2 - 0.2; // 0.1
console.log(num);

function isEqual(original, expected) {
  return Math.abs(original - expected) < Number.EPSILON;
  // Math.abs : 숫자의 절댓값 반환
}
console.log(isEqual(1, 1)); // true
console.log(isEqual(0.1, 0.1)); // true
console.log(isEqual(num, 0.1)); // true

Math

Math 프로퍼티

console.log(Math.E); // 오일러의 상수, 자연로그의 밑
console.log(Math.PI); // 원주율 PI값

Math 메서드

// 절대값
console.log(Math.abs(-10));
// 소수점 이하를 올림
console.log(Math.ceil(1.4));
// 소수점 이하를 내림
console.log(Math.floor(1.4));
// 소수점 이하를 반올림
console.log(Math.round(1.4));
console.log(Math.round(1.7));
// 정수만 반환
console.log(Math.trunc(1.5432));

// 최대, 최소값을 찾기
console.log(Math.max(1, 3, 4));
console.log(Math.min(1, 3, 4));

// 거듭제곱
console.log(3 ** 2);
console.log(Math.pow(3, 2));

// 제곱근
console.log(Math.sqrt(9));

// 랜덤한 값을 반환
console.log(Math.random());

// 1~10
console.log(Math.floor(Math.random() * 10 + 1));

String

  • new String(value) : 객체 생성
    String 프로퍼티
  • length
const text = 'Hello World!';
console.log(text.length);

String 메서드

const textObj = new String('Hello World!'); // 객체타입
const text = 'Hello World!'; // 원시타입
console.log(textObj); // // [String: 'Hello World!']
console.log(text); // Hello World!
console.log(text.length); // 12

// 배열의 인덱스로 접근
console.log(text[0]);
console.log(text[1]);
console.log(text[2]);
// 인수로 전달된 인덱스번호로 함수 접근하기
console.log(text.charAt(0));
console.log(text.charAt(1));
console.log(text.charAt(2));

// 처음부터 찾아진 문자열이 몇번째 인덱스에 있는지 찾기
console.log(text.indexOf('l'));
// 뒤에서부터 찾아진 문자열이 몇번째 인덱스에 있는지 찾기
console.log(text.lastIndexOf('l'));

// 해당하는 문자열이 있는지 확인하기(대소문자 구분함)
console.log(text.includes('tx'));
console.log(text.includes('h'));
console.log(text.includes('H'));

//특정한 문자열로 시작하는지 확인하기
console.log(text.startsWith('He'));
//특정한 문자열로 끝나는지 확인하기
console.log(text.endsWith('!'));

//모든 텍스트를 대문자로 변환되어 반환해줌
console.log(text.toUpperCase());
//모든 텍스트를 소문자로 변환되어 반환해줌
console.log(text.toLowerCase());


//특정한 문자열 가져오기(시작하는 인덱스,종료인덱스)
console.log(text.substring(0, 2));

//특정 문자열 추출하기
//추출시작점인 0부터 시작하며, 추출 종료 인덱스 그 직전까지 추출됨
console.log(text.slice(2));
//음수라면 뒤에서부터도 잘라낼 수 있다
console.log(text.slice(-2));

//문자열의 양쪽 끝 공백 제거하기
const space = '            space       ';
console.log(space.trim());

//원하는 단어 덩어리로 끊어서 배열로 반환해줌
const longText = 'Get to the, point';
console.log(longText.split(' '));
console.log(longText.split(', ', 2));

Date

  • 날짜와 시간(년, 월, 일, 시, 분, 초, 밀리초)을 위한 메소드를 제공하는 빌트인 객체이면서 생성자 함수이다.
  • Date 생성자 함수로 생성한 Date 객체는 내부적으로 숫자값을 갖는다
  • UTC기준 (협정 세계시, 1970년 1월 1일 UTC 자정과의 시간 차이를 밀리초 단위로 표기)

Date 생성자 함수

  • new Date()
  • new Date(dateString)
  • new Date(year, month[, day, hour, minute, second, millisecond])
console.log(Date.now());
// 날짜와 시간 문자열을 구문 분석하여 1970년 1월 1일 00시 00분 00초 UTC를 기준으로 경과 한 밀리초를 반환합니다.
console.log(Date.parse('2022-12-17T03:24:00'));

const now = new Date();
now.setFullYear(2023); // 년도 4자리 설정
// 달 설정
now.setMonth(0); // 0: 1
console.log(now.getFullYear()); // 년도 반환
// 날짜 반환
console.log(now.getDate()); // 0: 1 
// 요일 반환
console.log(now.getDay()); // 0 일요일일부터, 1... 6: 토요일

console.log(now.getTime());// 시간 반환
console.log(now);


console.log(now.toString()); // 전체적인 날짜,시간
console.log(now.toDateString()); // 날짜만 표기
console.log(now.toTimeString()); // 시간만 표기
console.log(now.toISOString()); // ISO 8601 형식 표기
console.log(now.toLocaleString('en-US')); // 미국
console.log(now.toLocaleString('ko-KR'));
profile
연우
이전 포스트

9. 클래스

다음 포스트

11. 배열

0개의 댓글