[ 모던 자바스크립트 ] 28. Number

2024. 4. 9. 09:48· Javascript/모던 자바스크립트
목차
  1. 1) Number 생성자 함수
  2. 2) Number 프로퍼티
  3. 3) Number 메서드
728x90

 

표준 빌트인 객체인 Number는 원시 타입인 숫자를 다룰 때 유용한 프로퍼티와 메서드를 제공한다.

 

 

1) Number 생성자 함수

Number 객체는 생성자 함수 객체다. 따라서 new 연산자와 함께 호출하여 Number 인스턴스를 생성할 수 있다.

 

Number 생성자 함수에 인수를 전달하지 않고 new 연산자와 함께 호출하면 [[NumberData]] 내부 슬롯에 0을 할당한 Number 래퍼 객체를 생성한다.

const numObj = new Number();
console.log(numObj);   // Number {[[PrimitiveValue]]: 0 }
  • [[PrimitiveValue]] ⇒ [[NumberData]] 내부 슬롯

 

Number 생성자 함수의 인수로 숫자를 전달하면서 new 연산자와 함께 호출하면 [[NumberData]] 내부 슬롯에 인수로 전달받은 숫자를 할당한 Number 래퍼 객체를 생성한다.

const numObj = new Number(10);
console.log(numObj);   // Number {[[PrimitiveValue]]: 10 }

 

Number 생성자 함수의 인수로 숫자가 아닌 값을 전달하면 인수를 숫자로 강제 변환한 후, [[NumberData]] 내부 슬롯에 변환된 숫자를 할당한 Number 래퍼 객체를 생성한다. 인수를 숫자로 변환할 수 없다면 NaN을 [[NumberData]] 내부 슬롯에 할당한 Number 래퍼 객체를 생성한다.

const numObj = new Number('10');
console.log(numObj);   // Number {[[PrimitiveValue]]: 10 }

const numObj = new Number('Hello');
console.log(numObj);   // Number {[[PrimitiveValue]]: NaN }

 

new 연산자를 사용하지 않고 Number 생성자 함수를 호출하면 Number 인스턴스가 아닌 숫자를 반환한다. 이를 이용하여 명시적으로 타입을 변환하기도 한다.

Number('0');       // -> 0
Number('-1');      // -> -1
Number('10.53');   // -> 10.53

Number(true);      // -> 1
Number(false);     // -> 0

 


 

2) Number 프로퍼티

Number.EPSILON

ES6 도입

1과 1보다 큰 숫자 중에서 가장 작은 숫자와의 차이 (약 2.220446049250313e-16**)**

부동소수점으로 인해 발생하는 오차를 해결하기 위해 사용한다.

0.1 + 0.2;   // -> 0.30000000000000004
0.1 + 0.2 === 0.3;   // false

function isEqual(a, b) {
	return Math.abs(a - b) < Number.EPSILON;
}

isEqual(0.1 + 0.2, 0.3);   // true

 

 

Number.MAX_VALUE

자바스크립트에서 표현할 수 있는 가장 큰 양수 값

Number.MAX_VALUE보다 큰 숫자는 Infinity다.

Number.MAX_VALUE;   // -> 1.7976931348623157e+308

 

 

Number.MIN_VALUE

자바스크립트에서 표현할 수 있는 가장 작은 양수 값

Number.MIN_VALUE보다 작은 숫자는 0이다.

Number.MIN_VALUE;   // -> 5e-324

 

 

Number.MAX_SAFE_INTEGER

자바스크립트에서 안전하게 표현할 수 있는 가장 큰 정수값

Number.MAX_SAFE_INTEGER;   // -> 9007199254740991

 

 

Number.MIN_SAFE_INTEGER

자바스크립트에서 안전하게 표현할 수 있는 가장 작은 정수값

Number.MIN_SAFE_INTEGER;   // -> -9007199254740991

 

 

Number.POSITIVE_INFINITY

양의 무한대를 나타내는 숫자값 Infinity와 같다.

 

 

Number.NEGATIVE_INFINITY

음의 무한대를 나타내는 숫자값 -Infinity와 같다.

 

 

Number.NaN

