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
Was this helpful?