본문 바로가기
반응형
React에서 셋(Set)으로 체크박스 재정의하기 체크박스 기능 구현, 이게 이렇게나 복잡한 퍼즐이 될 줄은 몰랐다. 그래도 두 개의 구현 방법을 알아내긴 했다. 그 중 하나인 '셋(Set)' 자료구조를 활용한 방식은 신기하고 인상 깊었다. 셋은 알고리즘 공부할 때나 가끔 봤었는데, 예전에 면접에서 써봤다고 괜히 얘기 꺼냈다가 라이브로 관련 문제까지 풀었었던 아찔한 기억이 있다.(물론 떨어졌다.) 그래서 이 글에서는 제대로 이해하고자 체크박스 기능 구현을 통해 알아보려고 한다. 우선, 배열을 사용하여 구현한 방식을 살펴보고, 이를 개선하기 위해 셋을 이용한 방식까지 소개한다. 따라서, 이 두 가지 방식을 비교하고, 셋을 이용한 체크박스 기능 구현이 어떻게 기존의 배열을 사용한 방식을 개선할 수 있는지에 대해 살펴보자. 잠깐, 체크박스 UI란? 체크박스 .. 2023. 5. 14.
자료구조 더 알아보기 - 해시 테이블 자료구조 더 알아보기 - 배열 글에 이어서 이번엔 해시 테이블(hash table)에 대해서 알아보자. 해시 테이블은 여러 프로그래밍 언어에 내재되어 있고 자주 사용하는 자료구조이다. JS는 객체(object), Python은 딕셔너리(dictionary), Go는 맵(map) 등..많은 언어에서 사용된다. 해시 테이블은 키(key)와 값(value)으로 데이터를 매핑하여 자료를 정리한다. 예시로 사전을 떠올려보자. 찾는 단어는 키가 되고, 단어에 해당하는 설명은 값이 될 수 있다. 이런게 어떤 장점을 가져올까? 자바스크립트 코드로 배열과 해시 테이블을 비교해보자. fruits = [ { kind: '🥑', price: 10 }, { kind: '🍓', price: 8 }, { kind: '🥕', pri.. 2021. 11. 10.
자료구조 더 알아보기 - 배열 자료구조와 알고리즘 이해하기 글에서 알아본 것처럼 자료구조란 데이터를 효과적으로 다루기 위한 방법을 뜻한다. 서비스나 어플리케이션에서 필요한 데이터를 메모리에 어떻게 구조적으로 담아두고 관리할지 생각하고, 최종적으로 가장 효율적인 자료구조를 채택하여 데이터를 빠르게 읽고(read), 검색(search)하거나, 수정(modify), 추가(add) 및 삭제(delete)를 할 수 있다. 읽기(read) 검색하기(search) 수정하기(modify) 추가하기(add) 삭제하기(delete) 서비스나 어플리케이션에서 클라이언트에 데이터를 제공 또는 사용자에게 데이터를 보여주고, 수정할 때 효율적으로 일을 처리하기 위해선 기능에 적합한, 알맞는 자료구조를 쓰는 것이 중요하다. 어떤 자료구조를 쓰냐에 따라 사용자가.. 2021. 11. 7.
자료구조와 알고리즘 이해하기 자료구조(Data Structure) 이해하기 자료(Data)가 그렇게 귀하다며..? 요즘 세상의 '자료(이하 데이터)'는 '새로운 석유(new oil)'라고 할만큼 AI, 정부, 구글 등 분야를 막론하고 많은 곳들에서 우리의 데이터를 원한다. 그래서 우리가 많은 서비스들을 무료로 사용할 수 있기도 하다. 예를 들어 데이터가 있어야 AI를 훈련시킬 수 있다. 데이터가 있어야 광고를 타겟팅 할 수 있다. 유튜브는 우리의 정보를 바탕으로 맞춤 광고를 설정하고, 영상을 보여준다. 그만큼 데이터는 중요하고 개발자라면 항상 데이터를 다루게 된다. 데이터를 효과적으로 다룰 수 없을까? 프로그래밍이 존재할 때부터 데이터는 항상 다루어왔다. 그렇게 데이터의 양이 커짐에 따라 선배 개발자들이 데이터를 효과적으로 다루기 .. 2021. 11. 6.
반응형