본문 바로가기

반응형

전체 글

(38)
[프로그래머스] Level 1. K번째수 (JS) 문제 설명 배열 array의 i번째 숫자부터 j번째 숫자까지 자르고 정렬했을 때, k번째 수를 구하려고 한다. 예를 들어 array가 [1, 5, 2, 6, 3, 7, 4], i = 2, j = 5, k = 3 이라면 1. array의 2번째부터 5번째까지 자르면 [5, 2, 6, 3] 2. 1에서 나온 배열을 정렬하면 [2, 3, 5, 6] 3. 2에서 나온 배열의 3번째 숫자는 5이다. 입출력 예시 array commands return [1, 5, 2, 6, 3, 7, 4] [[2, 5, 3], [4, 4, 1], [1, 7, 3]] [5, 6, 3] 문제 풀이 function solution(array, commands) { let answer = []; // commands의 length만큼 순..
[네트워크] 브라우저의 작동 원리 2 (보이는 곳) 🔎 SPA를 만드는 기술 : AJAX AJAX가 나오기 이전에는 페이지 전환으로 인해 필요한 부분뿐만 아니라 페이지 전체를 로딩했다. 이후 Dynamic web page가 등장하고 이는 서버와 자유롭게 통신할 수 있고, 페이지 깜빡임 없이 seamless하게 작동되었다. 또한 이것은 단순한 web page가 아닌 web app의 등장을 의미하기도 했다. 서버와 자유롭게 통신 XMLHttpRequest (XHR)의 등장 페이지 깜빡임 없이 seamless 하게 작동 JavaScript와 DOM 이용 이 두 가지 요소를 합쳐서 AJAX(Asynchronous JavaScript and XML)라고 부르기 시작했다. Using XMLHttpRequest var xhr = new XMLHttpRequest();..
[자료구조] Tree & Binary Search Tree(BST) 기초 - Tree 자료구조 Tree는 이름 그대로 나무의 형태를 가지고 있다. 정확히는 나무를 거꾸로 뒤집어 놓은 듯한 모습을 가지고 있다. 그래프의 여러 구조 중 무방향 그래프의 한 구조로, 하나의 뿌리로부터 가지가 사방으로 뻗은 형태가 나무와 닮아 있다고 해서 트리 구조라고 부른다. 마치 가계도와 흡사해 보이는 이 트리 구조는 데이터가 바로 아래에 있는 하나 이상의 데이터에 무방향으로 연결된 계층적 자료구조이다. 데이터를 순차적으로 나열시킨 선형 구조가 아니라, 하나의 데이터 뒤에 여러 개의 데이터가 존재할 수 있는 비선형 구조이다. 트리 구조는 계층적으로 표현이 되고, 아래로만 뻗어나가기 때문에 사이클이 없다. 용어 정리 노드(Node) : 트리 구조를 이루는 모든 개별 데이터 루트(Root) : 트리 ..
[자료구조] Graph 기초 컴퓨터 공학에서 이야기하는 자료구조 그래프는 일반 그래프와 전혀 다른 모습을 가지고 있다. 자료구조의 그래프는 마치 거미줄처럼 여러 개의 점들이 선으로 이어져 있는 복잡한 네트워크 망과 같은 모습을 가지고 있다. 그래프는 여러 개의 점들이 서로 복잡하게 연결되어 있는 관계를 표현한 자료구조이다. 직접적인 관계가 있는 경우 두 점 사이를 이어주는 선이 있고 간접적인 관계라면 몇 개의 점과 선에 걸쳐 이어진다. 하나의 점을 그래프에서는 정점(vertex)이라고 표현하고, 하나의 선은 간선(edge)라고 한다. 다음 그림은 간단한 그래프를 나타낸 것이다. 그래프 실사용 예제 포털 사이트의 검색 엔진, SNS에서 사람들과의 관계, 네비게이션 (길 찾기) 등에서 사용하는 자료구조가 바로 그래프이다. 세 가지 모두..
[자료구조] Stack과 Queue 기초 Stack 스택(Stack)은 쌓다, 쌓이다, 포개지다 와 같은 뜻을 가지고 있다. 마치 접시를 쌓아 놓은 형태와 비슷한 이 자료구조는 직역 그래로, 데이터(Data)를 순서대로 쌓는 자료구조이다. 일상생활에서 Stack과 비슷한 예를 찾아볼 수 있다. 네 대의 자동차가 순서대로 좁은 골목을 지나고 있었다. 하지만 이 골목의 끝은 공사 중으로 막혀있었다. 이를 모르던 첫 번째 차량 운전자는 이 골목을 통과하기 위해 직진했고, 나머지 차량도 앞 차량의 꽁무니를 따라 직진했다. 결국 첫 번째 차량은 공사로 막힌 골목 끝을 맞이했다. 마지막으로 들어온 네 번째 자동차가 먼저 후진으로 나와야 하는 상황이 되어버린 것이다. 이때 골목을 자료구조 Stack, 자동차는 데이터(data)로 비유할 수 있다. 위의 예시..
[자료구조] 자료구조란? 자료구조란 여러 데이터들의 묶음을 저장하고, 사용하는 방법을 정의한 것 먼저 데이터(data)는 문자, 숫자, 소리, 그림, 영상 등 실생활을 구성하고 있는 모든 값이다. 그러나 데이터는 그 자체만으로 어떤 정보를 가지기 힘들다. 예를 들어 나이라는 데이터만 알고 있다면, 사람의 나이인지, 강아지의 나이인지, 고양이의 나이인지 알 수 없다. 이처럼 데이터는 분석하고 정리하여 활용해야만 의미를 가질 수 있다. 데이터를 정해진 규칙 없이 저장하거나, 하나의 구조로만 정리하고 활용하는 것보다 데이터를 체계적으로 정리하여 저장해두는 게, 데이터를 활용하는 데 있어 훨씬 유리하다. 이미 선배 개발자들은 무수한 상황에 데이터를 효율적으로 다룰 수 있는 여러 방법을 연구해 두었다. 선배 개발자들은 무수한 상황에서 데..
[코드스테이츠] 2차 Hiring Assessment 후기 IM 29기로 코드스테이츠에 들어와 프로그래밍 공부를 시작한 지 벌써 두 달이 지났다. 첫 한달은 조건문, 반복문, 리액트 기초 등을 배우며 정신없이 지냈었고 노력의 결과로 HA1을 한 번 만에 붙을 수 있었다. HA1을 통과하고 바로 세션 2가 진행되었는데 세션 2를 진행하면서 나의 부족함을 너무 많이 느꼈었던 것 같다. 세션 2 에서는 진행한 코스는 다음과 같다. 객체지향 재귀 자료구조 비동기 HTTP / 네트워크 React 중급(상태 끌어올리기, Side effect) server 기초(Node.js) 컴포넌트 디자인(Styled-Component) Redux 상태관리 배포 제목에서 느껴지는 포스만 봐도 세션 1의 주제와는 비교가 안되게 어려운 과제들이 나에게 주어졌다. 세션 2를 진행하는 동안 총..
[React] Redux 상태관리 기초 Redux 란? Redux is a predictable state container for JavaScript applications. It helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test. => Redux는 자바스크립트 애플리케이션에서 예측 가능한 상태 관리를 해주는 container 이다. state 란? React에서 State는 Class component 안에서 관리 Component 간의 정보 공유 형제 컴포넌트들 간에 데이터를 주고받을 때, 부모 컴포넌트를 통해서 주고 받을 수 있다. (자식 간에 ..

반응형