전체 글35

• [파이썬(Python)] 최단 경로 - 플로이드 워셜 알고리즘(Floyd-Warshall Algorithm) 나동빈 님의 이것이 취업을 위한 코딩 테스트다 with 파이썬을 학습 목적으로 정리한 글입니다. 플로이드 워셜 알고리즘은 모든 지점의 최단 경로를 구할 때 사용됩니다. 다이나믹 프로그래밍 방식으로, 한 노드에서 다른 노드로 이동할 때의 비용과 다른 노드를 거쳐서 목표 노드로 가는 비용을 비교했을 때 더 작은 비용을 택합니다. N개의 노드가 있을 때 1번부터 N번 노드를 순차적으로 돌면서, 다른 두 노드 사이에서 해당 노드를 거쳐서 이동할 때와 한 노드에서 다른 노드로 직접 이동하는 비용을 비교하여 더 작은 값을 최단 거리로 택합니다. 예를 들어, 4개의 노드가 있다고 합시다. a에서 b로 가는 비용을 Dab라고 표현하고, 1번 노드부터 4번 노드까지 순차적으로 따져보겠습니다. 먼저 1번 노드를 기준 노드.. Algorithm 2023. 3. 27.

• 

  Defer vs Async HTML에서 외부 스크립트를 로드하는 데 사용하는 defer 속성과 async 속성에 대해 알아보겠습니다. 두 속성은 외부 스크립트의 로드와 실행 방식을 결정합니다. 아래 코드 블럭에서 볼 수 있듯이 HTML 파일의 head 태그 안에 있는 script 태그의 속성으로 defer 또는 async를 부여할 수 있습니다. 해당 태그는 Boolean 타입인데, 디폴트가 True여서 defer 또는 async 라고 명시하기만 하면 속성이 적용됩니다. async async 속성이 적용된 스크립트는 HTML 구문 분석과 동시에 로드됩니다. 로드되는 동안에는 파싱이 그대로 진행되지만 다 받아지면 파싱을 중단하고 스크립트를 실행합니다. 스크립트가 여러개인 경우 위와 같이 스크립트 여러개를 모두 async 속성으로 불러.. Frontend 2023. 3. 17.

• 자바스크립트(JavaScript) 자바스크립트는 동적이고, 약타입의 프로그래밍 언어입니다. 또한, 작성된 코드를 기계어로 변환하지 않고, 한 줄 단위로 해석해서 직접 실행하는 인터프리트 언어입니다. 크롬, 사파리와 같은 웹 브라우저에 띄우는 웹페이지에서 실행되거나, Node.js나 Apache와 같이 브라우저가 아닌 환경에서도 실행됩니다. 동적 언어(Dynamic programming language) 형(Type)과 값(Value) 모두 런타임에 변경될 수 있는 언어를 동적 언어라 합니다. 예를 들어, 이전에 정수형이 할당된 변수가 문장졀로 재할당될 수 있습니다. 언어를 읽고, 해석하는 인터프리터가 값을 통해 자료의 형을 추정합니다. 즉, 어떠한 변수의 타입을 결정하는 타입 체크(Type Check)가 런타임으로 이루어지는 것입니다. .. Language/JavaScript 2023. 3. 12.

• [파이썬(Python)] 다이나믹 프로그래밍 나동빈 님의 이것이 취업을 위한 코딩 테스트다 with 파이썬을 학습 목적으로 정리한 글입니다. 프로그래밍에서 다이나믹 또는 동적인 것은 어떠한 동작이 프로그램 수행 중에 일어나는 것을 의미합니다. 실행 중에 메모리를 할당하거나, CSS를 변경하는 것을 동적이라고 할 수 있습니다. 하지만 알고리즘 문제 유형에서 가르키는 다이나믹은 그 의미가 아닙니다. 이번에는 코딩테스트의 관점에서 다이나믹 프로그래밍이 무엇이고, 어떤 문제를 해당 방식으로 풀면 좋은지 알아보겠습니다. 다이나믹 프로그래밍이란? 어떤 문제를 작은 문제로 분할하고, 중복된 문제는 한 번만 풀어서 효율성을 높이는 프로그래밍 방식을 의미합니다. 일반적으로 사용되는 '다이나믹'의 의미와 큰 연관성은 없어보이는데, 이 방법을 고안한 Bellman에 .. Algorithm 2023. 3. 7.

