강의 출처 : The Complete JavaScript Course 2022 Jonas (Udemy)

Converting and Checking Numbers

console.log(23 === 23.0); //true  number is only one data type, is stored in binary form

//Base 10 - 0 to 9
//Binary base 2 - 0 to 1
console.log(0.1 + 0.2); //0.30000000000000004
console.log(0.1 + 0.2 === 0.3); //false

Conversion (string to number)

console.log(Number('23'));
console.log(+'23');

Parsing

parseInt, parseFloat => global functions
Number을 굳이 안붙혀도 되지만, 요즘은 붙혀서 적는 추세!

console.log(Number.parseInt('30px', 10)); //30 주의) 숫자로 시작해야함
console.log(Number.parseInt('30px', 2)); //NaN => binary
console.log(Number.parseInt('e23')); //NaN

console.log(Number.parseInt('  2.5rem')); //2

//console.log(parseFloat('  2.5rem')); //2.5 => old way

isNaN

Check if value is NaN. data type이 NaN인지를 확인한다.
console.log(Number.isNaN(20)); //false
console.log(Number.isNaN('20')); //false (just regular datatype)
console.log(Number.isNaN(+'20X')); //true
console.log(Number.isNaN(23 / 0)); // false datatype : Infinity

isFinite, isInteger

Checking if value is number. isNaN보다 더 쉬움. number인지를 확인.

console.log(Number.isFinite(20)); //true
console.log(Number.isFinite('20')); //false
console.log(Number.isFinite(+'20X')); //false
console.log(Number.isFinite(23 / 0)); //false

console.log(Number.isInteger(23)); //true
console.log(Number.isInteger(23.0)); //true
console.log(Number.isInteger(23 / 0)); //false

Math and Rounding

square root (제곱근)

console.log(Math.sqrt(25)); //5
console.log(25 ** (1 / 2)); //5
console.log(8 ** (1 / 3)); //2

max, min function

type coercion도 함. but not Parsing

console.log(Math.max(5, 18, 23, 11, 2)); //23
console.log(Math.max(5, 18, '23', 11, 2)); //23
console.log(Math.max(5, 18, '23px', 11, 2)); //NaN doesn't work

console.log(Math.min(5, 18, 23, 11, 2)); //2

Math.PI

console.log(Math.PI * Number.parseFloat('10px') ** 2); // Math.PI 원의 둘레와 지름의 비율.  반지름이 10.  파이 * 반지름의 제곱 = 구의 둘레
//314.1592653589793

Math.random

console.log(Math.trunc(Math.random() * 6) + 1); // 1 - 6 random number

max 와 min 사이의 random number 구하기

const randomInt = (min, max) => Math.floor(Math.random() * (max - min) + min);
// 0...1 -> 0...(max-min) -> min... max
console.log(randomInt(10, 20));

Rounding integers

type coercion 도 가능

console.log(Math.trunc(23.3)); //23

//반올림
console.log(Math.round(23.3)); //23
console.log(Math.round(23.9)); //24
//올림
console.log(Math.ceil(23.3)); //24
console.log(Math.ceil('23.9')); //24
//내림
console.log(Math.floor(23.3)); //23
console.log(Math.floor(23.9)); //23

console.log(Math.trunc(-23.3)); //23
console.log(Math.floor(-23.3)); //24

trunc는 단순히 소수점 뒤 부분을 다 지움. floor은 무조건 내림 역할. 음수일 때 둘의 차이가 있음.

Rounding decimals

toFixed => 항상 string return한다.

원리) number은 primitive type이므로 method가 없음. JS에서는 이 숫자를 behind the scene에서 Number Object로 옮김. 그리고 method 호출 작업 후 다시 primitive로 바꾼다.

console.log((2.7).toFixed(0)); //3
console.log((2.7).toFixed(3)); //2.700
console.log((2.345).toFixed(2)); //2.35
console.log(+(2.345).toFixed(2)); //2.35 number data type

Remainder Operator

console.log(5 % 2); //1
console.log(5 / 2); //5 = 2 * 2 + 1

console.log(8 % 3); //2
console.log(8 / 3); // 8 = 2 * 3 + 2

console.log(6 % 2); //0 even number

const isEven = n => n % 2 === 0;
console.log(isEven(8)); //true
console.log(isEven(23)); //false

labelBalance.addEventListener('click', () => {
  [...document.querySelectorAll('.movements__row')].forEach((row, i) => {
    if (i % 2 === 0) row.style.backgroundColor = 'orangered';
    if (i % 3 === 0) row.style.backgroundColor = 'blue';
  });
});

remainder는 every Nth time에 무언가를 해야할 때 사용하면 유용!

Numeric Separators

Numeric Separator => 숫자의 특정한 원하는 자리에 separator를 놓는다. => 숫자를 읽기 더 쉽게 만든다. but 숫자의 바로앞, 소수점 바로 앞 뒤는 안됌.

// 287,460,000,000
const diameter = 287_460_000_000;
console.log(diameter); //287460000000

const priceCents = 345_99;
console.log(priceCents); //34599

const transferFee1 = 15_00;
const transferFee2 = 1_500;
// 결국 둘다 같은 숫자.

console.log(Number('2300_00')); //NaN
console.log(parseInt('2300_00')); //2300

주의) Numberic Separators는 transferFee 와 같이 '코드 내'에 적을 때만 이용할 것.

Working with BigInt

console.log(2 ** 53 - 1); //9007199254740991  JS 내에서 표현할 수 있는 가장 큰 숫자
console.log(Number.MAX_SAFE_INTEGER); //9007199254740991

위보다 더 큰 숫자를 하려고 하면 정확도가 떨어진다. unsafe numbers

bigInt 표현하는 두가지 방법
1. 숫자 뒤에 n을 붙힌다.
2. 숫자를 BigInt()로 감싼다.

console.log(2342342342343242342342424234324242342n); // bigInt data type
console.log(BigInt(12313)); //12313n

Operations

console.log(10000n + 10000n); //20000n
console.log(234342354365462456426256425624262462n * 1000000000n);
//234342354365462456426256425624262462000000000n
// console.log(Math.sqrt(16n)) => doesn't work

 const huge = 13524353425426547654n;
 const num = 23;
 console.log(huge * num); // error => cannot mix BigInt and Other type!

const huge = 13524353425426547654n;
const num = 23;
console.log(huge * BigInt(num)); // 311060128784810596042n bigInt와 다른 데이터타입 계산시 꼭 bigInt함수를 붙혀줄 것!

Exceptions

console.log(20n > 15); //true
console.log(20n === 20); //false
console.log(typeof 20n); //bigint
console.log(20n == '20'); //true => type coercion

console.log(huge + ' is Really big!!');

Divisions

소수점 부분을 자동으로 자른다.

console.log(10n / 3n); //3n
console.log(10 / 3); //3.3333333333333335