180920 TIL Lec2 학점계산기 step1
Sep 20, 2018
»
1막,
TIL (Today I Learned)
알고리즘
같은 숫자는 싫어
if(!arr[i] === arr[i+1]){answer.push;} --> 연속적으로 겹치는 숫자 제거
if(arr[i] === arr[i+1]){answer.push;} --> 연속적으로 겹치는 숫자 추출
- 어려웡…
- 오늘부터 알고리즘 스터디를 하기로 했다. (with Dail & Head) 매일 1문제 업로드해서 푸쉬하고 일주일에 2번 만나기!
step1 리팩토링
- destructuring
- 수정 전
function getValues(data) {
const values = {};
values.grossCredits = calculateCredits(data)[0];
values.grossMajorCredits = calculateCredits(data)[1];
values.grossPoints = calculatePoints(data)[0];
values.grossMajorPoints = calculatePoints(data)[1];
values.gpa = (values.grossPoints / values.grossCredits).toFixed(2);
values.mgpa = (values.grossMajorPoints / values.grossMajorCredits).toFixed(2);
return values;
}
- 수정 후
function getValues(data) {
const values = {};
const elements = [calculateCredits(data)[0], calculateCredits(data)[1], calculatePoints(data)[0], calculatePoints(data)[1], parseFloat((calculatePoints(data)[0] / calculateCredits(data)[0]).toFixed(2)), parseFloat((calculatePoints(data)[1] / calculateCredits(data)[1]).toFixed(2))];
[values.grossCredits, values.grossMajorCredits, values.grossPoints, values.grossMajorPoints, values.gpa, values.mgpa] = elements;
return values;
}
- 여전히 깔끔해보이진 않지만…
- ’+’ 안쓰고 결과물 출력
- 수정 전
function gpaCalculator(scale){
let result = "";
const values = getValues(data);
result = '4.5 기준: 총 평점 = ' + values.gpa + ' 전공 평점 = ' + values.mgpa + '\n' +
scale.toFixed(1) +' 기준: 총 평점 = ' + ((values.gpa)*(scale/4.5)).toFixed(2) + ' 전공 평점 = ' + ((values.mgpa)*(scale/4.5)).toFixed(2) + '\n' +
'이수 학점: ' + values.grossCredits + '\n' +
'전공 이수 학점: ' + values.grossMajorCredits;
return result;
}
- 수정 후
const template = `
4.5 기준: 총 평점 = ${values.gpa} 전공 평점 = ${values.mgpa}
${scale.toFixed(1)} 기준: 총 평점 = ${((values.gpa) * (scale / 4.5)).toFixed(2)} 전공 평점 = ${((values.mgpa) * (scale / 4.5)).toFixed(2)}
이수 학점: ${values.grossCredits}
전공 이수 학점: ${values.grossMajorCredits}`
return template;
}
let result = gpaCalculator(4.5);
console.log(result);
- ` (백틱)과 $를 사용하여 플러스 기호를 안쓰고 아주 조금 깔끔하게(?) 정리하였다.
동기 비동기 뽀개기
-
동기(synchronous): 동기적인 흐름은 순서대로 실행된다. 순서 바뀔 수 없음. 순!차!적!으로 일을 끝낸다.
-
비동기(asynchronous): 해야 할 일을 위임하고 기다리는 방식
-
비동기 예시
const baseData = [1,2,3,4,5,6,100];
const asyncRun = (arr, fn) => {
arr.forEach((v,i) => {
setTimeout(() => {
setTimeout(() => {
console.log("cb 2");
fn(i)
},1000);
console.log("cb 1");
}, 1000);
});
}
asyncRun(baseData, idx =>console.log(idx))
1. asyncRun()->forEach()->첫번째 setTimeout()(또다른 setTimeout() + "cb1")순으로 콜스택에 쌓인다.
2. 첫번째 setTimeout()덩어리는 콜스택에 들어오자마자 바로 API로 넘어가 실행된다.
3. forEach()가 실행되면서 첫번째 setTimeout()덩어리가 7번 API로 넘어가고 각각 1초 뒤에 콜백 큐로 넘어온다.
4. forEach()실행이 끝나고 asyncRun()도 실행이 끝났으므로 콜스택이 비어있다. 그러므로 콜백큐에 있던 setTimeout() 덩어리가 넘어와 콘솔에 찍힌다.
5. 이때 두번째 setTimeout()이 순서상 위에 있기 때문에 setTimeout() 1번 보내고 - "cb1" 찍히고 - setTimeout() 1번 보내고 - "cb1" 찍히고 7번 반복
6. setTimeout()이 API에 넘어가서 1초마다 "cb 2"와 fn(i)를 콕백 큐에 보내준다.
7. "cb 1"을 console.log에 7번 다 찍은 후엔 콜스택이 비어있으므로 콜백 큐에 있던 "cb 2"와 fn(i)가 콜스택으로 넘어온다.
8. "cb 2" 다음 fn(i)이므로 "cb 2" -> 0 -> "cb 2" -> 1 ...
순으로 console.log()에 찍힌다.
결과물
- 다른 분들이 도와줘서 여기까진 이해했는데, 앞에서 발표하다가 쓰러질뻔;;
9/19 (Wed) DONE
에꼴 42 다큐 시청알고리즘 수업(10:30-12:30)Step 1 PR feedback 반영하여 수정
9/20 (Thu) To-Do
- 알고리즘 1 문제
- step1 리팩토링 (안 써본 것 활용해보기: 1) `, $ 2) arrow fun() 3) … 등)
- step2 진행
- EJS CH.1 읽기