믹아의 개발일기

bool 값으로 정렬해보자.

const booleanArray = [true,false,false,true,false,true,false,true];

booleanArray.sort((a,b) => a === b ? 0 : a? 1 : -1);
// [false, false, false, false, true, true, true, true]

booleanArray.sort((a,b) => a-b);
// [false, false, false, false, true, true, true, true]

// --------------------------------------------------------------------------

booleanArray.sort((a,b) => a === b ? 0 : a? -1 : 1);
// [true, true, true, true, false, false, false, false]

booleanArray.sort((a,b) => b-a);
// [true, true, true, true, false, false, false, false]

요새 javascript 알고리즘 문제 풀고 있는 사이트에서 문제가 올라왔는데

min 값과 max 값의 사이를 오가는 숫자를 구하는 문제였다

yeu.kr/Ptkt6

unity 에선 Mathf.PingPong(float, length) 함수로 쉽게 구할 수 있었는데 js에서는.. 아마 없는듯?

오르는 중인지 내려가는 중인지 bool 값으로 할 수 있었는데 그냥 구현해보고 싶었다

// value 를 넣으면 min, max 값을 오가는 값을 리턴 하는 함수

const pingpong = (min,max, value) => {
      // 0을 기준으로 값을 맞춰준다
      const normalizeMin = 0;
      const normalizeMax = max - min;
      const normalizeVal = value - min;
    
      // 값 차이를 2배 해준다
      const max2 = (normalizeMax - normalizeMin) * 2;
      
      // 현재 들어온 값을 위에서 구한 max2 값의 나머지 계산을 해준다
      // 즉 현재 값이 max 보다 큰지 작은지 알 수 있게 해준다
      const overVal = normalizeVal % max2;

      // overVal 값이 Max 값 보다 
      // 작은 경우(숫자가 커지는 경우) ? 정규화 전 min 값 + overVal 한다
      // 큰 경우 (숫자가 작아지는 경우) : 정규화max 보다 초과한 수를 max 에서 빼준다
      return overVal <= normalizeMax 
         ? min + overVal
         : max + (normalizeMax - overVal)
     }
   
  

확인

yeu.kr/nv8h4#js

1. 라즈베리 파이 ssh 에서 vncserver -geometry 1920x1080 입력 (해상도는 마음대로)

$ vncserver

// geometry 옵션으로 해상도 설정가능
$ vncserver -geometry 1920x1080

그럼 하단에 나는 192.168.0.13:2 VNC 접속 주소가 주어졌다.

원래 1번포트부터 줄텐데 글쓰느라 한번 더 명령어를 입력해서.

2. VNC 뷰어로 저 주소에 접속 시도한다.

www.realvnc.com/en/connect/download/viewer/

나는 이 프로그램을 썼는데 이상하게 다른 프로그램으론 접속이 안되더라.. 더 알아봐야할듯

아까 주소로 접속 시도

라즈베리 파이 계정명과 패스워드를 입력한다

접속확인

재부팅하면 1번부터 다시 진행해야함.

이번 6일에 프로그래머스에서 데브매칭 과제 테스트를 진행했다.

저번에 친 카카오커머스 과제 테스트과 똑같은 조건으로 바닐라 자바스크립트로, 다른 모듈은 사용 불가다.

그리고 처음으로 캠을 켜고 진행했는데 스마트폰을 옆에 두고 무릎쪽과 모니터가 보이게 찍어야했다. 그리고 듀얼모니터라도 하나의 모니터만 사용해서 진행해야 했다.

대략 과제 테스트의 후기를 작성하자면..

요구 기능은 쉽게말해서 우리가 흔히 쓰는 파일 탐색기의 기능을 구현하는 것이었다.

주어진 API를 호출하면 현재 디렉토리의 파일 리스트를 가져오고 그 파일 리스트들로 폴더인지, 파일(이미지)인지 렌더링하고, 폴더면 해당 폴더의 id를 이용하여 API 를 호출하여 또 폴더의 내용을 렌더링 하는 방식..

로딩 모달을 이용하여 API 호출간 로딩모달 띄우기,

이미지 파일을 클릭하면 이미지 모달을 띄우고 모달 외부(검은색 부분... 명칭이 기억이 안남)를 누르거나 ESC 버튼을 누르면 모달창이 꺼지게 하기.

root 디렉토리가 아니면 뒤로 돌아가기 버튼 생성.

그 외에 가산점 문제도 있었는데.

위의 사진과 같이 바탕 화면을 누르면 바탕 화면의 경로로 돌아가는 기능,

해당 디렉토리의 정보를 캐싱하여 다시 해당 폴더에 접근할 때 api를 다시 호출을 안하도록 하는 것들이 있었다.

이번 테스트는 그럭저럭 만족스럽게 쳤다. 저번 카카오커머스 테스트와는 달리 일단 파일 탐색기라는 우리에게 익숙한 기능을 구현하는 것 이었고, 2번째 과제테스트니깐 더 수월하게 진행 할 수 있었다.

다만 모달 클래스를 2개(이미지, 로딩) 따로 나눠서 모달창을 켜고 끄는 코드가 중복 작성 되었는데 하나의 모달 클래스를 이용하여 상속받아서 2개의 모달창을 만들었다면 더 좋지 않았을까...하는 후회가 남는다. 15분 정도 남았었는데 Javascript 에서 상속을 써본적이 없어서 괜히 상속해보려다가 기능도 완성 못할 것 같은 두려움 때문에 그냥 안전하게 제출하기로 했다..

아무튼 재밌는 과제 테스트였다. 과제 테스트에 참여하지 못했다면 한번 쯤은 만들어 보는게 어떨까 생각이 든다.

21.04.16 추가

programmers.co.kr/skill_check_assignments/100

프로그래머스에서 해당 과제를 공개했다. 여기서 풀어볼 수 있다

switch (foo) {
	case 1 :
    	let bar = 1;
        break;
    case 2 : 
    	let bar = 2;
        break;
}

위와 같이 작성하면 bar 가 이미 선언되었다고 오류가 날 것 이다.

switch (foo) {
	case 1 : {
    	let bar = 1;
        break;
    }
    case 2 : {
    	let bar = 2;
        break;
    }
}

{} 로 감싸서 해결하자