Skip to main content

Command Palette

Search for a command to run...

JavaScript Algorithms #3 - Insertion Sort

Published

1. What is Insertion Sort?

Insertion sort is a simple sorting algorithm that builds up the sort by gradually creating a larger left half which is always sorted. Values from the unsorted part are picked and placed at the right position in the sorted part. Compared to more advanced algorithms such as quick sort or merge sort, insertion sort seems much less efficient because it builds the final sorted array one item at a time.

2. Insertion Sort Pseudo Code

  1. Start sorting by picking the second element(index of 1) in the array.
  2. Compare the second element with the one before it and swap if the first one is greater than the second one.
  3. Continue to the next element and iterate through the sorted part if it is not in the correct order until it finds its correct place.
  4. Repeat until the entire array is sorted.

    3. Implementing the Insertion Sort

function insertionSort(arr){
        for (let i = 1; i < arr.length; i++){
            let current = arr[i];
            let j = i - 1;
            while ((j >= 0) && (current < arr[j])){
                arr[j + 1] = arr[j];
                j--;
            }
            arr[j + 1] = current;
        }

        return arr;
    }


4. Time Complexity of the Insertion Sort

It takes four steps to complete the insertion sort: to delete, compare, shift and insert. In the worst case scenario, it takes N²/2(compare) + N²/2(shift) + N-1(delete) + N-1(insert) = N² + 2N - 2 stages, which equals to O(N²) in big O notation.

More from this blog

[Kream 클론 프로젝트] 상품 더보기 기능

목표 offset/limit parameter를 사용한 상품 더보기 기능 구현 과정 1. 상품 더보기 기능 상품 목록 하단의 더보기 버튼을 누를 때마다 상품을 8개씩 더 로딩해오는 기능을 구현하기위해 예전에 배웠던 query parameter와 offset/limit 개념을 활용했다. offset과 limit을 설정해두면 데이터 요청 후 받아온 결과값에 순서를 부여해서 offset부터 limit까지의 데이터만 보여줄 수 있도록 페이징 처리...

Jul 22, 2022

[Kream 클론 프로젝트] 상품 검색 & 정렬 기능

목표 상품의 검색과 옵션별 정렬이 가능한 상품 목록 페이지 구현 과정 1. 상품 목록(메인) 페이지 UI 1) Kream이 상품 거래 사이트이다보니 각 상품마다 동일하게 반복되는 양식들이 많았는데, 이 부분들을 전부 컴포넌트로 만들고 재사용함으로써 코드의 길이를 많이 줄일 수 있었다. 특히 2차 프로젝트에서는 styled components를 사용하면서 각 페이지마다 js파일의 코드 양이 두배로 많아지는 바람에 한번 작성하고나면 알아보기가...

Jul 22, 2022

[Lululemon 클론 프로젝트] 장바구니 페이지

목표 상품 추가 / 삭제 / 수량 변경이 가능한 장바구니 페이지 구현 과정 1. 상품 데이터 받아오기 1) 사용자가 장바구니에 넣은 상품들의 목록을 렌더링하기위해 fetch 함수로 서버에서 데이터를 받아온 후 'itemList' 변수에 저장해두었다 . 2) 사용자를 식별한 다음 그에 맞는 데이터를 불러와야하기때문에 request header에 로그인시 발급했던 토큰 인가 과정을 추가했다. 코드🔻 const Bag = () => { co...

Jun 11, 2022

[Lululemon 클론 프로젝트] 로그인/회원가입 페이지

목표 JWT 인증방식을 활용한 로그인/회원가입 페이지 구현 과정 1. 로그인/회원가입 페이지 UI 1) lululemon의 사이트는 로그인 페이지에서 회원가입 버튼 클릭시 양식이 슬라이드로 올라와 한 페이지에서 로그인과 회원가입을 모두 진행할 수 있는 방식으로 되어 있었다. 이를 구현하기 위해 로그인 양식과 회원가입 양식을 각각 컴포넌트로 만든 뒤 'modal' 변수의 상태값이 true인지 false인지에 따라 적절한 컴포넌트가 렌더링될 수 ...

Jun 11, 2022

Rey's Blog

49 posts