[JavaScript] JavaScript 함수

https://tadaktadak-it.tistory.com/78?category=1024177 

[JavaScript] 함수(function)

1. 함수(function)

- 어떤 기능을 하는 코드들을 재사용하기 위해 한곳에 모아 처리하는 곳

- 매개변수라는 입력 값을 받아 무언가 처리하고 출력 값을 처리

• 함수 생성 및 사용(호출)
  function statement 함수 선언문
  
  function 함수명(매개변수) {
         실행 할 코드
  }
• 기본 기능 함수
  function print() {
         console.log("안녕하세요. 홍길동입니다.");
  }
• 함수 사용
  print();
  
  
• 입력 받은 값으로 출력
  function printName(name) {
         console.log("제 이름은 " + name + "입니다.");
  }
• 함수 사용
  printName("김유신");
  
  printName("홍길동");

2. 함수의 특징 및 반환, 소스코드 평가

• 함수의 특징
  - 함수는 function 키워드로 시작하고, 실제로는 객체이다.
  - 함수는 정의/생성할 수 있으며, 출력할 수도 있다.
  - 객체의 특성 덕분에 함수를 변수나 배열에 배정할 수 있다.
  - 다른 함수를 호출할 때, 인자를 넘겨줄 수 있다.
• 반환
  - 함수에서 원하는 값을 반환하고 싶을 때는 return과 함께 반환하고 싶은 변수를 써주면 된다.
  - return은 여러 개 쓸 수는 있지만 맨 처음에 return을 만나면 함수가 끝이 나기 때문에 의미가 없다.
  - 함수 사용을 변수에 넣으면서 사용하면 반환값이 그 변수에 넣어지게 된다.
  

  

• 소스코드 평가
  - 코드를 위에서부터 아래로 미리 읽어 코드 실행 전에 선언된 변수 및 함수 등을
  미리 해석

3. 예시

<script>
    // 기본 기능 함수 선언문(생성)
    console.log("시작입니다.");

    // 함수 선언
    function print() {
        console.log("안녕하세요. 홍길동 입니다.");
    }

    // 함수 호출
    print();

    function printInfo(name, age, addr) {
        console.log("안녕하세요. 제 이름은 " + name + "입니다.");
        console.log("제 나이는 " + age + "살 입니다.");
        console.log("우리집은 " + addr + "에 있습니다.");
    }

    printInfo("이순신",10,"강남");
    printInfo("김유신",20,"논현");
    printInfo("이성계",30,"종로");

    console.log("종료입니다.");

    // 더하기 함수 선언
    function sum(x, y) {
        var z = x + y;
        console.log(x + " 더하기 " + y + "은 " + z + "입니다.");
        return z;
    }
    // 출력은 ===> 2 더하기 3은 5입니다.
    // 함수의 결과값을 받기를 원한다(옵션);
    // return은 무조건 하나
    var a1 = sum(2,3);
    console.log("덧셈 결과는 " + a1);

    var a2 = sum(10,20);
    console.log("덧셈 결과는 " + a2);
</script>

4. Arrow 함수

- arrow 함수는 function 함수와 같은 함수이지만 화살표를 사용해서 하는 함수이다.

<script>
	// 익명 함수
    
    // 기본 함수
    function(num, index, arrnums) {
        console.log(index + " 요소의 값은 " + num + " 입니다.");
    }

    // arrow 함수
    (num, index, arrnums) => {
        console.log(index + " 요소의 값은 " + num + " 입니다.");
    }
</script>