병합 정렬 (Merge Sort) 전체 원소를 하나의 단위로 분할한 후에 분할한 원소를 다시 병합하며 정렬해 나가는 방식입니다. ■ 정렬 방식 1. 정렬하고자 하는 데이터 집합을 반으로 나눈다. 2. 반으로 나누어진 하위 데이터의 개수가 2이상이면 1의 과정을 반복한다. 3. 같은 집합에서 나온 하위 데이터 둘을 정렬을 시도하면서 다시 병합합니다. 4. 원래의 데이터 집합이 될때까지 3의 과정을 반복합니다. - 분할과정 전체 데이터 크기(n=8)에서 반으로(n=4) 나눕니다. 이 과정에 대해서 데이터 집합의 크기가 1이 될 때까지 반복합니다. -병합과정 같은 집합에서 나온 하위 데이터집합 두개를 정렬과 동시에 병합을 시도합니다. 주목해야 할 점은 병합이 이루어진 데이터 집합에 대해서는 정렬이 이루어졌습니..

퀵 정렬 (Quick Sort) 기준이 되는 원소를 기준으로 하여 기준 원소보다 작거나 같은 값을 지닌 자료는 앞으로 큰 값을 진ㄴ 자료는 뒤로 가도록 하여 기준 원소를 중심으로 분할해가며 정렬을 진행하는 방식입니다. ■ 정렬방식 1. 기준이 되는 원소를 정합니다. 배열의 시작 원소를 pivot으로 설정합니다. 2. 좌우 인덱스를 지정합니다. 해당 인덱스는 다음을 의미합니다. - left : pivot 보다 큰 값을 찾으러 다니는 index - right : pivot 보다 작은 값을 찾으러 다니는 index - left_hold : pivot을 제외하고 정렬 대상의 시작점 - right_hold : pivot을 제외하고 정렬 대상의 끝점 3. left를 pivot보다 큰 값을 찾을 때 까지 이동합니다...

버블정렬 (Bubble Sort) 두 인접한 배열요소를 차례대로 검사를 하여 정렬을 하는 방식 ■ 정렬 방식 1. 배열의 가장 앞에서 인접한 두 개의 요소에 대하여 비교를 한다. (배열의 첫 번째 요소와 두 번째 요소) 2. 배열의 다음 인접한 요소(두 번째와 세번째를 비교를 한다.) 3. 배열의 끝까지 반복을 한다. 한 사이클이 끝나면 배열의 맨 끝에는 정렬된 요소 하나가 정렬이 된 채 자리잡는다. 4. 정렬이 된 마지막 요소를 제외한 나머지에 대하여 1,2,3 번 과정을 반복한다. 정렬이 된 상태 비교 원소 5 4 3 2 1 최초 정렬이 이루어지지 않은 상태의 배열입니다. 5 4 3 2 1 첫 번째 요소와 두 번째 요소를 비교합니다. 4가 더 작으므로 둘의 위치를 교환합니다. 4 5 3 2 1 다음 ..

삽입 정렬 (Insetion Sort) 자료 배열의 모든 요소를 앞에서부터 차례대로 이미 정렬된 배열 부분과 비교하여, 자신의 위치를 찾아 삽입함으로써 정렬을 완성하는 알고리즘 입니다. ■ 정렬 방식 1. 배열의 첫 번째 요소는 정렬 된 상태라고 가정한다. 2. 배열의 두 번째 요소부터 앞에 정렬된 배열을 차례대로 비교하며 교환한다. 3. 최종적으로 자신의 위치에 맞는 위치에 삽입된다. 4. 다음 배열 요소에 대해서 같은 작업을 반복한다. : 정렬이 완료 된 상태 : 비교되는 배열 요소들 5 4 3 2 1 첫 번째 배열요소는 정렬이 완료된 상태라고 가정을 합니다. 5 4 3 2 1 두 번째 요소부터 비교를 시작합니다. 앞에 정렬된 첫 번째 요소와 비교를 하고 4가 더 작으므로 둘의 위치를 바꿔줍니다. 4..

