전체 글
-
JS - attribute와 property 차이점개발 2022. 3. 10. 00:00
학습자료: Front End Interview Handbook "attribute"와 "property"의 차이점은 무엇인가요? 사전적 정의 🍳 attribute 1. [동사] (~을 …의) 결과로[덕분으로] 보다 2. [동사] (특히 말글그림 등을) …것[탓/책임]이라고 보다[말하다] 3. [명사] 자질, 속성 🍳 property 1. [명사] 재산, 소유물 (→ intellectual property, lost property, public property) 2. [명사] 부동산 3. [명사] 건물, 건물 구내 코드 예시 네이버 const obj = { a: '2022' } obj.a // '2022' attribute는 HTML 마크업에 정의되지만 property는 DOM에 정의된다. 차이점을 설명..
-
TIL - 차세대 프론트엔드 개발 툴 Vite에 대해 알아보자개발 2022. 3. 7. 23:18
더보기 본 포스팅은 Vite 공식문서의 내용 그대로이며 개인 학습목적으로 정리한 내용입니다. (https://vitejs-kr.github.io/guide/why.html#slow-server-start) 차세대 프론트엔드 개발 툴 Vite 사전 필요 지식 ESM (ECMAScript Module) ES6부터 추가된 자바스크립트 모듈 기능으로 이러한 모듈 기능은 처음 JS는 모듈로 가져오거나 내보내는 방법이 없어, 하나의 파일에 모든 기능을 담아야 했기때문에 프로그램을 모듈로 개발하고, 배포할 수 있게 하기 위하여, CJS, AMD, UMD, ESM이 탄생하게 되었다. Esbuild (https://velog.io/@joyact/esbuild) (Esbuild 내용의 정리는 링크로 대체하며, 다음에 시간..
-
JS - Promise.all / Promise.race (feat. iterable/iterator)개발 2022. 3. 6. 22:36
사전 필요 지식 Iterable 내부 요소들을 공개적으로 탐색(반복) 할 수 있는 데이터 구조 // 대표적인 이터러블 객체 const arr = ['a', 'b', 'c'] const set = new Set(['a', 'b', 'c']) const map = new Map([[false, 'no'], [true, 'yes'], ['well', 'soso']]) const str = '문자열 또한 이터러블하다' 이터러블한 데이터 구조는 프로토타입으로 [Symbol.iterator] 메서드가 존재하는 모든 개체를 말한다. // [Symbol.iterator] 메서드가 존재하지 않는 경우 === 유사배열 const obj = { 0: 1, 1: 2, 2: 3, length: 3 } console.dir(ob..
-
JS - 계산 오류 이해하기개발 2022. 3. 5. 22:49
피연산자들이 소수점(floating point)을 가진 경우 발생하는 오류 대표 사례 let a = 0.1; let b = 0.2; console.log(a + b) // 0.30000000000000004 변수 a와 b에는 각각 0.1, 0.2의 값이 할당되어 있다. 당연히 0.3으로 console 출력을 예상하겠지만 출력 결과는 0.30000000000000004로 오차가 발생한다. 피연산자들이 정수인 경우 발생하는 오류 let a = 999999999999999; console.log(a); // 999999999999999 (15자리) let b = 9999999999999999; console.log(b); // 10000000000000000 (16자리) 자바스크립트의 정수는 16자리를 넘어가..
-
JS - Generator개발 2022. 3. 4. 21:21
Generator 소개 중간에서 멈췄다가 이어서 실행 할 수 있는 함수 function 키워드 뒤에 * 를 붙여 표현하며, 함수 내부에는 yield 키워드를 활용한다. 함수 실행 결과에 대해 next() 메소드를 호출 할 때마다 순차적으로 제너레이터 함수 내부의 yield 키워드를 만나기 전까지 실행하고, yield 키워드에서 일시정지한다. 다시 next() 메소드를 호출하면 다음 yield 키워드를 만날 때까지 함수 내부의 내용을 진행한다. 선언방식 function* gene() { console.log(1) yield 1 console.log(2) yield 2 console.log(3) yield 3 } const gen = gene() const gene = function* () { yield ..
-
TIL - 메타인지개발 2022. 3. 4. 02:32
메타인지적지식이란 무언가를 배우거나 실행할 때 내가 아는것과 모르는 것을 정확히 파악 할 수 있는 능력이다. 20일 가량 총 여섯군데의 회사에 면접을 진행했다. 그 중 세곳에 오퍼를 받았고 나머지 세곳은 탈락했는데, 내가 왜 나머지 회사에서 탈락했는지 돌이켜 보고 점검해보고자 한다. 위 피드백은 가장 면접 질문의 난이도가 높았고 그만큼 어려웠던 회사의 면접 피드백이다. 내용을 간략히 요약하자면, 좋게 평가된 부분 - 커뮤니케이션 능력 - UI/UX 중시하는 사고 - 문제 해결 능력 아쉬웠던 부분 - 메타인지가 정확히 되지 않는점 - 알고 있다고 생각하는 개념에 대해 얼마나 확신을 갖고 있는지 아쉬웠던 부분의 모든 내용이 메타인지가 제대로 되지 않아 면접 질문에 대한 설명이 미약하거나 틀리게 답을 했던게 ..