본문 바로가기
지금, 개발하기/Javascript

Javascript] 화살표 함수 사용하기 (peat. Array.prototype.some())

by Seaco :) 2021. 9. 28.

 

화살표 함수가 참 간단하고 좋은데 연습이 안되면 사용하기가 쉽지 않은 것 같습니다. 간단하게 화살표함수를 연습할 수 있는 코드를 짜보았습니다. 그냥 연습하면 재미없으니까~ 다른 함수를 넣어서 연습해보겠습니다. 

이번에는 화살표 함수를 사용하는데 예전에 배웠던 some()메서드를 함께 사용해보겠습니다. 

 

Array.prototype.some()

: some() 메서드는 배열 안의 모든 요소가 주어진 함수를 만족하는지 테스트하는 함수힙니다. 
배열에서 ture(참)인요소를 찾을 때까지 콜백 함수를 실행합니다. 참인 요소를 발견한 경우 some은 즉시 true를 반환하고 끝납니다. 그러나 배열에 참인 요소가 없는경우 즉, 모든 요소가 거짓인 경우에는 false를 반환합니다. 그렇기 때문에 콜백함수를 만족하는 요소가 배열에 하나라도 있는 지 알아볼 때, some()을 쓰면 좋겠죠? 

참고로 빈 배열일 경우에는 some() 메소드를 호출하면 false를 반환합니다. 

 

화살표함수 연습1.

: 배열의 요소가 함수를 만족하는가?

<html>
<head>
</head>
<body>
  Javascript Test 
<script type="text/javascript">
  function over100(element, index, array){
  return element > 100;
  }

  array1 = [10, 20, 30, 40, 50];
  array2 = [110, 90, 80, 70, 60];

  // some.함수
  console.log(array1.some(over100));   // false
  console.log(array2.some(over100));   // true

  // some.화살표 함수
  console.log(array1.some(el => el > 100));   // false
  console.log(array2.some(el => el > 100));   // true

</script>
</body>
</html>

 

 

화살표함수 연습2.

: 원하는 값이 배열에 존재하는가?

<html>
<head>
</head>
<body>
  Javascript Test 
<script type="text/javascript">

  stationery = ['pencil', 'book', 'eraser', 'pen'];
  
  // some.함수
  function stationeryCheck(array, value){
    return stationery.some(function(value2){
        return value === value2;
    });
  }

  console.log(stationeryCheck(stationery, 'book'));   // true
  console.log(stationeryCheck(stationery, 'cup'));   // false
  


  // some.화살표 함수
  function stationeryCheck2(array, value){
    return stationery.some(value2 => value === value2);
  }
  
  console.log(stationeryCheck2(stationery, 'postit'));   // false
  console.log(stationeryCheck2(stationery, 'pen'));   // true
  


</script>
</body>
</html>