본문 바로가기

javascript54

JavaScript 알고리즘(5) Same Frequency Counter Pattern 요즘에는 자바스크립트로 알고리즘 코드 패턴 공부 중이다. 여러 패턴들을 익히면서 재미를 찾아가는 중이다. 오늘 공부한 패턴은 Frequency Counter Pattern 이다. JavaScript 알고리즘(5) Same Frequency Counter Pattern 두개의 인자가 같은 숫자 혹은 글자 인지를 비교할 때, 하나의 객체에 요소 하나하나를 저장해 중복의 갯수를 표시하고, 나머지와 비교하며 같으면 제거해버린다. 만약에 같은 숫자라면 빈 객체로 돌아갈 것이고(true), 그게 아니라면 뭐라도 하나 남아있을 것이다.(false) function sameFrequency(firstNum, secondNum){ // 1. 숫자를 문자열로 만든다. (그래야 배열화할수있기 때문) const first =.. 2022. 3. 23.
JavaScript - 페이지이동 location.href / location.replace() / location.assign() 주말의 끝을 맞아 오늘은, 페이지 이동할 때 숨쉬듯 사용하였던 내장 메소드들의 속성을 심층 비교하며 공부해보았다. 어느 날 열심히 일하다가 페이지 이동 관련하여 히스토리 이슈가 생겼었는데 replace() 를 사용하니 히스토리가 남지않아 [뒤로가기] 기능이 의미를 잃어버리는 일이 생기게 된 일이었던 것이다. 그 땐 옆에서 🙄어🙄리🙄둥🙄절🙄 줏어듣기만 했었는데 우연한 기회로 정리해보게 되었다. 그럼 공식문서를 참고하며 차이를 알아보도록 하즈아 JavaScript - 페이지이동 location.href / location.replace()/ location.assign() location.href href는 태그를 사용하면서 가장 익숙하게 보았던 속성이다. 현재 접속 중인 페이지 정보를 가지고 있다. 또한 .. 2022. 2. 27.
JavaScript - Array.from() 으로 배열만들기 Updated 08/22/22 Array.from 은 배열이나 객체를 복사해 새로운 Array 를 만든다. 함수나 컴포넌트 내에서 한번 쓰이고 말 간단한 배열이나 객체를 후딱 만들어 써야 할 때, 자주 사용되는 것 같다. 이터러블 객체(for of)과 유사배열은 배열같은 객체이다. 객체이기 때문에 push 나 pop 등의 메소드를 사용할 수 없다. 하지만 이러한 객체들을 배열처럼 사용해야 할 때, → Array.from() 을 사용한다. 그럼 공식문서에 있는 예제 코드를 살펴보면서 Array.from 을 익혀보자. 이터러블 객체와 유사배열 이터러블(iterable) 은 메서드 Symbol.iterator가 구현된 객체이다. 유사 배열(array-like) 은 인덱스와 length 프로퍼티가 있어서 배열처.. 2022. 2. 8.
React(59) 맵(Map) 사용하기 - set / get / has / delete / clear / size 우리는 보통 데이터를 담는 그릇 (a.k.a 자료구조) 으로 객체나, 배열을 많이 사용한다. 하지만 사용하다 보면 여러가지 형태의 자료구조가 필요하다. 그중 하나인 맵(Map) 을 알아보자. 객체 – 키가 있는 컬렉션을 저장 배열 – 순서가 있는 컬렉션을 저장 맵(Map) 이란 일단 겉 모습은 객체랑 비슷하다. 쉽게 말해 커스텀이 가능한 객체 느낌이다. 키-값 쌍을 저장하며 각 쌍의 삽입 순서를 기억한다. 또한 Map 은 함수, 객체 등을 포함한 모든 값을 키와 값으로 사용할 수 있다. 일반적인 object 는 순서를 기억하지는 않는다. 리액트에서 맵(Map) 사용하기 1. new Map() – 맵 만들기 (리액트에서는 useState 로 맵을 선언했다.) // useState 로 타입이 맵인 변수 ar.. 2022. 2. 4.
JavaScript - Break문 vs Continue문 break문 - 이제 더 이상 반복없이, for문이나 while문 바로 나간다. - 반복문을 쿨하게 나가버린다. let sum = 0; for(const num=1; num 2021. 10. 14.
JavaScript 알고리즘(4) 퀵정렬(Quick Sort) 알고리즘 4번째 시간 ! 돌고돌아 오랜만에 돌아왔다. JavaScript 알고리즘(4) 퀵정렬(Quick Sort) 퀵 정렬은 앞선 정렬과 확인했을 때 훨씬 빠르다. 이를 분할정복 알고리즘이라고 한다. 특정 값을 기준으로 큰 숫자와 작은 숫자로 나눠 보면 어떻까? - 기초 아이디어 퀵 정렬에서는 피봇이라는 기준 값이 있다. 보통 첫번째원소를 피봇(pivot) 이라고 놓는다. 피봇을 기준으로, 피봇보다 작은 애들은 모두 피벗의 왼쪽으로 옮기고, 피봇보다 큰 애들은 모두 피벗의 오른쪽으로 옮긴다. 다 옮겼으면 피봇을 제외한 왼쪽 리스트와 오른쪽 리스트를 다시 순서대로 정렬한다. 좌우로 나눠진 부분 리스트는 순환 호출을 이용하여 정렬을 반복한다. 부분 리스트 내에서 다시 피봇(기준값)을 정해서 좌우로 2개의 .. 2021. 8. 26.
JavaScript 알고리즘 (3) 삽입정렬 (Insertion Sort) 알고리즘 세번째 시간 😀 삽입정렬에 대해 알아보자삽입정렬삽입정렬은 각 숫자를 적절한 위치에 삽입하는 방법이다.선택정렬, 버블정렬은 이중포문으로 원소들을 몽땅 검사하면서 위치를 바꾸는 정렬이었지만, 삽입정렬은 조건을 걸어 필요할 때만 위치를 바꾸게 된다.그래서 버블정렬과 선택정렬보다 더 빠르지만 시간복잡도는 O(N^2)으로 엄청 막 효율적이라고는 말할 수 없다안정적인 정렬 알고리즘이고, 제자리 정렬 알고리즘 이다. (비교와 교환을 통해 정렬하는 알고리즘이므로 다른 메모리 공간을 필요로 하지 않음) 뒤죽박죽인 배열 내의 숫자들을 오름차순(1, 2, 3, ... 10)으로 정렬해보자자, 준비물은 array, temp 다. 이 변수들 안에 숫자들을 담아 능력껏 줄세워보자.let array = [1, 5, 4,.. 2021. 7. 22.
JavaScript 알고리즘(2) 버블정렬(Bubble Sort) Updated 10/30/22 알고리즘 두번째 시간😀 원리를 알아가니 퍼즐이 맞춰지는 느낌이다. 이렇게 하나하나 알아가보자! 자 그럼 버블정렬에 대해 알아가보자 버블 정렬(Selection Sort) 정렬알고리즘 중 버블 정렬은 가장 큰 숫자를 선택해서 뒤로 보낸다. 옆 원소랑 비교해서 더 작은 값은 앞으로, 최대값을 뒤로 보내자! 뒤죽박죽인 배열 내의 숫자들을 오름차순(1, 2, 3, ... 10)으로 정렬해보자 자, 준비물은 array, temp 다. 이 변수들 안에 숫자들을 담아 능력껏 줄세워보자. 첫번째 원소자리에는 1st - 10th 원소 검사해서 젤 큰 수를 맨뒤로 넣고, 두번째 원소자리에는 1st - 9th 원소 검사해서 젤 큰 수를 맨뒤로 넣고, 세번째 원소자리에는 1st - 8th 원소 .. 2021. 7. 19.
JavaScript 알고리즘 (1) 선택 정렬 (Selection Sort) 예전에는 알고리즘을 생각해볼 여유도 없이 프로그래밍 언어와 문법 위주로만 공부하기 바빳다. 알고리즘까지 배울 레벨과 여력이 안된다고 생각하여 주위에서 중요성을 설파할 때면 귓등으로 넘긴 것 같다.코딩테스트를 그때그때 머리에 의존하여 풀어내면서 이제서야 알고리즘에 대한 중요성을 확실히 깨달았다. 하지만 자바스크립트로 푸는 알고리즘 자료는 많이 없다. 아마도 자바스크립트 언어 특성상 파이썬이나 자바에 비해 자료구조 등을 효율적으로 쉽게 풀어내기가 어려워서라고 생각한다. 그렇지만 포기는 없다. 자 그럼 이제부터 한걸음씩 시작해보자. updated 06/09/24알고리즘 강의를 2번째 보고있는 중이다. 개념과 이해는 어느정도 잡혔지만어느날 누군가 나에게 던진 질문처럼 이 알고리즘이 왜 사용해야하는지에 대한 답은.. 2021. 7. 18.
반응형

티스토리툴바