SortData

common은 내부용으로만 사용되는 용도로 만든것 입니다.

1.dataGroups

  <ul class="list-inner"></ul>

  <ul class="list-inner2"></ul>
<script src="/dist/build.min.js"></script>
<script>
     (function() {
        const people = [
            { id: 1, name: 'iroMan', actor: '로버트 다우니 주니어', alias: '아이어맨', age: 40 },
            { id: 2, name: 'Jane', actor:'toto', alias: 'dddd', age: 21 },
            { id: 3, name: 'captainAmerica', actor:'크리스 에반스1', alias: '캡틴 아메리카', age: 40 },
            { id: 4, name: 'captainAmerica', actor:'크리스 에반스2', alias: '캡틴', age: 40 }
        ];
        
        const age = tr.dataGroups(people, 'age', {group: true}) // age라는 키의 기준으로 그룹핑을 한다.
        console.log(age)
            
        const tamplate = ((props) => {
            const {name, actor, alias} = props;
            return `
                <li>
                    <div>${name}</div>
                    <div>${actor}</div>
                    <div>${alias}</div>
                </li>
            `
        });
        age[40].forEach(element => { // age라는 값중에 40이라는 것 안에 배열로 구룹핑되어 있다. 그것들을 forEach로 가져와 화면에 뿌린다.
            document.querySelector('.list-inner').innerHTML += tamplate(element)
        });

         age[21].forEach(element => { // age라는 값중에 21이라는 것 안에 배열로 구룹핑되어 있다. 그것들을 forEach로 가져와 화면에 뿌린다.
            document.querySelector('.list-inner2').innerHTML += tamplate(element)
        });
    })();
</script>

2. dataFilter

<script src="/dist/build.min.js"></script>
<script>
     (function() {
        const people = [
            { id: 1, name: 'iroMan', actor: '로버트 다우니 주니어', alias: '아이어맨', age: 40 },
            { id: 2, name: 'Jane', actor:'toto', alias: 'dddd', age: 21 },
            { id: 3, name: 'captainAmerica', actor:'크리스 에반스1', alias: '캡틴 아메리카', age: 40 },
            { id: 4, name: 'captainAmerica', actor:'크리스 에반스2', alias: '캡틴', age: 40 }
        ];
        
         // dataFilter() 함수는 opject value값 type이 number만 가능합니다.
        const filter = tr.dataFilter(people, { age: '23' }) // age라는 값 중에서 value 값 기준으로 필터링을해서 새로운 배열로 받을수 있습니다.
        console.log(filter)

        const tamplate = ((props) => {
            const {name, actor, alias} = props;
            return `
                <li>
                    <div>${name}</div>
                    <div>${actor}</div>
                    <div>${alias}</div>
                </li>
            `
        });
        
        filter[40].forEach(element => { // age라는 값중에 40이라는 것 안에 배열로 구룹핑되어 있다. 그것들을 forEach로 가져와 화면에 뿌린다.
            document.querySelector('.list-inner').innerHTML += tamplate(element)
        });
    })();
</script>

3.dataArray

<script src="/dist/build.min.js"></script>
<script>
     (function() {
        const people = [ ['iPhone','iMac','macbook'], ['coke','diet coke'], ['americano','latte', 'tea2'] ];
        const arr3 = [ ['IPhone'], ['Coke'], ['Diet Coke'], ['Americano','Latte', 'Tea3'] ];
        
        // ((주의) 원본 배열의 데이터가 첫글자에서 대문자, 소문자를 통일 시켜줘야 내림차순 기능이 됩니다.)
        const peoples = tr.dataArray(people) //dataArray는 여러가지 배열(2차배열)로된 data들을 하나의 배열로 통합시켜 내림차순으로 반환 해줍니다.
        const arr3s = tr.dataArray(arr3)

        console.log(peoples)
        console.log(arr3s)
    })();
</script>

Last updated