숫자가 아님(Not-a-Number)을 나타내는 숫자값

 


 

3) Number 메서드

Number.isFinite

ES6에서 도입된 Number.isFinite 정적 메서드는 인수로 전달된 숫자값이 정상적인 유한수, 즉 Infinity 또는 -Infinity가 아닌지 검사하여 그 결과를 불리언 값으로 반환한다.

// 인수가 정상적인 유한수이면 true 반환
Number.isFinite(0);                   // -> true
Number.isFinite(Number.MAX_VALUE);    // -> true
Number.isFinite(Number.MIN_VALUE);    // -> true

// 인수가 무한수이면 false 반환
Number.isFinite(Infinity);            // -> false
Number.isFinite(-Infinity);           // -> false

// 인수가 NaN이면 false 반환
Number.isFinite(NaN);                 // -> false

 

Number.isFinite 메서드는 빌트인 전역 함수 isFinite와 차이가 있다. 빌트인 전역 함수 isFinite는 전달받은 인수를 숫자로 암묵적 타입 변환하여 검사를 수행하지만 Number.isFinite는 전달받은 인수를 숫자로 암묵적 타입 변환하지 않는다. 따라서 숫자가 아닌 인수가 주어졌을 때 반환값은 언제나 false다.

Number.isFinite(null);   // -> false
isFinite(null);   // -> true

 

 

Number.isInteger

ES6에서 도입된 Number.Integer 정적 메서드는 인수로 전달된 숫자값이 정수인지 검사하여 그 결과를 불리언 값으로 반환한다.

검사하기 전에 인수를 숫자로 암묵적 타입 변환하지 않는다.

Number.Integer(0);         // -> true
Number.Integer(0.5);       // -> false
Number.Integer('123');     // -> false
Number.Integer(false);     // -> false
Number.Integer(Infinity)   // -> false

 

 

Number.isNaN

ES6에서 도입된 Number.isNaN 정적 메서드는 인수로 전달된 숫자값이 NaN인지 검사하여 그 결과를 불리언 값으로 반환한다.

Number.isNaN(NaN);   // -> true

 

Number.isNaN 메서드는 빌트인 전역 함수 isNaN과 차이가 있다. 빌트인 전역 함수 isNaN은 전달받은 인수를 숫자로 암묵적 타입 변환하여 검사를 수행하지만 Number.isNaN 메서드는 전달받은 인수를 숫자로 암묵적 타입 변환하지 않는다. 따라서 숫자가 아닌 인수가 주어졌을 때 반환값은 언제나 false다.

Number.isNaN(undefined);   // -> false
isNaN(undefined);   // -> true

 

 

Number.isSafeInteger

ES6에서 도입된 Number.isSafeInteger 정적 메서드는 인수로 전달된 숫자값이 안전한 정수인지 검사하여 그 결과를 불리언 값으로 반환한다.

검사전에 인수를 숫자로 암묵적 타입 변환하지 않는다.

Number.isSafeInteger(0);   // -> true
Number.isSafeInteger(1000000000000000);   // -> true
Number.isSafeInteger(0.5);   // -> false
Number.isSafeInteger(false);   // -> false

 

 

Number.prototype.toExponential

숫자를 지수 표기법으로 변환하여 문자열로 반환한다.

지수 표기법이란 매우 크거나 작은 숫자를 표기할 때 주로 사용하며 e 앞에 있는 숫자에 10의 n승을 곱하는 형식으로 수를 나타내는 방식이다.

인수로 소수점 이하로 표현할 자릿수를 전달할 수 있다.

(77.1234).toExponential();     // -> '7.71234e+1'
(77.1234).toExponential(4);    // -> '7.7123e+1'
(77.1234).toExponential(2);    // -> '7.71e+1'

 

자바스크립트 엔진은 숫자 뒤의 .을 부동 소수점 숫자의 소수 구분 기호로 해석한다.

// toExponential을 프로퍼티로 해석할 수 없으므로 에러 발생
77.toExponential();   // -> SyntaxError: Invalid or unexpected token

// 두 번째 .은 프로퍼티 접근 연산자로 해석된다.
77.1234.toExponential();   // -> '7.71234e+1'

