Growth from the root - Vanilla JavaScript - 숫자형

이형준·2023년 4월 12일
0
post-thumbnail

숫자형

📃 숫자는 두 가지 자료형을 지원함.

  1. 일반적인 숫자
  2. biginit(2의 53제곱 이상이거나 -2의 53제곱 이하)

숫자를 입력하는 다양한 방법

(ex)

// 10억을 입력해보자 !

let billion = 1000000000;

✏️ 오기의 위험도 있고, 보기도 안좋음 그래서 대개는 10억(billion)을 나타날 땐 "1bn"을 사용하고, 73억을 나타날 때는 "7.3bn" 을 사용.

✅ JS에서도 숫자옆에 "e" 를 붙이고 0의 개수를 그 옆에 붙여서 사용.

(ex)

let billion = 1e9;  // 1과 9개의 0, 10억

alert( 7.3e9 );  // (7,300,000,000), 73억

1e3 = 1 * 1000 // 즉 e는 왼쪽 수에 오른쪽 수만큼 10의 거듭제곱

1.23e6 = 1.23 * 1000000
let ms = 0.000001; // 작은 숫자 사용할 때도 사용

let ms = 1e-6; // 1에서 왼쪽으로 6번 소수점 이동


1e-3 = 1 / 1000 (=0.001) // 10을 세 번 거듭제곱한 수로 나눔


1.23e-6 = 1.23 / 1000000 (=0.00000123) // 10을 여섯 번 거듭제곱한 수로 나눔



16진수, 2진수, 8진수

📃 16진수는 색을 나타내거나 문자를 인코딩할 때 등 다양한 곳에서 쓰임.
(ex)

alert( 0xff ); // 255
alert( 0xFF ); // 255 (대·소문자를 가리지 않으므로 둘 다 같은 값을 나타낼 수 있음.)
let a = 0b11111111; // 255의 2진수
let b = 0o377; // 255의 8진수

alert( a == b ); // true, 진법은 다르지만, a와 b는 같은 수임

✏️ 2진수와 8진수는 아주 드물게 쓰이긴 하지만, 접두사 0b와 0o를 사용해 간단히 나타낼 수 있음.



toString(base)

📃 num.toString(base) 메서드는 base 진법으로, num을 표현한 후, 이를 문자형으로 변환.
(ex)

let num = 255;

alert( num.toString(16) );  // ff
alert( num.toString(2) );   // 11111111

✏️ base는 2에서 36까지 쓸 수 있는데, 기본값은 10임.

base=16 – 16진수 색, 문자 인코딩 등을 표현할 때 사용함, 숫자는 0부터 9, 10 이상의 수는 A부터 F를 사용하여 나타냄.
base=2 – 비트 연산 디버깅에 주로 쓰임, 숫자는 0 또는 1이 될 수 있음.
base=36 – 사용할 수 있는 base 중 최댓값으로, 0..9와 A..Z를 사용해 숫자를 표현.
알파벳 전체가 숫자를 나타내는 데 사용됨, 36 베이스는 url을 줄이는 것과 같이 숫자로 된 긴 식별자를 짧게 줄일 때 유용함.
(ex) console.log(123456.toString(36)); // 2n9c



어림수 구하기

📃 어림수를 구하는 것은 숫자를 다룰 때 가장 많이 사용되는 연산 중 하나임.
1. Math.floor : 소수점 첫째 자리에서 내림. 3.1은 3, -1.1은 -2가 됨.
2. Math.ceil : 소수점 첫째 자리에서 내림. 3.1은 3, -1.1은 -2가 됨.
3. Math.round : 소수점 첫째 자리에서 반올림. 3.6은 4, -1.1은 -1이 됨.
4. Math.trunc : 소수부를 무시. 3.1은 3, -1.1은 -1가 됨.

📃 소수점 n-th번 째 수를 기준으로 어림수를 구해야 하는 상황이라면 ?

1. 곱하기와 나누기

📃 소수점 두 번째 자리 숫자까지만 남기고 싶은 경우, 숫자에 100 또는 100보다 큰 10의 거듭제곱 수를 곱한 후, 원하는 어림수 내장 함수를 호출하고 처음 곱한 수를 다시 나누면 됨.

let num = 1.23456;

alert( Math.floor(num * 100) / 100 ); // 1.23456 -> 123.456 -> 123 -> 1.23

2. 소수점 n 번째 수까지의 어림수를 구한 후 이를 문자형으로 반환(toFixed()).

📃 소수점 두 번째 자리 숫자까지만 남기고 싶은 경우, 숫자에 100 또는 100보다 큰 10의 거듭제곱 수를 곱한 후, 원하는 어림수 내장 함수를 호출하고 처음 곱한 수를 다시 나누면 됨.

