텍스트 정렬

Coddy Node.js 여정의 REST API 섹션에 포함된 레슨. 25개 중 15번째.

추적기에서 작업을 필터링할 수 있습니다. 이제 저장된 순서를 변경하지 않고 클라이언트가 제목을 알파벳순으로 요청할 수 있게 해 보세요. 정렬 비교는 첫 번째 항목이 두 번째 항목보다 앞에 와야 하면 음수, 뒤에 와야 하면 양수, 순서가 같으면 0을 반환합니다.

const sorted = cities.toSorted((a, b) => a.name.localeCompare(b.name));

문자열을 빼도 유용한 순서를 얻을 수 없습니다. localeCompare는 텍스트를 비교합니다. toSorted는 새 배열을 반환하므로 원래 배열은 변경되지 않습니다. 필터링과 정렬이 함께 작동하도록 필터링된 목록을 정렬하세요. 다음 정렬 강의에서는 다른 필드, 내림차순 및 잘못된 쿼리 처리를 다룹니다.

챌린지

쉬움

routes/tasks.js에서 작업 추적기를 계속 구현하세요. 목록 경로에서 기존 필터를 적용한 뒤 ?sort=title을 지정하면 작업을 제목의 가나다순으로 반환하도록 하세요. 해당 값을 지정하지 않으면 현재 동작을 유지하세요. 저장된 작업 순서는 변경하지 마세요.

GET /api/tasks?sort=title을 시도한 다음 GET /api/tasks를 시도하세요. 두 번째 목록은 여전히 원래 순서여야 합니다. ?done=false&sort=title로 필터링해도 미완료 작업만 반환해야 합니다.

직접 해보기

import { Router } from 'express';
import { z } from 'zod';
import { sendError, sendInvalid } from '../errors.js';
import { nextId, tasks } from '../store.js';

const router = Router();

// PUT이 보내는 완전한 작업 데이터입니다. .strict()는 명시되지 않은 필드를 허용하지 않습니다.
const Task = z
    .object({
        title: z.string().trim().min(1).max(100),
        done: z.boolean(),
    })
    .strict();
const NewTask = Task.partial({ done: true });
const TaskChanges = Task.partial();

// 대소문자 구분 없이 다른 작업에 이미 이 제목이 있으면 True입니다.
const titleTaken = (title, exceptId) =>
    tasks.some((t) => t.id !== exceptId && t.title.toLowerCase() === title.toLowerCase());

router.get('/', (req, res) => {
    const { done, q } = req.query;
    let list = tasks;
    if (done !== undefined) {
        if (done !== 'true' && done !== 'false') {
            return sendError(res, 400, 'invalid_query', 'done must be true or false');
        }
        list = list.filter((t) => t.done === (done === 'true'));
    }
    if (q !== undefined) {
        const words = String(q).toLowerCase();
        list = list.filter((t) => t.title.toLowerCase().includes(words));
    }
    res.json(list);
});

router.get('/:id', (req, res) => {
    const task = tasks.find((t) => t.id === Number(req.params.id));
    if (!task) {
        return sendError(res, 404, 'not_found', 'Task not found');
    }
    res.json(task);
});

router.post('/', (req, res) => {
    const result = NewTask.safeParse(req.body);
    if (!result.success) {
        return sendInvalid(res, result.error);
    }
    const { title, done = false } = result.data;
    if (titleTaken(title)) {
        return sendError(res, 409, 'conflict', 'A task with this title already exists');
    }
    const task = { id: nextId(), title, done, createdAt: new Date().toISOString() };
    tasks.push(task);
    res.status(201).location(`/api/tasks/${task.id}`).json(task);
});

router.patch('/:id', (req, res) => {
    const task = tasks.find((t) => t.id === Number(req.params.id));
    if (!task) {
        return sendError(res, 404, 'not_found', 'Task not found');
    }
    const result = TaskChanges.safeParse(req.body);
    if (!result.success) {
        return sendInvalid(res, result.error);
    }
    if (result.data.title !== undefined && titleTaken(result.data.title, task.id)) {
        return sendError(res, 409, 'conflict', 'A task with this title already exists');
    }
    Object.assign(task, result.data);
    res.json(task);
});

router.put('/:id', (req, res) => {
    const index = tasks.findIndex((t) => t.id === Number(req.params.id));
    if (index === -1) {
        return sendError(res, 404, 'not_found', 'Task not found');
    }
    const result = Task.safeParse(req.body);
    if (!result.success) {
        return sendInvalid(res, result.error);
    }
    const { id, createdAt } = tasks[index];
    if (titleTaken(result.data.title, id)) {
        return sendError(res, 409, 'conflict', 'A task with this title already exists');
    }
    tasks[index] = { id, ...result.data, createdAt };
    res.json(tasks[index]);
});

router.delete('/:id', (req, res) => {
    const index = tasks.findIndex((t) => t.id === Number(req.params.id));
    if (index === -1) {
        return sendError(res, 404, 'not_found', 'Task not found');
    }
    tasks.splice(index, 1);
    res.status(204).end();
});

export default router;