[Javascript] 오름차 / 내림차 정렬 만들기

Beom J·2021년 4월 21일
0

Javascript

목록 보기
1/5

네? Java랑 아무 관련이 없다구요?

이름에 java가 들어가길래 당연히 java의 파생 개념이겠거니... 생각했다.
심지어 막상 배우기 시작했더니 java에서 배웠던 (겉핥기지만) 내용이 상당히 겹치는데!
당연히! 파생 언어겠거니! 했더니!!

풍마 : 원래 이름은 ECMAScript고, 신생때 마케팅용으로 java를 붙인거야
나 : 아... 어그로라고?

정말..... 사실인가...?

아무튼 - Javascript !

일단, 오늘로 국비 라이프 7일차!
5일차부터 JS를 배우고 있는데, 다행히 대부분 java를 통해 어느정도 익숙해진 내용이 많이 나와서, 수업 따라가기가 조금 수월하다.... 고 생각하자 마자 HTML, CSS랑 짬뽕 할 일만 생기면 바로 뇌정지가 온다 ㅠ

원래대로면 아직 앞전에 배운 내용들을 정리해야 하지만...
우선 오늘 배운게 머릿속에 있을때 오늘거라도 일기를 써두는게 좋을 것 같아서 전략을 바꿨다.

오늘은 배열과 함수에 대해 배웠는데,
1. 구구단
2. 숫자 비교해서 큰 수 반환
3. 오름차/ 내림차 정렬
이렇게 세가지 종류를 직접 코드 짜서 쌤꺼랑 비교해보는 시간을 가졌다.

그 중 3. 오름차/내림차는 과제로 내주셔서 수업 끝나고 만들어보고,
내가 짠 코드를 토대로 풍마가 한번 더 만져줘서 수정한 내용을 정리하려고 한다!

오름차/ 내림차 정렬

내가 짠 코드

 // 오름차순
        const sortNumberUp = (arr, sortType) => {
            let len = arr.length;
            for (i=0; i<len; i++){
                for (j=i+1; j<len; j++){
                    if (arr[i]>arr[j]){
                        let max = arr[i];
                        arr[i]= arr[j];
                        arr[j]= max;
                    } else {
                        continue;
                    }
                }
            }
         console.log(arr);
        }

        //내림차순
        const sortNumberDown = (arr) => {
            let len = arr.length;
            for (i = 0; i < len; i++) {
                for (j = i + 1; j < len; j++) {
                    if (arr[i] < arr[j]) {
                        let max = arr[i];
                        arr[i] = arr[j];
                        arr[j] = max;
                    } else {
                        continue;
                    }
                }
            }
        console.log(arr);
        }

        sortNumberUp([100,70,20,60,20,30,200]);
        sortNumberDown([100, 70, 20, 60, 20, 30, 200]);

출력 결과
sortNumberUp : [20, 20, 30, 60, 70, 100, 200]
sortNumberDown : [200, 100, 70, 60, 30, 20, 20]

그래도 미우나 고우나 제일 나랑 많이 부닥쳐본 for & if 문으로 풀었다.
예전엔 배열에 참 손이 안가서 사용해 볼 생각도 못했었는데, 이제 쪼매 더 해봤다고 배열도 쓰고!
장하다 정혜자! 셀프 칭찬해~ ㅎㅎ

만들어 두고보니 오름차순이랑 내림차순의 코드 차이가 고작 '<,>' 요거 한 단어라...
이걸 함수 하나로 처리할 방법이 없을까 고민해봤다.
switch 를 써볼까 if를 더 늘릴까 한참...ㅠㅠ 끙끙거리다가
결국 풍마가 혜안을 제시해서 아래처럼 결과물이 나왔다!

풍마가 도와준 코드

const sortNumber = (arr, sortType) => {
            let len = arr.length;
            for (i=0; i<len; i++){
                for (j=i+1; j<len; j++){
                    const isAsc = sortType == 'asc';
                    const isSort = isAsc ? arr[i] > arr[j] : arr[i] < arr[j];
                    if (isSort){
                        let max = arr[i];
                        arr[i]= arr[j];
                        arr[j]= max;
                    } else {
                        continue;
                    }
                }
            }
         console.log(arr);
        }


        sortNumber([100,70,20,60,20,30,200],'asc');
        sortNumber([100, 70, 20, 60, 20, 30, 200], 'desc');

출력결과는 동일하지만 함수 하나로 오름차/ 내림차를 처리할 수 있게 됐다! (짝짝짝)
sortType 파라미터로 들어온 값이 'asc'와 일치할때와 아닐때, isAsc 변수에 대입되는 값으로 삼항연산자 처리를 했다.

처음에 삼항연산자를 배울땐 이걸...쓰나..? 했었고, 실제로 '자바의 정석'이나 '생활코딩'에선 거의 언급이 없다시피 넘어갔던 기억이라... 이렇게 획기적으로 쓰이는 걸 볼때마다 놀랍다.


마무리

진도를 나름 잘 따라가는 것 같아 뿌듯하면서도.... HTML+CSS+JS 짬뽕에서 버버벅 막힐때마다, 호기롭게 실행 버튼을 눌렀더니 뻘건 오류창이 뜰때마다... 아, 혹시 내길이 아닌데 우겨서 걷고 있나? 자존감이 좀 주춤하는 와중에 쌤이 명언을 하나 툭 던지셨다.

실력이 쌓이는 기분이 안든다고 주눅들지 말아요.
코딩 공부는 우상향 곡선이 아니라, 지지부진.. 횡보하는 것 같다가 어느순간 쭉 오릅니다.

선생님.. 주식하시죠?
저 감동받았잖아요 ㅠㅠㅠㅠㅠㅠ 결국 코딩은 코인 차트 같다는거죠?!
존버하면 언젠간 순환장이 와서 쏜다!!!!! 나라는 코인 떡상할때까지 존버!

profile
네..? 개발자요...? 아....직 일걸요...?

0개의 댓글