본문 바로가기
Javascript

Refactoring - 양수값 구하기

by e-pd 2020. 9. 2.

 

Q. 들어온 값을 양수 문자열로 만드는 함수를 작성하시오. 음수가 들어왔을 경우 () 괄호로 묶어준다.

ex) 1 => '1', '-2' => ('2')

 

A.

1
2
3
4
5
6
7
8
function getAmount(n) {
    if (n < 0) {
        return '(' + Math.abs(n) + ')';
    } else if ( n >= 0) {
        return n.toString();
    }
}
 
cs

n이 값이 0보다 작으면  Math 함수 절대값 구하고 else if는 n값을 toString으로 변경했다.

평범하다고 생각할 수 있지만 다음 코드를 보고 생각해보자.

 

A.

1
2
3
4
5
6
7
function numberToAmountString(number) {
    if (number != null) {
        return `(${Math.abs(number)})`;
    } else {
        return number.toString();
    }
}
cs

함수명을 좀더 명확하게 바꾸었다. 매개변수로 들어오는 변수이름을 좀더 명확하게 바꾸었다.

null 체크를 추가했다. `(백틱)을 이용하여 템플릿 리터럴로 바꾸었다.

 

야호! 퇴근!

 

 

 

하지만 좀더 바꿔보자.

1
2
3
4
5
function numberToAmountString(number) {
    if (number === nullreturn;
    if (number < 0return `(${Math.abs(number)})`;
    return number.toString();
}
cs

사실 depth가 커질수록 코드를 이해하기 어려워진다. 에러 여부는 먼저 체크하고 로직을 정리하는것도 방법이다.

=== 을 이용하여 좀더 체크를 확실하게 했다. null일 경우 해당함수에서 처리를 하지않게 했다.

 

 

 

다음은 생각해볼 점이다. 

1. 템플릿 리터럴과 현실과의 타협. 아직 IE는 건재한다.

   내 마음대로 es6이상 문법을 못쓰는 현실이 있다...ie 쓰지말고 마소 엣지씁시다 ㅠ

2. 메서드 명에서 자료형을 표현한점. 자료형을 나타내는게 좋은 방법일까?

3. if문 뒤에 {}을 생략해도 될까.

'Javascript' 카테고리의 다른 글

구조 분해 할당  (1) 2020.09.07
Data 속성 하나를 잡아서 이벤트를 주기  (0) 2019.12.16
이미지 파일만 등록이 가능합니다  (0) 2019.10.08
element, source  (0) 2019.09.30
JS minified ?  (0) 2019.09.30