좋아요 숫자 개별 증가 숙제 질문

[우치하마다라]

안녕하세요 선생님
map을 이용하여 반복적으로 html 을 생성하고 난뒤 좋아요 버튼을 개별적으로 증가해주는 숙제를 하고 있는데
저는 onClick 이벤트안에서 함수를 불러와서 좋아요 숫자를 증가 시켜주고 싶은데요
함수 안에서 state 변경을 하여 copyLike의 인덱스별로 1씩 증가 시켜주려고 아래처럼 작성하였습니다. 그런데
오류가 납니다. 함수 라는 곳에서  i가 없어서 그런걸까요?
function App() {
let [좋아요, 좋아요변경] = useState([0,0,0]);
let [글제목, 글제목변경] = useState(['남자 코트 추천', '강남 우동 맛집', '파이썬 독학']);

function 함수(){
    // state 변경 함수 
    let copyLike = [...좋아요];
    좋아요변경(copyLike[i] + 1)
 }
return (
    <div className="App">
      <header className="black-nav">
        <h1 style={ {color: 'red', fontSize: '30px'} }>ReactBlog</h1>
      </header>
      {
        글제목.map(function(a, i){
          return (
            <div className="list" key={i}>
              <h4>{ a } <button onClick={함수}>👍</button> { 좋아요[i] }</h4>
              <p>2월 17일 발행</p>
            </div>
          );
        })
      }
    </div>
  );
}

[codingapple]

i는 파라미터로 입력받을 수 있게 하면 될듯요
함수사용하는 곳에서도 함수(i) 합시다

[우치하마다라]

선생님 답변 감사합니다.
함수()에 (i)를 붙여서 파라미터를 입력 받을 수 있게 했습니다만
콘솔에서는 언디파인이라고 떠서 좀더 찾아보던중

"이벤트 핸들러에 화살표 함수를 사용하여 감싼 다음에 매개변수를 넘겨줄 수 있습니다."
라고 공식 문서에 나와있어서 따라해봤는데 결과는 잘나옵니다. 
제가 이해를 잘한게 맞을까요?...

let [좋아요, 좋아요변경] = useState([0,0,0]);

function 함수(i){
    // state 변경 함수 
    let copyLike = [...좋아요];
    copyLike[i] = copyLike[i]+ 1;

    좋아요변경(copyLike);
  }

{
        글제목.map(function(a, i){
          return (
            <div className="list" key={i}>
              <h4 onClick={토글}>{ a } <button onClick={()=> 함수(i)}>👍</button> { 좋아요[i] }</h4>
              <p>2월 17일 발행</p>
            </div>
          );
        })
}

[codingapple]

잘했습니다

[글쓴이]

글