프론트엔드 개발/JS & TS(10)
-
코드조각: 중복없이 아이템 랜덤뽑기 (Array에서 n개 꺼내기)
여러 아이템이 들어있는 Array에서 아이템을 랜덤으로, 그리고 중복없이 n개 뽑아내는 로직입니다. array를 ['a', 'b', 'c', 'd', 'e'], cnt를 3으로 하면 ['c', 'b', 'a'] 등의 식으로 랜덤으로 뽑습니다. 단, ['c', 'b', 'c'] 와 같이 중복되는 값은 나오지 않습니다. 요새 TypeScript를 사용해서 TS로 짜봤습니다. 자세한 코드는 아래를 참고하세요. 혹시 JavaScript 버전을 원하시면 댓글로 알려주세요. /** * @param array 아이템 리스트 * @param cnt 뽑을 아이템 개수 * @returns 랜덤으로 추출된 아이템 리스트 */ const getItemRandomly = (array: any[], cnt: number): an..
2023.12.10 -
Promise 정리: async/await 사용법 & then과의 차이
서비스 개발을 하다보면 비동기적으로 개발해야 할 일이 많습니다. JavaScript에서는 과거 callback 함수를 통해 비동기를 구현하곤 했으나 요즘에는 Promise 객체를 반환하게 하여 async와 await로 작업이 완료되면 다음 로직이 진행되게끔 지연시키는 방식을 통해 비동기를 구현하곤 합니다. 최근 회사에서 앱을 개발하면서 한번 사용하는 방법을 간단하게 정리해봤습니다. (Promise 객체 자체에 대해서는 developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Using_promises 이 링크를 참고하세요.) Promise 객체를 반환하게끔 작성한 함수를 호출할 땐 함수명 앞에 await 키워드를 붙이고 호출하면 해당 작업이 완료되고 나서야 이후 코드가 ..
2021.04.11 -
JS 기술면접 스터디 6주차: immutable 객체부터 이벤트 루프까지
기술면접 스터디 5주차에 이어 6주차를 진행하고 관련 내용을 정리합니다. 이전의 내용이 궁금하시다면 다음을 클릭해주세요. 1주차: 이벤트 위임부터 코드구성까지 2주차: 호스트 객체부터 Ajax까지 3주차: 호이스팅부터 이벤트 버블링까지 4주차: 전역스코프부터 Promise까지 5주차: Math.max()부터 프로토타입 기반 상속까지 이번 글은 지난 1~4주차 글들처럼 다르게는 front-end-interview-handbook의 질문을 다루며, 이 글은 스터디 내용을 복기하고 정리하는 글로 아주 상세한 기술내용을 담고 있진 않습니다. 관련해서는 이후에 따로 정리할 계획입니다. 6주차 질문은 Math.max()와 Math.min(), 컴퓨터가 다루는 소수, 지멋대로의 진법 변화, 함수 표현식과 선언식의 차..
2019.12.30 -
JS 기술면접 스터디 5주차: Math.max()부터 프로토타입 기반 상속까지
기술면접 스터디 4주차에 이어 5주차를 진행하고 관련 내용을 정리합니다. 이전의 내용이 궁금하시다면 다음을 클릭해주세요. 1주차: 이벤트 위임부터 코드구성까지 2주차: 호스트 객체부터 Ajax까지 3주차: 호이스팅부터 이벤트 버블링까지 4주차: 전역스코프부터 Promise까지 이번 글은 지난 1~4주차 글들과 다르게 9 JavaScript Interview Questions의 질문에 대해 다룹니다. 이 글은 스터디 내용을 복기하고 정리하는 글로 아주 상세한 기술내용을 담고 있진 않습니다. 관련해서는 이후에 따로 정리할 계획입니다. 5주차 질문은 Math.max()와 Math.min(), 컴퓨터가 다루는 소수, 지멋대로의 진법 변화, 함수 표현식과 선언식의 차이, 키워드 없는 변수 할당, 객체지향 프로그래..
2019.09.27 -
[코드조각] 1부터 n까지의 합 구하기
1부터 n까지 합을 구하는 스니펫을 여러가지 방법으로 짜봤습니다. 1. for문 for문을 이용한 가장 간단한 방식입니다. 시간복잡도는 O(n)입니다. const sum=n=>{ let answer=0; for(let i=1;i { if(n===1) {return 1} return n+sum(n-1); } 3. 수학적인 방법 사용 중고등학교때 배웠던 가우스의 유명한 일화가 있습니다. 1+2+..+(n-1)+n를 빠르게 푸는 방법으로 ((1+n)*n)/2를 활용하는 것입니다. 시간복잡도는 O(1)으로 세 가지 방법 중 가장 빠릅니다. const sum=n=>{ return n*(n+1)/2; } 이밖에 다른 방법을 알고 있거나 더 효율적인 코드를 아신다면 댓글로 달아주세요. 많은 분들에게 큰 도움이 될 거..
2019.09.26 -
JS 기술면접 스터디 4주차: 전역스코프부터 Promise까지
기술면접 스터디 3주차에 이어 4주차를 진행하고 관련 내용을 정리합니다. 이전의 내용이 궁금하시다면 다음을 클릭해주세요. 1주차: 이벤트 위임부터 코드구성까지 2주차: 호스트 객체부터 Ajax까지 3주차: 호이스팅부터 이벤트 버블링까지 전체 질문 리스트의 출처는 front-end-interview-handbook이며, 이 글은 스터디 내용을 복기하고 정리하는 글로 아주 상세한 기술내용을 담고 있진 않습니다. 관련해서는 이후에 따로 정리할 계획입니다. 4주차 질문은 전역스코프, load 이벤트, SPA와 SEO, Promise와 Polyfill, Callback, JavaScript로 컴파일 되는 언어 등에 대한 내용입니다. 1. 일반적으로 웹 사이트의 전역 스코프를 그대로 두고 건드리지 않는 것이 좋은 ..
2019.07.31