• Input()과 Stdin.readline()의 차이 알고리즘 문제를 풀다보면 대다수의 문제가 데이터 입력을 요구합니다. 그래서 input 함수와 readline 함수는 알고리즘 문제를 파이썬으로 조금이라도 풀어본 사람이라면 익숙합니다. 저는 입력할 데이터가 많으면 readline 함수를, 함수 몇 개를 입력하는 거라면 글자수가 적은 input 함수를 써왔는데요. 그 차이가 왜 생기는지 알아보겠습니다. Input 실행시 파이썬 내부적으로는 readline이 호출됩니다. 프롬프트 인자가 있으면, 개행 없이 표준 출력에 작성됩니다. 입력 값에서 한 줄을 읽고, 문자열로 변환합니다. 이때 동반하는 개행은 제거합니다. 내장함수여서 따로 임포트가 필요 없습니다. Sys.stdin.readline 입력값을 이진 데이터로 받고, 문자열로 변환하지 않습니다. Input .. Language/Python 2023. 3. 6.

• 호이스팅(Hoisting) 호이스팅(hoisting)은 보통 '변수의 선언과 초기화를 분리하고, 선언만 코드의 최상단으로 올리는 것'으로 설명합니다. 그런데 JavaScript의 공식문서에 따르면 원래 JS의 호이스팅은 '인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당해두는 것'을 의미합니다. 그래서 변수가 아직 정의 되지도 않았는데 사용하는 코드가 있어도 문제 없이 실행 됩니다. var 키워드로 선언된 변수가 호이스팅에 의해 undefined로 초기화되어 참조가 가능한 것입니다. 호이스팅은 ES6 이전 기술 명세에는 따로 설명된 개념이 아니었습니다. ES6가 나오면서 var 키워드를 지양하고, const와 let 키워드를 사용하게 되었는데, 그러면서 JS의 달라진 동작 방식을 구분할 필요가 있었던 것이죠. var .. Language/JavaScript 2023. 3. 6.

• [파이썬(Python)]DFS/BFS 나동빈 님의 이것이 취업을 위한 코딩 테스트다 with 파이썬을 학습 목적으로 정리한 글입니다. DFS(Depth-First Search) 그래프에서 깊은 부분을 우선적으로 탐색하는 깊이 우선 탐색 알고리즘입니다. 그래프 그래프는 노드(Node)/정점(Vertex)와 간선(Edge)으로 구성됩니다. 간선은 두 노드를 잇는 선인데, 이때 '두 노드는 인접하다'라고 합니다. 그래프는 두가지 방식으로 표현합니다. 인접 행렬(Adjacency Matrix) INF = 999999999 # 2차원 리스트를 이용해 인접 행렬 표현 graph = [ [0, 7, 5], [7, 0, INF], [5, INF, 0] ] print(graph) 2차원 배열로 연결 관계를 표현합니다. 연결되지 않은 노드 간에는 무한(Inf.. Algorithm 2023. 3. 5.

• [네트워크(Network)] 페이로드(Payload) 모바일, 웹 프로그래밍을 하면서 페이로드라는 단어를 여러번 접했습니다. 문맥상 단어의 의미를 파악하는 데 어려움이 없었지만, 정의를 알지는 못했습니다. 페이로드는 운송업에서 유래했습니다. pay(지불하다)와 load(싣다, 화물)가 합성된 형태이므로 직역하자면 '지불하는 화물'이 될 것 같습니다. 운송업에서는 보통 무게로 운송비가 책정되는데, 이때 고객이 운송비를 지불하고 받게 되는 화물이 페이로드입니다. 통신 분야의 페이로드는 전송하는 패킷이나 파일 안에 담겨 있는 실제 데이터 중 헤더와 메타데이터를 제외한 데이터입니다. 헤더와 메타데이터에는 목적지, 메서드 등 전송 자체에 필요한 정보가 담겨 있는데, 이는 클라이언트가 실은 데이터가 아니라 전송에 필요한 정보입니다. 화물이 운송되려면 트럭과 운전수, .. 카테고리 없음 2023. 3. 4.

