| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | ||
| 6 | 7 | 8 | 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 | 17 | 18 | 19 |
| 20 | 21 | 22 | 23 | 24 | 25 | 26 |
| 27 | 28 | 29 | 30 |
- state끌어올리기
- 시멘틱마크업
- vendorprefix
- LS43FM701
- CSS
- 삼탠바이미
- useState
- 즉시실행함수
- react
- 00000000
- 수직중앙정렬
- iife
- 리액트
- 43인치모니터
- 상하중앙정렬
- webapi
- hooks
- 웹폰트최적화
- 반응형
- css 수직중앙정렬
- VITE
- 스마트모니터
- 미디어쿼리
- CSS헥사코드
- 벤더프리픽스
- 컨테이너쿼리
- JS슬라이더
- 이미지확장자
- WebP
- Nextjs
- Today
- Total
Nimbus
딥다이브 - Number 본문
Number 생성자 함수
- 표준 빌트인 객체인 Number 객체는 생성자 함수다.
- new 연산자 함수와 함께 호출하여 Number 인스턴스를 생성할 수 있다.
- Number 생성자 함수에 인수를 전달하지 않고 호출하면 [[NumberData]] 내부 슬롯에 0을 할당한 Number 리퍼 객체를 생성한다.
const numObj = new Number();
console.log(numObj); // Number {[[PrimitiveValue]]: 0}
Number 생성자 함수의 인수에 숫자가 아닌 값을 전달하면 숫자로 강제 변환하며, 숫자로 변환할 수 없다면 NaN을 할당한 Number 래퍼 객체를 생성한다.
let numObj = new Number('10');
console.log(numObj); // Number {[[PrimitiveValue]]: 10}
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
Number 프로퍼티
Number.EPSILON
ES6에서 도입된 Number.EPSILON은 1과 1보다 큰 숫자 중에서 가장 작은 숫자와의 차이와 같다.
Number.EPSILON은
0.1 + 0.2; // -> 0.3000000...4
0.1 + 0.2 === 0.3; // -> false
Number.EPSILON은 부동소수점으로 인해 발생하는 오차를 해결하기 위해 사용한다.
function isEqual(a, b){
// a와 b를 뺀 값의 절대값이 Number.EPSILON보다 작으면 같은 수로 인정한다.
return Math.abs(a - b) < Number.EPSILON; // Math.abs : 절대값
}
isEqual(0.1 + 0.2, 0.3); // -> true
즉 0.1+0.2와 0.3 을 뺀 값이 Number.EPSILON 보다 작으면 같은값으로 처리하는 예제이다.
Number.MAX_VALUE
Number.MAX_VALUE는 자바스크립트에서 표현할 수 있는 가장 큰 양수 값이다.
Number.MAX_VALUE보다 큰 숫자는 Infinity다.
Number.MAX_VALUE; // -> 1.7976931348623157e+308
Infinity > Number.MAX_VALUE; // true
Number.MIN_VALUE
Number.MIN_VALUE는 자바스크립트에서 표현할 수 있는 가장 작은 양수 값이다.
Number.MIN_VALUE보다 작은 숫자는 0이다.
Number.MIN_VALUE; // -> 5e-324
Number.MIN_VALUE > 0; // -> true
Number.MAX_SAFE_INTEGER
Number.MAX_SAFE_INTEGER는 자바스크립트에서 안전하게 표현할 수 있는 가장 큰 정수값이다.
Number.MAX_SAFE_INTEGER; // -> 9007199254740991
Number.MIN_SAFE_INTEGER
Number.MIN_SAFE_INTEGER는 자바스크립트에서 안전하게 표현할 수 있는 가장 작은 정수값이다.
Number.MIN_SAFE_INTEGER; // -> -9007199254740991
Number.POSITIVE_INFINITY
Number.POSITIVE_INFINITY는 양의 무한대를 나타내는 숫자값 Infinity와 같다.
Number.POSITIVE_INFINITY; // -> Infinity
Number.NEGATIVE_INFINITY
Number.NEGATIVE_INFINITY는 음의 무한대를 나타내는 숫자값 -Infinity와 같다.
Number.NEGATIVE_INFINITY; // -> -Infinity
Number.NaN
Number.NaN은 숫자가 아님을 나타내는 숫자값이다. Number.NaN은 window.NaN과 같다.
Number.NaN; // -> NaN
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.isInteger
ES6에서 도입된 Number.isInteger 는 인수로 전달된 숫자값이 정수인지 검사하여 그 결과를 불리언 값으로 반환한다.
// 인수가 정수이면 true를 반환한다.
Number.isInteger(0) // -> true
Number.isInteger(123) // -> true
Number.isInteger(-123) // -> true
// 0.5는 정수가 아니다.
Number.isInteger(0.5) // -> false
// '123'을 숫자로 암묵적 타입 변환하지 않는다.
Number.isInteger('123') // -> false
// false를 숫자로 암묵적 타입 변환하지 않는다.
Number.isInteger(false) // -> false
// Infinity/-Infinity는 정수가 아니다.
Number.isInteger(Infinity) // -> false
Number.isInteger(-Infinity) // -> false
Number.isNaN
ES6에서 도입된 Number.isNaN 은 인수로 전달된 숫자값이 NaN인지 검사하여 그 결과를 불리언 값으로 반환한다.
// 인수가 NaN이면 true를 반환한다.
Number.isNaN(NaN); // -> true
Number.isNaN 메서드는 빌트인 전역 함수인 isNaN과 차이가 있다. isNaN은 전달받은 인수를 숫자로 암묵적으로 타입 변환 후 검사하지만 Number.isNaN은 숫자로 암묵적 타입변환하지 않는다. 따라서 숫자가 아니면 반환값은 언제나 false다.
// Number.isNaN은 인수를 숫자로 암묵적 타입 변환하지 않는다.
Number.isNaN(undefined); // -> false
// isNaN은 인수를 숫자로 암묵적 타입 변환한다. undefined는 NaN으로 암묵적 타입 변환된다.
isNaN(undefined); // -> true
Number.isSafeInteger
ES6에서 도입된 Number.isSafeInteger는 인수로 전달된 숫자값이 안전한 정수인지 검사하여 그 결과를 불리언 값으로 반환한다. 검사전 인수를 숫자로 암묵적 타입 변환하지 않는다.
// 0은 안전한 정수다.
Number.isSafeInteger(0); // -> true
// 1000000000000000은 안전한 정수다.
Number.isSafeInteger(1000000000000000); // -> true
// 10000000000000001은 안전하지 않다.
Number.isSafeInteger(10000000000000001); // -> false
// 0.5는 정수가 아니다.
Number.isSafeInteger(0.5); // -> false
Number.prototype.toExponential
toExponential 메서드는 숫자를 지수 표기법으로 변환하여 문자열로 반환한다. 지수 표기법이란 매우 크거나 작은 숫자를 표기할때 주로 사용하며 e 앞에 있는 숫자에 10의 n승을 곱하는 형식이다.
(77.1234).toExponential(); // -> "7.71234e+1"
(77.1234).toExponential(4); // -> "7.7123e+1"
(77.1234).toExponential(2); // -> "7.71e+1"
Number.prototype.toFixed
toFixed 메서드는 숫자를 반올림하여 문자열로 반환한다. 반올림하는 소수점 이하 자릿수를 나타내는 0~20사이의 정수값을 실수로 전달할 수 있다. 인수를 생략하면 기본값 0이 지정된다.
// 소수점 이하 반올림. 인수를 생략하면 기본값 0이 지정된다.
(12345.6789).toFixed(); // -> "12346"
(12345.6789).toFixed(1); // -> "12345.7"
(12345.6789).toFixed(2); // -> "12345.68"
(12345.6789).toFixed(3); // -> "12345.679"
Number.prototype.toPrecision
toPrecision 메서드는 인수로 전달받은 전체 자릿수까지 유효하도록 나머지 자릿수를 반올림하여
문자열로 반환한다. 인수로 전달받은 전체 자릿수로 표현할 수 없는 경우 지수 표기법으로 결과를 반환한다.
// 전체 자릿수 유효. 인수를 생략하면 기본값 0이 지정된다.
(12345.6789).toPrecision(); // -> "12345.6789"
// 전체 1자릿수 유효, 나머지 반올림
(12345.6789).toPrecision(1); // -> "1e+4"
// 전체 2자릿수 유효, 나머지 반올림
(12345.6789).toPrecision(2); // -> "1.2e+4"
// 전체 6자릿수 유효, 나머지 반올림
(12345.6789).toPrecision(6); // -> "12345.7"
Number.prototype.toString
toString 메서드는 숫자를 문자열로 변환하여 반환한다.
// 인수를 생략하면 10진수 문자열을 반환한다.
(10).toString(); // -> "10"
// 2진수 문자열을 반환한다.
(16).toString(2); // -> "10000"
// 8진수 문자열을 반환한다.
(16).toString(8); // -> "20"
// 16진수 문자열을 반환한다.
(16).toString(16); // -> "10"
Math
표준 빌트인 객체인 Math는 수학적인 상수와 함수를 위한 프로퍼티와 메서드를 제공한다.
Math는 생성자 함수가 아니므로 정적 프로퍼티와 정적 메서드만 제공한다.
Math 프로퍼티
Math.PI
원주율 PI 값을 반환한다.
Math.PI; // -> 3.141592653589793
Math 메서드
Math.abs
Math.abs 메서드는 인수로 전달된 숫자의 절대값을 반환한다. 절대값은 반드시 0 또는 양수여야 한다.
Math.abs(-1); // -> 1
Math.abs('-1'); // -> 1
Math.abs(''); // -> 0
Math.abs([]); // -> 0
Math.abs(null); // -> 0
Math.abs(undefined); // -> NaN
Math.abs({}); // -> NaN
Math.abs('string'); // -> NaN
Math.abs(); // -> NaN
Math.round
Math.round 메서드는 인수로 전달된 숫자의 소수점 이하를 반올림한 정수를 반환한다.
Math.round(1.4); // -> 1
Math.round(1.6); // -> 2
Math.round(-1.4); // -> -1
Math.round(-1.6); // -> -2
Math.round(1); // -> 1
Math.round(); // NaN
Math.ceil
Math.ceil 메서드는 인수로 전달된 숫자의 소수점 이하를 올림한 정수를 반환한다.
Math.ceil(1.4); // -> 2
Math.ceil(1.6); // -> 2
Math.ceil(-1.4); // -> -1
Math.ceil(-1.6); // -> -1
Math.floor
Math.floor 메서드는 인수로 전달된 숫자의 소수점 이하를 내림한 정수를 반환한다.
(Math.ceil 메서드와 반대 개념)
Math.floor(1.9); // -> 1
Math.floor(9.1); // -> 9
Math.floor(-1.9); // -> -2
Math.floor(-9.1); // -> -10
Math.sqrt
Math.sqrt 메서드는 인수로 전달된 숫자의 제곱근을 반환한다.
Math.sqrt(9); // -> 3
Math.sqrt(-9); // -> NaN
Math.sqrt(2); // -> 1.414213562373095
Math.sqrt(1); // -> 1
Math.sqrt(0); // -> 0
Math.sqrt(); // -> NaN
Math.random
Math.random 메서드는 임의의 난수를 반환한다. 반환한 난수는 0에서 1미만의 실수다. 즉, 0은 포함되지만 1은 포함되지 않는다.
Math.random(); // 0에서 1 미만의 랜덤 실수(0.8208720231391746)
/*
1에서 10까지 범위의 랜덤 정수 획득
1) random으로 0에서 1 미만의 랜덤 실수를 구한 뒤, 10을 곱해 0에서 10 미만의 랜덤 실수 구함
2) 0에서 10 미만의 랜덤 실수에 1을 더해 1에서 10 범위의 랜덤 실수를 구함
3) Math.floor로 1에서 10 범위의 랜덤 실수의 소수점 이하를 떼어 버린 다음 정수를 반환
*/
const random = Math.floor((Math.random() * 10) + 1);
console.log(random); // 1에서 10 범위의 정수
Math.pow
Math.pow 메서드는 첫 번째 인수를 밑으로, 두 번째 인수를 지수로 거듭제곱한 결과를 반환한다.
Math.pow(2, 8); // -> 256
Math.pow(2, -1); // -> 0.5
Math.pow(2); // -> NaN
Math.pow 메서드 대신 ES7에서 도입된 지수 연산자를 사용하면 가독성이 더 좋다.
// ES7 지수 연산자
2 ** 2 ** 2; // -> 16
Math.pow(Math.pow(2, 2), 2); // -> 16
Math.max
Math.max 메서드는 전달받은 인수 중에서 가장 큰 수를 반환한다.
인수가 전달되지 않으면 -Infinity를 반환한다.
Math.max(1); // -> 1
Math.max(1, 2); // -> 2
Math.max(1, 2, 3); // -> 3
Math.max(); // -> -Infinity
Math.min
Math.min 메서드는 전달받은 인수 중에서 가장 작은 수를 반환한다.
인수가 전달되지 않으면 Infinity를 반환한다.
Math.min(1); // -> 1
Math.min(1, 2); // -> 1
Math.min(1, 2, 3); // -> 1
Math.min(); // -> Infinity