SearchEffect06 - sort( ), reverse()

        const searchBox = document.querySelectorAll(".search span") //버튼
        const cssList = document.querySelector(".list ul") //속성 리스트
        const cssCount = document.querySelector('.count')

        // 데이터 출력
        const updateList = function () {
            let listHTML = '';

            cssProperty.forEach((data, index) => {
                listHTML += `
${data.num}. ${data.name} : ${data.desc}
`;
                cssCount.innerHTML = `전체 목록 갯수 :  ${data.num}`;
            });
            cssList.innerHTML = listHTML;
        }
        updateList();

        //반대정렬
        function reverse() {
            cssProperty.reverse()
            updateList();
        }

        // 오름차순
        function sortAscending() {
            cssProperty.sort((a, b) => {
                return a.num - b.num
            });
            updateList();
        }

        // 내림차순
        function sortDescending() {
            cssProperty.sort((a, b) => {
                return b.num - a.num
            });
            updateList();
        }

        // 알파벳 정렬(a~z)
        function sortAlphabet() {
            cssProperty.sort((a, b) => {
                let x = a.name;
                let y = b.name;
                return x.localeCompare(y)
            })
            updateList();
        }

        // 알파벳 정렬(z~a)
        function sortAlphabetZ() {
            cssProperty.sort((a, b) => {
                let x = a.name;
                let y = b.name;
                return y.localeCompare(x)
            })
            updateList();
        }

        // 반대로 버튼 클릭시
        document.querySelector(".btn1").addEventListener("click", () => {
            reverse();
        })

        // 오름차순 버튼 클릭시
        document.querySelector(".btn2").addEventListener("click", () => {
            sortAscending();
        })

        // 내림차순 버튼 클릭시
        document.querySelector(".btn3").addEventListener("click", () => {
            sortDescending();
        })

        // 알파벳순(a~z) 버튼 클릭시
        document.querySelector(".btn4").addEventListener("click", () => {
            sortAlphabet();
        })

        // 알파벳순(z~a) 버튼 클릭시
        document.querySelector(".btn5").addEventListener("click", () => {
            sortAlphabetZ();
        })