Javascript,React filter 사용법

filter 란 ?

var array = [1,2,3,4,5,6,7,8,9];
var result = array.filter((value) => value <5)
console.log(result);

// 1,2,3,4

• result 변수안에서 filter를 통해서 5미만의 수를 뽑아서 출력한다.
• filter을 사용하는 이유는 내가 원하는 데이터를 뽑아서 사용하기위해서 쓴다.
• filter()안에 내가 원하는 조건을 넣어 사용한다.

filter 사용법

// 조건식에 바로 작성, 장점으로는 코드수를 줄일수있고, 한눈에 보기 편리하다.
let array = [1,2,3,4,5,6,7,8,9];
let result = array.filter((value) => value <5)
console.log(result);

// filter을 외부에서 사용하는 방법, 장점으로는 복잡한 코드를 구현할 때 관리하기 편리하기 때문에 외부에서 사용한다.
fuction data(value){
return value < 5}
let result = array.filter(data)

사용 예제

let tennis = [
  { SIGUN_NM: '이천시', name: "이천시테니스1" },
  { SIGUN_NM: '화성시', name: "화성시테니스" },
  { SIGUN_NM: '파주시', name: "파주시테니스" },
  { SIGUN_NM: '이천시', name: "이천시테니스" },
  { SIGUN_NM: '여주시', name: "여주시테니스" }
];

  let result = tennis.filter((value) => value.SIGUN_NM == '이천시')
  

console.log(result);
// [
{ SIGUN_NM: '이천시', name: "이천시테니스1" },
{ SIGUN_NM: '이천시', name: "이천시테니스" }
]	
// 이런식으로 출력되는걸 볼 수 있다.

내가 filter을 사용하는 이유? react로 tennis에 대한 정보를 볼 수 있는 웹사이트를 만들고 있는데, 지역별 아이콘을 두고 그 아이콘을 누르면 그 지역에 대한 테니스장 정보를 볼 수 있게 구현하려고 하기 때문에 filter을 도입하면 편리하게 원하는 데이터를 불러 올 수 있기 때문에 사용하려고 한다.