let num = 12.34;
alert( num.toFixed(1) ); // "12.3" ✏️ toFixed 는 가장 가까운 값으로 올림, 내림 해줌.

let num = 12.36;
alert( num.toFixed(1) ); // "12.4" ✏️ toFixed의 반환값이 문자열이라는 사실을 주의.

let num = 12.34;
alert( num.toFixed(5) ); // ✏️"12.34000", 소수부의 길이를 5로 만들기 위해 0이 추가됨.



부정확한 계산

📃 숫자를 저장하려면 정확히 64비트가 필요함, 그 중 52비트는 숫자, 11비트는 소수점 위치, 1비트는 부호 저장.
그런데 숫자가 너무 커지면 공간이 부족해서 infinity로 처리.

alert( 1e500 ); // Infinity

(ex)

alert( 0.1 + 0.2 == 0.3 ); // false

alert( 0.1 + 0.2 ); // 0.30000000000000004

alert( 0.1.toFixed(20) ); // 0.10000000000000000555

let sum = 0.1 + 0.2;
alert( +sum.toFixed(2) ); // 0.3

alert( (0.1 * 10 + 0.2 * 10) / 10 ); // 0.3
alert( (0.28 * 100 + 0.14 * 100) / 100); // 0.4200000000000001



isNaN과 isFinite

  • Infinity 와 -infinity : 그 어떤 숫자보다 큰 혹은 작은 특수 숫자 값.
  • NaN : 에러를 나타내는 값.
    ✏️ 두 특수한 숫자는 숫자형에 속하지만 정상적이지 않기에, 정상적인 숫자와 구분하는 함수가 존재.

📃 is NaN(value) : 인수를 숫자로 변환한 다음 NaN인지 테스트함.

alert( isNaN(NaN) ); // true
alert( isNaN("str") ); // true

굳이 이 함수가 필요할까 ? 그냥 "===NaN" 으로 비교하면 되지 않을까 ?
🤦 응 ~ 안됨, NaN은 자기자신을 포함하여 그 어떤 값과도 같지 않음.

alert( NaN === NaN ); // false

📃 isFinite(value) – 인수를 숫자로 변환하고 변환한 숫자가 NaN/Infinity/-Infinity가 아닌 일반 숫자인 경우 true를 반환함.

alert( isFinite("15") ); // true
alert( isFinite("str") ); // false, NaN이기 때문입니다.
alert( isFinite(Infinity) ); // false, Infinity이기 때문입니다.



parselnt와 parseFloat

📃 Number()를 사용하면 규칙이 꽤 엄함, 피연산자가 숫자가 아니면 형 변환 실패함.

alert( +"100px" ); // NaN

✏️ 이럴 때 숫자만 뽑기 위해서 만들어짐.
(ex)

alert( parseInt('100px') ); // 100
alert( parseFloat('12.5em') ); // 12.5

alert( parseInt('12.3') ); // 12, 정수 부분만 반환됩니다.
alert( parseFloat('12.3.4') ); // 12.3, 두 번째 점에서 숫자 읽기를 멈춥니다.

✏️ 두 함수는 불가능할 때까지 문자열에서 숫자를 ‘읽어버림’, 숫자를 읽는 도중 오류가 발생하면 이미 수집된 숫자를 반환,
parseInt는 정수, parseFloat는 부동 소수점 숫자를 반환.

parseInt(str, radix)의 두 번째 인수
parseInt()의 두 번째 매개 변수는 선택적으로 사용할 수 있습니다. radix는 원하는 진수를 지정해 줄 때 사용합니다. 따라서 parseInt를 사용하면 16진수 문자열, 2진수 문자열 등을 파싱할 수 있습니다.

alert( parseInt('0xff', 16) ); // 255
alert( parseInt('ff', 16) ); // 255, 0x가 없어도 동작합니다.
alert( parseInt('2n9c', 36) ); // 123456



기타 수학함수

Math.random() : 0과 1사이 난수를 반환 (1제외.)

alert( Math.random() ); // 0.1234567894322
alert( Math.random() ); // 0.5435252343232
alert( Math.random() ); // ... (무작위 수)

Math.max(a, b, c...) / Math.min(a, b, c...) : 인수 중 최대/최솟값을 반환합니다.

alert( Math.max(3, 5, -10, 0, 1) ); // 5
alert( Math.min(1, 2) ); // 1

Math.pow(n, power) : n을 power번 거듭제곱한 값을 반환.

alert( Math.pow(2, 10) ); // 2의 10제곱 = 1024
profile
프론트엔드 개발자 이형준입니다.

0개의 댓글