[자바스크립트_개념정리] 함수의 정의와 실행

함수 function

함수란 코드의 재사용가능한 일부로서 언제든 사용할 수 있도록 이름을 붙여놓은 것이며, 

재사용가능한 일부의 코드를 만드는 것 뿐만 아니라 어떠한 입력을 받아들이고 출력에 영향을 미치는 함수를 만든다

코드의 중복을 줄이는 데 유용하며, 코드를 더 읽기 쉽고 이해하기 쉽게 만든다

[ 함수 사용 방법 ]

1단계 : 함수 정의

2단계 : 함수 실행

[ 함수를 정의하는 방법 1 ]

function 함수이름 () {
  실행문
}

//중괄호 안의 코드는 함수를 실행할 때만 실행됨
//함수를 정의하는 대표적 방법

[ 함수를 실행하는 방법 ]

함수이름();

[ 함수명에 괄호를 붙이지 않은 경우 ]

=> 함수가 실행되지는 않고 함수라는 것을 인식하여 출력한다

[ 함수 정의하는 방법 2 ]

const 변수명 = function(매개변수) {
  실행문
}

// 함수를 왼쪽의 변수에 저장 (객체, 배열 등을 저장하듯이)

=> 함수 실행 구문은 동일하며, 함수의 이름이 아니라 변수의 이름을 사용

​ 함수를 변수에 저장하는 방법으로 함수도 값으로 취급된다는 것을 알 수 있다

​ 함수를 인수로 전달할 수 있고, 함수를 반환값으로 반환할수 있다

인수 arguments

함수에 입력하는 값으로 괄호 속에 입력한다

입력에 따라 결과가 달라진다

[ 매개변수 사용한 함수 정의 방법 ]

function 함수이름(매개변수) {
  실행문
}

//매개변수 : 함수의 값의 자리
//이때의 실행문에는 매개변수가 포함됨

[ 인수 입력 방법 ]

함수이름("인수");

함수를 정의할 때 괄호 안에 매개변수를 입력하면 함수에 전달한 인수의 값이 매개변수에 저장된다

매개변수와 인수는 전달한 것을 그대로 저장할 뿐 식별능력이 없다

[ 매개변수, 인수를 사용한 함수 연습 ]

=> 매개변수는 person

​ 문자열 인수일 경우 입력할때 ‘ ‘ / “ “ 안에 입력해야한다 (처음에 안써서 오류남)

=> 인수를 입력하지 않으면 그 자리가 undefined 로 대체된다

[ 두 개 이상의 인수를 넣는 방법 ]

함수를 정의할 때 매개변수 사이를 쉼표로 구분

이때 순서가 중요하며, 서로 다른 타입도 함께 인수가 될 수 있다

첫번째 매개변수가 첫번째 인수를, 두번째 매개변수가 두번째 인수를 받는다

인수가 코드에서 이용되어 오류를 일으키지 않는다면 인수는 꼭 넣지 않아도 된다

[ for루프와 함수의 사용 ]

=> numTimes 자리에 들어온 인수만큼 str 자리의 인수인 문자를 반복

[강의 퀴즈 풀기]

주사위 두 개를 나타내는 두 개의 숫자를 입력값으로 받는 isSnakeEyes라는 함수를 작성한다.

두 숫자가 모두 1이면 “Snake Eyes!”를 출력하고, 그렇지 않으면 “Not Snake Eyes!”를 출력한다

함수의 출력값

RETURN

구체적 출력 값을 가진 함수를 써서 출력값을 출력하는데 그치지 않고 저장하고 보관하기 위해서는 반환 키워드가 필요하다

반환 키워드를 쓰면 함수의 출력값을 구하고 그것을 저장하고 재사용할 수 있으며 함수 밖으로 값을 내보낼 수 있다

[ Console.log랑 return 키워드 차이 ]

// Console.log 로 출력한 경우

=> console.log 는 값을 저장하지 않고 출력만 한다 ( total에 값이 저장되지 않음 )

// Return 키워드 사용

=> total에 값이 저장되었으며 함수 밖으로 값을 내보낼 수 있다

Return 키워드는 사실상 함수 실행을 중단시킨다

return이 있는 줄이 실행된 후 중단되며, return 뒤에 오는 코드는 실행되지 않는다

return문은 하나의 값만 반환한다. 값은 배열일 수도 있고 객체일 수 도 있다

=> 숫자가 아닌 문자열 인수를 넣으니까 false 값이 반환되고, 그 이후의 코드는 실행되지 않기 때문에 “this is invalid value”는 실행되지 않았다