1.2.1 함수란 무엇인가?

1.2.1 함수란 무엇인가?

자바스크립트에서 함수

• 자바스크립트에서 함수란 작업을 수행하거나 값을 계산하는 등의 과정을 표현하고, 이를 하나의 블록으로 감싸서 실행 단위로 만들어 놓은 것 의미

• function sum(a, b) {
    // sum: 함수명
    // 입력값 a, b: 매개변수
    return a + b // 반환값
  }
  
  sum(10, 24) // 34
  // 10, 24 : 인수

리액트에서 컴포넌트

• 리액트에서 컴포넌트를 만드는 함수도 이러한 기초적인 형태를 따름

• function Component(props) {
    return <div>{props.hello}</div>
  }

• Component 함수를 선언하고 매개변수로는 일반적으로 props라고 부르는 단일 객체를 받으며 return 문으로 JSX를 반환
• 일반적인 함수와의 차이점
  • 자바스크립트에서는 Component(props) 형태로 호출하지만
  • 리액트에서 함수형 컴포넌트는 <Component hello={props.hello} ... />와 같이 JSX 문법으로 단일 props 별로 받거나
  • <Component {...props} /> 같은 형태로 모든 props를 전개 연산자로 받음
  • 이러한 JSX 형태 외에도 일반적인 자바스크립트 문법으로 함수형 컴포넌트 호출하는 것도 가능