rhanziy

filter를 이용한 배열의 중복 요소 제거 Uniq() { return this.filter((v, i, self) => self.indexOf(v) === i)}  객체 배열 정렬const todos = [ {id:4, content: 'JS'}, {id:1, content: 'HTML'}, {id:2, content: 'CSS'}]//배열 key값 타입에 따라 정렬function compare(key){ // 프로퍼티 값이 문자열일 경우 산술연산으로 비교하면 NaN이 나오므로 비교 연산 사용 // 비교함수는 양수/음수/0을 반환하면 되므로 산술연산 대신 비교연산을 사용할 수 있다. return (a,b) => typeof a[key] === 'string' ? a[key].localeCo..

슬라이딩 윈도우 알고리즘?하나의 특정 범위를 지정해놓고, 윈도우를 이동시키면서 범위 내에 있는 원소들을 계산해주는 원리.배열과 그 배열의 subArray(부분배열)의 원소들을 어떠한 조건하에 계산하는 상황에서 사용된다. O(n)의 시간복잡도.ex. 구간 합 구하기, 일정한 사이즈의 범위 값 계산하기, 가장 긴 부분 문자열 구하기 등.  예제) 사이즈가 K인 부분배열의 최대 합을 구하시오.Function maxSumOfArray(arr: number[], k:number){ let windowSum = 0; let maxSum = -Infinity; // arr에 음수가 포함될 경우 대비 for(let i = 0; i = k-1){ maxSum = Math.max(windowSum, ma..

이진탐색이란 ?divide and conquer(분할 정복) 패턴을 지향하는 탐색 알고리즘. 빠르고 효율적이지만 배열이 정렬되어있어야 한다.시간복잡도는 O(log n) 준비물정렬된 배열 Array A 와 Left, Middle, Right 포인터 동작원리L: 배열의 첫번째, R: 배열의 마지막, M: L 와 R의 평균값If A[M] === target return M If A[M] 미들 다음으로 탐색If A[M] > target, set R to M-1 -> 미들 이전을 최고값으로 탐색 const nums = [1,5,13,17,32,39,45,50]function binarySearch(arr: number[], target: number){ let left = 0; let rignt = arr...

재귀함수란 ? 함수 내부에서 자기자신을 호출하는 것. 재귀함수 조건Stop condition(base case)Recursive case모든 재귀함수는 스택오버플로우를 방지하기위해 실행을 종료할 base case를 정의해야한다. 재귀단계의 연산을 제대로 설정하지않으면 maximum call stack size exceeded 에러 발생function drink(x) { //1. base case if(x  예제1) 문자열을 뒤집는 함수function reverse(str){ //base case if(str == ''){ return "" } else { //recursive case return reverse(str.substr(1)) + str.charAt(0) }}resver..

이미지 미리보기를 구현할때, 파일을 선택하면 img와 img 삭제 버튼 태그를 동적으로 생성했다. $('#img-preview').append(` x `) 그런데 저 id가 del인 버튼에 클릭이벤트를 달아 콘솔에 찍어도 아무 반응이 없는 것! 당연하다. html이 렌더링이 된 후 생성한 태그는 못찾지 응응ㅋ 그럼 document 자체에서 찾으면 된다. $(document).on('click', '#del', function(e){ e.currentTarget.parentElement.remove(); }); 따로 버튼에 data-id 속성을 지정하지않아도 이벤트리스너 e.currentTarget에 담겨있으니 선택한 element의 부모ele를 찾아 지우면 삭제 끗.

node.js로 프로젝트 생성중에 이미지를 업로드 하는 기능은 multer 미들웨어를 통해 구현했다. 이제 파일을 선택했을 때 preview를 만들어주고 싶었는데 서버단에서 계속 삽질함;; 걍 간단하게 자바스크립트의 FileReader() 객체로 화면단에서 구현가능했다. html 코드 + 제목 작가 카테고리 선택 국내도서 외국도서 등록 🔽 css코드 더보기 input[type="file"] { display: none; } .fileLabel { display:block; min-width: 150px; height:150px; margin-right: 5px; color: #8d8d8d; font-size:20px; text-align: center; line-height:150px; border: 1..

타입스크립트를 리액트 프로젝트에 적용해보면서 연습중이다. api를 받아온 결과를(json객체) type지정하면서 구조가 복잡하거나 depth가 깊어질 때, key나 자료형을 하나하나 입력하기 번거로웠다. 해결방법은 2가지가있는데, 편리한 사이트를 이용하거나 개발자도구에서 수작업하기.^0^ http://json2ts.com/ json2ts - generate TypeScript interfaces from json © 2023 - Timmy Kokke based on JSON C# Class Generator json2ts.com https://app.quicktype.io/?l=ts Instantly parse JSON in any language | quicktype app.quicktype.io 개꿀..

함수의 파라미터로 rest형식, 디스트럭쳐링형식이 들어왔을 때 type지정하는 방법. 일단 rest parameter는 파라미터가 몇개 들어올지 미리 정의를 할 수 없을 때 ... 으로 만들어주는거 function 전부더하기(...a){ console.log(a) } 전부더하기(1,2,3,4,5) console을 찍어보면 a값은 [ ] 어레이 안에 담겨져 있다. function 전부더하기(...a : number[]){ console.log(a) } 전부더하기(1,2,3,4,5) 그래서 타입지정도 array처럼 해주면 됨. array나 object 괄호 벗길 때 사용하는 Spread operator와는 다르니 유의 rest parameter type지정 예시) 입력된 숫자들의 최대 값을 return하는 ..