본문 바로가기

전체 글351

JavaScript 알고리즘 (11) Binary Search 요즘 알고리즘 공부하는 맛을 알게 된 새발자🐣 처음에는 아무것도 모르고 듣기만 했는데, 2번 보고 3번 보니 이해가 가면서 재미가 있다. 오늘은 Searching Algorithm 의 두번째 방법인 Binary Search (2진 탐색) 을 공부해보았다. Linear search 가 1번부터 순서대로 검사하는 방식이었다면, Binary search 는 가운데에서 반으로 쪼개서 검사한다. (고구마 먹을 때 반으로 쪼개서 먹듯이) 핵심만 말하자면 배열을 반으로 쪼개서 둘중 하나를 계속 버리고 또 쪼개서 버리고 이런식으로 추려나간다. The algorithm is based on a well know domain divide and conquer technique. It repeatedly breaks dow.. 2022. 9. 25.
React(83) TypeScript - Record 란 Record 는 React v2.1 부터 도입된 유틸리티 타입이다. 요 녀석은 객체전용 타입이다. Record 는 요렇게 두 개의 제네릭 타입을 받을 수 있다. 첫번째 제네릭 타입 K 는 key 의 타입이고, 두번째 제네릭 타입 T 는 value 값의 타입을 의미한다 type studentNames = Record; ↑ ↑ 객체에서 키의 타입 값의 타입 쉽게 말해서 나는 객체 안의 값들을 전부 string 으로 사용하고 싶다. Record 가 없었을 때는, 객체 프로퍼티 타입을 하나하나~~~~ string 이라고 적어줘야 했다. type studentNames = { name1: string; name2: string; name3: string; name4: string; }; 하지만 Record 를 사.. 2022. 9. 23.
React(82) HTTP 통신 delete 요청보내기 (게시물 삭제) HTTP 통신에는 크게 4가지 방식의 요청이 있다. 게시글을 예로 들어보자 게시글 생성은 POST(create) 요청을 하고, 게시글 수정은 PUT(update) 요청을 하고, 게시글 삭제는 DELETE 요청을 하며, 게시글 보기는 GET(read) 요청을 한다. 오늘 구현해볼 HTTP 요청은 DELETE 이다. 사실 삭제가 제일 쉽긴 하다. 그럼 구현하러 가보자 React(82) HTTP 통신 delete 요청보내기 (게시물 삭제) Api.ts 여기는 deletePost 함수가 들어있다. http.delete 메소드를 사용한다. export async function deletePost(id: number): Promise { try { const res = await http.delete( // de.. 2022. 9. 21.
JavaScript 알고리즘(10) Linear Search Linear Search 는 값을 찾을 때 순서대로 하나하나씩 다 검사하는 searching algorithm 이다. Linear Search is defined as a sequential search algorithm that starts at one end and goes through each element of a list until the desired element is found, 우리가 흔히 알고 있는 for문을 사용하여 하나하나씩 검사하는 방법을 사용한다. 이게 가장 기본적인 방식이고 이 알고리즘을 기준으로 여러 알고리즘들을 비교할 수 있을 것 같다. function linearSearch(arr, value) { for(var i = 0; i < arr.length; i++){ if(.. 2022. 9. 12.
JavaScript 알고리즘(9) Recursive function 오늘 소개할 친구는 재귀함수이다. 알고리즘 공부하는 중 나온 친구이다. 근데 꽤 흥미로운 친구라서 소개 겸 공부겸 아무튼 참지못하고 포스팅을 올려본다. JavaScript 알고리즘(9) Recursive function 재귀함수는 자기자신 속에서 또 호출되는 함수를 의미한다. (마치 거울의 방에서 끝없이 내 자신이 보이는 느낌이랄까 ) 예시로 들 코드는 모든 숫자의 합과 곱을 구하는 공식이다. 맨처음 코드를 공부하면서 배웠던 함수이며, 실무에서도 은근히 많이 사용하는 추억이 담긴 함수인데, 이것을 재귀함수로 구현하며 밀려오는 감동이란 🤩 ** 반드시 base case 를 만들어놓아야만 한다. 그래야 무한루프의 굴레에 빠지지 않는다. 모든 수의 합 // regular way function sumRange.. 2022. 9. 6.
CSS - input [type="range"] 투명하게 만들기 (feat. 브라우저 별 속성 -web-kit-appearance) 슬라이더 바를 만들기 위해 을 사용하였다. 그랬더니 요런 귀여운 슬라이더가 나왔다. 하지만 native 태그를 사용하게 되면 브라우저별 호환성이 좋지 않아 ui 가 깨진다. (특히 IE10 에서는 아예 호환x) 그래서 input 을 투명하게 만들어 기능만 동작하게 하고 + 그 위에 예쁜 슬라이더 ui 를 올려서 꼭두각시 노릇을 하게 만드려고 한다. CSS - input [type="range"] 투명하게 만들기 (feat. 브라우저 별 속성 -web-kit-appearance) HTML setValue(e.target.valueAsNumber)} /> CSS input[type:range] { // 인풋창 투명하게 만들기 appearance: none; /* 공통 */ // 인풋창 포커스 시 아웃라인 제.. 2022. 9. 5.
반응형

티스토리툴바