우아한 테크코스26 레벨1 - 점심 뭐 먹지 피드백 1. 파일 네이밍을 할 때 2 depth가 같은 네이밍이 들어가는 경우를 지양하자 파일과 디렉터리의 이름이 같으면 모호성이 생겨 개발자가 프로젝트를 탐색하기가 더 어려워질 수 있다. "type.ts"라는 파일이 "type"이라는 디렉터리에 존재하는 경우, 파일이 "type" 디렉터리에서 사용되도록 의도된 것인지 아니면 별도의 엔티티인지 명확하지 않게 된다. 혼란을 방지하고 프로젝트 내에서 파일을 더 쉽게 찾을 수 있도록 하기 위해 같은 네이밍은 지양하자. 2. Type 강제 as로 타입을 강제하는 것은 좋지 않다. 타입스크립트에게 '내가 더 잘 알아!'하고 강제하는 행위에 가깝다. 이는 타입스크립트의 보급과 개발자의 유연한 상황 그리고 런타임 환경 대응을 위해 일부 불건전한 타입 선언을 허용하는 경우라고.. 2023. 4. 3. 레벨1 - 로또 게임 피드백 1. export {... }와 export default {... } export default: export한 이름과 상관없이 원하는 이름으로 import 가능, import 시 중괄호 작성 필요 없음 export : export한 이름으로만 import 가능, import시 중괄호로 가져와야 함 2. 성공 케이스와 실패 케이스 모두 테스트하자 성공 케이스의 경우 코드가 의도한 대로 작동하는지 확인하는 데 도움이 된다. 반면 실패 케이스의 경우 잠재적인 문제를 식별하는 것에 도움이 된다. 다양한 시나리오에서 올바르게 작동하는지 확인하면 안정성을 향상하는데 도움이 되며, 나중에 문제가 발생하지 않도록 미리 방지할 수 있다. 3. CSS Bold 일반적으로 400은 regular, 500은 medium,.. 2023. 4. 3. 레벨1 - 자동차경주 피드백 1. 네이밍을 할 때는 축약형을 지양하자 네이밍을 할 때 대부분의 사람들에게 축약된 단어가 더 익숙한 경우를 제외하고는 줄여 쓰지 않는다. 좋은 코드는 짧은 코드가 아닌, 읽기 좋은 코드이다. 미래의 나와 다른 개발자를 위해 작성한다고 생각하고 네이밍을 하자. 2. 재사용을 고려하자 static randomValue() { return Math.floor( Math.random() * (UTIL_NUMBER.CAR_RANDOM_MAXIMUM_NUMBER + 1) ); } 위 함수는 랜덤 한 값을 뽑아낸다. 그러나 UTIL_NUMBER.CAR_RANDOM_MAXIMUM_NUMBER라는 도메인 정보를 알고 있어 사실상 정해진 범위(여기서는 MAXIMUM_NUMBER인 9)의 랜덤 값을 뽑아내는 것을 알 수 .. 2023. 4. 3. 비동기 퀴즈 Q1. 왜 1->3->2 순으로 출력되는지 설명하시오. console.log("1"); setTimeout(() => console.log("2")); new Promise((resolve) => resolve()).then(() => { console.log("3"); }); A. 먼저, '스크립트' 태스크가 태스크 큐에 들어간다. 태스크 큐에서 이벤트 루프가 console.log('1')을 콜스택에 넣고 실행시킨다. setTimeout이 콜스택으로 가고 Wep API가 이를 받아서 타이머를 실행시킨다. 타이머가 끝난 후 setTimeout의 콜백함수를 태스크 큐에 넣는다. promise가 콜스택으로 가고, 콜백 함수를 마이크로 태스크 큐에 넣는다. 이벤트루프가 마이크로 태스크 큐에서 가장 오래된 태스.. 2023. 3. 20. HTML의 자식 요소 제거 방식 어떻게 요소를 제거하세요? 미션을 진행하면서 요소를 제거해야 할 일이 종종 있다. innerHTML을 이용해 해당 요소를 제거하는 것이 보편적인 방법이지만 이번에 새로운 방법을 알게 돼 이에 대해 소개하고, innerHTML로 제거하는 것과의 차이점을 이야기해보려고 한다. innerHTML과 removeChild 먼저 자주 사용하는 innerHTML로 요소를 제거하는 방법은 이와 같다. target.innerHTML = ‘’; 반면, 새로운 방법은 while문을 사용해 첫 번째 자식이 없을 때까지 지우는 방식이다. 코드로 보면 이런 모습이다. while(target.firstChild){ target.removeChild(target.firstChild); 이번 미션에서는 레스토랑 리스트를 업데이트할 때.. 2023. 3. 20. innerText와 textContent의 차이 innerText 숨겨진 요소의 텍스트는 반환하지 않습니다. 사람이 읽을 수 있는 요소만 처리하죠. innerText의 값을 읽으면 최신 계산값을 반영하기 위해 리플로우가 발생합니다. 텍스트가 최종적으로 렌더링 된 모습이라고 생각하시면 됩니다. textContent 노드의 모든 요소를 반환합니다. 'script'와 'style' 요소를 포함한 모든 요소의 콘텐츠를 가지고 옵니다. 태그와 상관없이 해당 노드가 가지고 있는 text라고 생각하시면 됩니다. 코드로 살펴보기 Hello Secret console.log(document.querySelector('.greeting').innerText); //Hello console.log(document.querySelector('.greeting').textC.. 2023. 3. 20. 이전 1 2 3 4 5 다음
