windate3411

###### tags: `leetcode` `algorithm` `worldpress`

## 前言

最近開始整理以前刷過的leetcode題目，不出所料很多都沒有什麼印象得從頭再來XD 整理的過程中我開始用HackMD將每一題作比較完整的紀錄，其中包含題目說明、初步想法、虛擬碼以及最終提交的作法。 是個勞力活，不過說實在解題真的蠻有意思的，今天在整理的時候意外接觸到Cyclic Sort這樣的排序方法，覺得實在太有意思了，在此作個紀錄。 之後我會將整理完畢的leetcode筆記放上來，希望到時候能對也有在刷題的朋友有些幫助:D

## 什麼是Cyclic Sort? 為什麼我要用它?

**Cyclic Sort 是一種coding pattern**，在解決給定陣列**僅含數字**且**在指定範圍內的**題目時相當的實用，比起一般的sort()排序有著更好的時間複雜度(O(n))，且由於是in-place，不需要額外的記憶體空間，在空間複雜度的表現也相當良好(O(1))。核心概念相當的單純，就是根據元素的數字將它放置在對應的位置上，我們往下看個簡單的例子吧!

windate3411

<template>
  <div class="scroll-image">
    <img :src="source" alt="a placeholder scroll image" />
  </div>
</template>

<script>
export default {
  props: ['source']
}

windate3411

<template>
  <div id="app">
    <h1>Infinite scrolling using scroll-view</h1>
    <Scroll-view>
      <template slot-scope="visible">
        <my-component v-for="i in items" :source="i.url" :key="i.id"></my-component>
      </template>
    </Scroll-view>
    <h3 v-if="loading" class="loading">Loading...</h3>
  </div>

windate3411

<template>
  <div id="app">
    <h1>Infinite scrolling using scroll-view</h1>
    <Scroll-view>
      <template slot-scope="visible">
        <my-component v-for="i in items" :source="i.url" :key="i.id"></my-component>
      </template>
    </Scroll-view>
    <h3 v-if="loading" class="loading">Loading...</h3>
  </div>

windate3411

<script>
import todoAPI from './apis/todo_api.js'

export default {
  name: 'App',
  data() {
    return {
      fetchedData: null,
      title: ''
    }

windate3411

import { apiHelper } from '../utils/api_helper.js'

export default {
  todos: {
    get() {
      return apiHelper.get(`/todos/1`)
    }
  }
}

windate3411

import axios from 'axios';

// 告訴axios你創立的實體要以什麼作為baseURL，特別注意URL需要大寫，這是axios的屬性之一
const baseURL = 'https://jsonplaceholder.typicode.com'
const axiosInstance = axios.create({
  baseURL
})

// 輸出你所創立的axios實體
export const apiHelper = axiosInstance

windate3411

// App.vue
<template>
  <div id="app">
    <button @click="fetch">Fetch data</button>
    <h1>The title is {{title}}</h1>
  </div>
</template>
<script>

import axios from 'axios'

windate3411

<template>
  <v-container class="fill-height" fluid>
    <v-row align="center" justify="center">
      <v-col cols="12" sm="8" md="4">
        <v-card class="elevation-12">
          <v-toolbar color="primary" dark flat>
            <v-toolbar-title class="center">Member Login</v-toolbar-title>
          </v-toolbar>
          <v-card-text>
            <v-form>

windate3411

<v-container class="fill-height" fluid>
    <v-row align="center" justify="center">
      <v-col cols="12" sm="8" md="4">
        <v-card class="elevation-12">
          <v-toolbar color="primary" dark flat>
            <v-toolbar-title class="center">Member Login</v-toolbar-title>
          </v-toolbar>
          <v-card-text>
            <v-form>
              <v-text-field