• ScrollIntoView 함수로 탭 메뉴 스크롤 기능 구현하기 ScrollIntoView 메서드는 웹 페이지의 특정 요소로 스크롤할 수 있는 JavaScript의 내장 함수입니다. 이 기능을 사용하면 한 번의 클릭이나 탭만으로 특정 구역으로 쉽게 이동할 수 있습니다. 이번 포스트에서는 JavaScript와 React를 활용해서 Scroll 기능을 구현하는 방법을 소개하려고 합니다. 탭 메뉴를 클릭하면 해당 섹션으로 넘어가도록 만들어보겠습니다. 리액트가 없어도 ScrollIntoView 메서드는 사용할 수 있지만 예시로 든 코드에는 리액트가 활용된 점 참고해주세요. Step 1: 기본 틀 잡기 먼저 전체적인 틀을 잡아보겠습니다. 섹션 아이디를 미리 배열에 넣어두고, 이것을 헤더에 프라퍼티로 전달해서 스크롤 기능에 활용하도록 할거에요. 아직 작성하지는 않았지만 스크롤을.. Language/React 2023. 3. 2.

• [파이썬(Python)] 컴프리헨션(Comprehension) 파이썬의 컴프리헨션은 새로운 리스트, 셋, 딕셔너리와 같은 자료형을 간결하게 만들어주는 문법입니다. 보통 해당 자료형 내에 어떤 엘리먼트가 들어가는지 한 줄 안에 명시합니다. List Comprehension iterable한 오브젝트를 반복적으로 돌면서 새로운 리스트를 만듭니다. 이때 반복문의 요소들은 조건 내에서 식이 적용된 형태로 새 리스트에 저장됩니다. 문법 구조 [식 for 변수 in iterable한 객체 if 조건] even_numbers = [i for i in range(1, 21) if i % 2 == 0] 위 식을 살펴보면, even_numbers라는 새로운 리스트에, 주어진 조건을 만족하고, 식이 적용된 i가 엘리먼트로 삽입됩니다. 여기서 변수 i는 iterable한 객체 range.. Language/Python 2023. 3. 2.

• [파이썬(Python)] 구현 알고리즘 나동빈 님의 이것이 취업을 위한 코딩 테스트다 with 파이썬을 학습 목적으로 정리한 글입니다. 구현 알고리즘이란? 구현은 머리속에 있는 알고리즘을 소스코드로 바꾸는 과정입니다. '모든 알고리즘 문제가 다 구현 문제 아닌가?'라는 생각이 들 수 있는데요. 맞습니다. 모든 유형의 코딩 테스트가 구현 문제라고 할 수 있습니다. 그러나 여기서 이야기하는 구현 문제는 '풀이 자체는 특별한 방법이 아니지만 코드로 나타내기가 어려운 문제'를 의미합니다. 취업 코딩테스트용 알고리즘에 이런 문제가 자주 출제되기 때문에 따로 유형화해서 공부하는 것이죠. 특징 사소한 입력 조건 등이 명시됩니다. 문제의 길이가 긴 편입니다. 일반적으로 C/C++ 보다 파이썬을 사용해서 구현하는 것이 쉽습니다. 보통 다음과 같은 문제가 어려.. Algorithm 2023. 3. 2.

• [파이썬(Python)] 그리디 알고리즘 나동빈 님의 이것이 취업을 위한 코딩 테스트다 with 파이썬을 학습 목적으로 정리한 글입니다. 현재 상황에서 가장 좋아 보이는 것만 선택하는 알고리즘입니다. 직역해서 탐욕스러운 알고리즘으로, 탐욕법이라고도 합니다. 그리디 알고리즘 유형은 특별히 암기를 할 유형이 정해져 있는 것은 아니어서, 문제마다 아이디어를 낼 수 있어야 합니다. 출제 빈도는 높지 않지만, 다양한 문제가 그리디 알고리즘 문제로 분류가 됩니다. 예제 어떤 금액을 500원, 100원, 50원, 10원 동전으로 거슬러 줄 때, 동전의 최소 개수를 구하시오 이 문제는 가능한 한 큰 액수의 동전을 사용해야 합니다. 가장 큰 액수인 500원 부터 시작해서 해당 금액을 깎아 나가는 방식입니다. n = 1850 cnt = 0 coins = [500.. Algorithm 2023. 2. 22.