선택 정렬(Selection Sort) 기존 위치에 맞는 원소를 선택하여 교환하는 방식 ■ 정렬 방식 1. 아직 정렬이 안된 리스트 중에 가장 앞에 원소를 최소값으로 설정 2. 가장 앞에 원소를 제외한 나머지 원소를 차례로 비교하고 최소값을 찾아감 3. 리스트 끝까지 비교 후 찾은 최소값을 가장 앞에 원소와 교환 4. 정렬이 안된 원소들을 가지고 반복 ■ 특징 - 최소값을 찾기 위한 비교횟수는 많지만 교환 횟수는 적다. - 데이터의 개수가 적을 때 좋은 성능을 발휘한다. - 시간복잡도 : O(n＾2) ■ 소스코드 (Source Code) public int[] Selection_Sort(int[] data,int num) { int min,tmp; for(int i=0;i

안녕하세요. 이번 포스팅에서는 컴포넌트 생명 주기 (Component Life Cycle)과 관련된 함수들에 대해서 알아보도록 하겠습니다. 리액트 컴포넌트에는 라이프사이클(Life Cycle)이 존재합니다. 리액트 앱을 개발하면서 렌더링 직전에 특정한 작업을 해야 한다던지 컴포넌트 업데이트 전후에 처리해야 할 작업이 있을 수 있습니다. 이때 리액트 컴포넌트 라이프사이클(Life Cycle) 관련 함수들을 이용하면 이를 처리할 수 있습니다. 컴포넌트 라이프 사이클 함수 종류는 아래와 같습니다. 컴포넌트 Life Cycle Life Method 종류 ▼ will 접두사가 붙은 함수는 어떤 작업을 처리하기 직전에 호출되는 함수이고 did 접두사가 붙은 함수는 어떤 작업을 처리한 후에 호출되는 함수입니다. 컴포..

안녕하세요. 이번 포스팅에서는 함수형 컴포넌트(Functional Component) 사용법에 대해서 알아보도록 하겠습니다. 지금까지 Component를 정의하기 위해서는 ES6 기반의 class 문법을 사용하여 정의하였습니다. 컴포넌트(Component)에서 Component Life Cycle API를 사용하는 경우나 state를 사용하는 경우에는 아래와 같이 항상 정의해왔습니다. import React, { Component } from 'react'; class MyComponent extends Component { render(){ return( Hello World!! My Name is {this.props.name} ); }; } export default MyComponent; ▼ 매번..

안녕하세요. 이번 포스팅에서는 리액트(React)를 활용하여 유동적인 데이터를 렌더링하는 방식과 관련된 간단한 예제 App을 만들어보도록 하겠습니다. 1. 고정 데이터 렌더링 먼저 고정 데이터를 렌더링하는 간단한 예제입니다. 예제는 웹페이지에 game List를 보여주는 형태로 어떠한 데이터 변경도 없는 App입니다. import React, { Component } from 'react'; import MyComponent from "./MyComponent"; class App extends Component { render() { return ( ); } } export default App; ▼ 먼저 최상위 컴포넌트(Component)에 해당하는 App Component입니다. MyComponen..

안녕하세요. 이번 포스팅에서는 배열 객체에 내장된 map() 함수를 통하여 반복되는 Component를 렌더링하는 방식에 대해서 알아보겠습니다. 1. map() 함수 기본 사용법 map() 함수는 각 배열의 요소를 돌면서 인자로 전달된 함수를 사용하여 처리 된 새로운 결과를 새로운 배열에 담아 반환하는 함수입니다. 아래 샘플 예제를 통해 사용법을 살펴보겠습니다. const numbers = [1, 2, 3, 4, 5]; const result = numbers.map((num) => num *2); console.log(result); ▼ numbers 배열 객체를 선언하고 [1, 2, 3, 4, 5]로 초기화하였습니다. map() 함수를 통해 배열 요소의 각 값에다가 *2한 결과를 return하고 있습..

안녕하세요. 이번 포스팅에서는 리액트(React)에서 이벤트를 처리하는 방식에 대해서 알아보겠습니다. 사용자가 브라우저에서 특정 DOM 요소와 상호작용하는 것을 이벤트라고 부릅니다. 예를 들어 버튼을 Click 하는 onClick 이벤트라든지 입력 요소의 값이 변경되는 onChange 이벤트와 같이 사용자의 특정 행동에 대해 핸들러를 통해 특정 이벤트에 대해 처리를 할 수 있습니다. 리액트(React)에서는 이벤트 처리와 관련해서 몇 가지 주의사항이 있습니다. ■ 이벤트 이름은 CamelCase 형식으로 작성합니다. ■ 이벤트 핸들러는 자바 스크립트 코드가 아닌 함수 구현체에 해당하는 값을 전달합니다. ■ DOM 요소에만 이벤트를 지정할 수 있습니다. {console.log("Click")}}> Clic..