[JS] 숫자 데이터 (toFixed, .abs, .min, .max, .ceil, .floor, round, random)

숫자와 관련된 메소드도 알아보자.

.toFixed

소수점 자리가 너무 클때 원하는 소수점까지 제거 할수 있는 메소드다.

.toFixed(소수점에 몇 자리수까지 유지할건지)

const pi = 3.14159265358979
console.log(pi)

const str = pi.toFixed(2) //3.14

.toFixed 메소드를 사용하고나서 콘솔로그로 str 변수를 출력해보았다.

console.log(str) // 3.14
console.log(typeof str) // string

3.14가 잘 출력되는 것을 볼 수 있다.

그럼 이 데이터가 과연 숫자 데이터가 맞는지 typeof를 통해 

출력해 보았더니.....

string 값이 나왔다. 나는 3.14가 숫자데이터로 출력되길 원했는데..?

 

 

 

 

그때 사용할 수 있는것이

자바스크립트에서 제공하는 전역함수들이다.

예전에 타이머함수에 대해서 포스팅 한 적이 있는데,

그때 예시로 들었던 전역함수 

setTimeout, setInterval, clearTimeout, clearInterval이 있었다.

(전역(Global)함수들은 자바스크립트에서 어.디.서.든 사용할 수 있다.)

 

숫자와 관련된 전역함수로는 parseInt, parseFloat가 있다.

parseInt() = 파스는 분석한다는 의미고, 인트는 인티져라는 정수를 의미한다.

() 부분에 인수로 숫자가 들어있는 문자데이터를 넣게 되면 

거기서 숫자만 추출해서 숫자데이터가 출력된다.

const integer = parseInt(str)
console.log(integer) //3

parseFloat() = 소수점 자리의 숫자도 유지하면서 문자데이터를 숫자로 변환해준다.

const float = parseFloat(str) 
console.log(float) //3.14

혹시 모르니 데이터 타입을 출력해보자.

console.log(typeof integer, typeof float) // number number

성공이다.

 

 

 

---

숫자 객체 메소드

 

자바스크립트에서 사용할수있는 Math라는 수학객체에 대해서도 알아보자.

mdn 문서에서 math를 살펴보면..

Math는 수학적인 상수와 함수를 위한 속성과 메소드를 가진

내장 객체입니다. 함수 객체가 아닙니다.

여기서 내장객체라는것은 자바스크립트에 이미 들어있는 하나의 객체인 것이고, 

math라는 객체는 숫자데이터를 활용해서 수학적인 연산을 해주는

여러가지 메소드들을 포함하고 있다.

(자바스크립트의 전체 영역에서 쓸 수 있는 객체테이터!)

 

 

Math.abs()

abs는 absolute 단어의 약어로 절대적인 값을 의미하는데주어진 숫자의 절대값을 반환한다.여기서 절대 값이라는것은 숫자 -1이있으면 음수를 제외한숫자 값 1로 바꿔주고 -99면 마이너스를 제외한 99로 반환해주는 역할을 한다.

console.log('abs:', Math.abs(-12)) //12

  

Math.min()

인수로 들어 온 숫자데이터중에 가장 작은 값이 출력됨.

console.log('min:', Math.min(2, 8)) //2

 

Math.max()

인수로 들어 온 숫자데이터중에 가장 큰 값이 반환.

console.log('max:', Math.max(2, 8)) //8

 

Math.ceil()

올림처리 (기본적으로 자바스크립트는 정수단위로 올림처리함)

console.log('ceil:', Math.ceil(3.14)) //4

 

Math.floor()

내림처리 

console.log('floor:', Math.floor(3.14)) //3

 

Math.round()

반올림

console.log('round:', Math.round(3.14)) //3

 

Math.random()

무작위로 랜덤한 숫자를 반환해줌.

console.log('random:', Math.random())

그럼 예전에 만들어본 랜덤함수를 한번 이해해보자. 

export default function random() {
  return Math.floor(Math.random() * 10)
}

export와 default를 통해, 자바스크립트 함수 밖으로 내보내기를 하는데

랜덤이라는 함수를 만들어서 안에 로직을 작성했었다.

(랜덤함수와는 관련없는 내용)

리턴에는 math라는 수학객체가 사용되어 있고,

위에서 배운대로 floor라는 메소드는 인수로 들어온 숫자데이터를

내림처리하는 메소드였다. 그럼 floor메소드의 인수 내용으로는 

리턴에는 math라는 수학객체가 사용되어있고,

위에서 배운대로 floor라는 메소드는 인수로 들어온 숫자데이터를 내림처리하겠다.

라는 뜻이였다. 그럼 floor메소드의 인수의 내용으로는 

math부분에 랜덤이라는 메소드가 실행이 되고,

거기서 무작위의 난수가 나올 것이고

그 난수에 곱하기 10을 해서 내림처리를 한다는 것이다.

그리고 0~9까지의 랜덤한 숫자를 함수로 실행해서 얻을 수 있다.

 

결국, 랜덤함수는 0.053252141421421...이런식으로 랜덤한 난수를 

반환하는데 floor메소드를 사용해서 소수점 뒷부분을 날려주니까

0~9까지의 숫자들이 랜덤하게 반환이 된다는 것이다.