// 숫자 리터럴과 함께 메서드를 사용할 경우 혼란을 방지하기 위해 그룹 연산자를 사용할 것을 권장한다.
(77).toExponential();      // -> '7.7e+1'

// 자바스크립트는 정수 부분과 소수 부분 사이에 공백을 포함할 수 없다. 
// 따라서 숫자 뒤의 . 뒤에 공백이 오면 .을 프로퍼티 접근 연산자로 해석한다.
77 .toExponential();       // -> '7.7e+1'

 

 

Number.prototype.toFixed

숫자를 반올림하여 문자열로 반환한다.

반올림하는 소수점 이하 자릿수를 나타내는 0~20 사이의 정수값을 인수로 전달할 수 있다. 인수를 생략하면 기본값 0이 지정된다.

(12345.6789).toFixed();   // -> '12346'

 

 

Number.prototype.toPrecision

인수로 전달받은 전체 자릿수까지 유효하도록 나머지 자릿수를 반올림하여 문자열로 반환한다.

인수로 전달받은 전체 자릿수로 표현할 수 없는 경우 지수 표기법으로 결과를 반환한다.

전체 자릿수를 나타내는 0~21 사이의 정수값을 인수로 전달할 수 있다. 인수를 생략하면 기본값 0이 지정된다.

(12345.6789).toPrecision();    // -> '12345.6789'
(12345.6789).toPrecision(1);   // -> '1e+4'
(12345.6789).toPrecision(2);   // -> '1.2e+4'

 

 

Number.prototype.toString

숫자를 문자열로 변환하여 반환한다.

진법을 나타내는 2~36 사이의 정수값을 인수로 전달할 수 있다. 인수를 생략하면 기본값 10진법이 지정된다.

(10).toString();    // -> '10'
(16).toString(2);   // -> '10000'
(16).toString(8);   // -> '20'

 

 

 


출처: 이웅모, 『모던 자바스크립트 Deep Dive』 - 위키북스

728x90

'Javascript > 모던 자바스크립트' 카테고리의 다른 글

[ 모던 자바스크립트 ] 30. Date  (0) 2024.04.11
[ 모던 자바스크립트 ] 29. Math  (0) 2024.04.11
[ 모던 자바스크립트 ] 27. 배열  (0) 2024.04.08
[ 모던 자바스크립트 ] 26. ES6 함수의 추가 기능 (메서드 | 화살표 함수 | Rest 파라미터)  (0) 2024.04.05
[ 모던 자바스크립트 ] 25. 클래스  (0) 2024.04.04
  1. 1) Number 생성자 함수
  2. 2) Number 프로퍼티
  3. 3) Number 메서드
'Javascript/모던 자바스크립트' 카테고리의 다른 글
  • [ 모던 자바스크립트 ] 30. Date
  • [ 모던 자바스크립트 ] 29. Math
  • [ 모던 자바스크립트 ] 27. 배열
  • [ 모던 자바스크립트 ] 26. ES6 함수의 추가 기능 (메서드 | 화살표 함수 | Rest 파라미터)
ZoD
ZoD
바쁘게 굴러가는 ZoD의 하루~
ZoD
como siempre
ZoD
  • 분류 전체보기 (173)
    • Daily (0)
    • Javascript (16)
      • 모던 자바스크립트 (46)
    • Typescript (8)
    • FrontEnd (7)
    • React (21)
      • tanstack query (1)
      • 라이브러리 (3)
    • Vue (33)
      • Nuxt (11)
      • Quasar (6)
    • CSS (12)
    • Storybook (8)
    • Figma (3)
    • CS 지식 (5)
    • Network (5)
    • 알고리즘 (2)
    • 사이드 프로젝트 (4)
      • ddangkong (4)
      • boncierge (0)
    • 개발, 근데 이제 헛소리를 곁들인 (1)
    • ETC (2)

블로그 메뉴

  • 홈
  • 태그
  • 방명록

인기 글

최근 글

hELLO · Designed By 정상우.v4.2.2
ZoD
[ 모던 자바스크립트 ] 28. Number
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.