TIL

커링

은지:) 2023. 12. 26. 18:02
728x90
반응형
 const data = [
    { type: "fruit", color: "red" },
    { type: "vegetable", color: "green" },
    { type: "fruit", color: "yellow" },
    { type: "vegetable", color: "red" }
  ];


const filterByType = type => item => type === "" || item.type === type;
const filterByColor = color => item => color === "" || item.color === color;
const filterBySize = size => item => size === "" || item.size === size;

  const tripleFilter = (type, color) => item =>
    filterByType(type)(item) && filterByColor(color)(item);



const result = data.filter(tripleFilter("fruit",""))

 

커링과 클로저를 사용한 프론트 filter 구조

 

넘 하드 코딩 같아서 chat GPT한테 리팩토링 요청했는데

 

 

const data = [
  { type: "fruit", color: "red" },
  { type: "vegetable", color: "green" },
  { type: "fruit", color: "yellow" },
  { type: "vegetable", color: "red" }
];

const createFilter = (property, value) => item => value === "" || item[property] === value;

const tripleFilter = (filters) => item =>
  filters.every(filter => filter(item));

const result = data.filter(tripleFilter([
  createFilter("type", "fruit"),
  createFilter("color", "")
]));

console.log(result);

 

 

이렇게 그냥 filter를 배열에 넣어줌

 

728x90
반응형