JavaScript 함수(Function)

JavaScript 함수는 행동 또는 특정 작업을 수행하는 코드 블록입니다.

함수는 프로그래머가 정의한 재사용 가능한 사용자 정의 코드로, 프로그램을 더 모듈화하고 효율적이게 만들 수 있습니다.

JavaScript 함수를 호출할 때 "아이템"이 함수를 실행합니다.

함수 정의

함수 정의（또는함수 선언）function 키워드를 사용하여 함수의 순서는 다음과 같습니다：

• 함수 이름

• 함수의 인자 목록은 소괄호()로 감싸져 컴마로 구분됩니다

• 함수 정의 문장은 중괄호{}로 감싸집니다.
  

이하 JavaScript에서 함수의 문법은 다음과 같습니다:

function nameOfFunction(parameter1, parameter2, ..., parameterN) {
　//　실행할 코드
　}

함수 이름은 문자, 숫자, 밑줄, 그리고 달러 심볼($)를 포함할 수 있습니다(변수와 같은 규칙입니다).

첫 번째 예제에서는 문서에 인사말을 인쇄하기 위해 함수 선언을 할 것입니다.

function greet() {
　　　document.write("Hello, World!");
}

함수 호출

함수 정의는 실행되지 않습니다. 함수 정의는 함수 이름을 지정하고 함수 호출 시 수행할 작업을 지정하는 것입니다.

함수 이름 뒤에 괄호()를 추가하여 함수를 호출할 수 있습니다.

//greet() 함수 정의
function greet() {
　　　document.write("Hello, World!");
}
//이미 정의된 greet() 함수를 호출하겠습니다
greet();

이제 우리는greet()코드는 함수 안에 포함되어 있으며 필요에 따라 반복적으로 사용할 수 있습니다.

//　greet() 함수 정의
function greet() {
　　　document.write("Hello, World!");
}
//　이미 정의된 greet() 함수를 여러 번 호출합니다
greet();
greet();
greet();

함수를 호출하는 다른 방법도 사용할 수 있습니다:

• 이벤트가 발생할 때(사용자가 버튼을 클릭할 때)

• JavaScript 코드에서 호출할 수 있습니다.

• 자동(자동으로 실행)

이 튜토리얼의 나중에는 함수 호출에 대한更多信息을 배울 수 있습니다.

함수 인자

함수를 정의하여 실행 시 입력 값을 받을 수 있도록 할 수 있습니다.

함수의 인자는 함수 정의의 괄호() 안에 나열됩니다.

//함수 정의
function greet(name) {
　　　document.write("Hello, ")　+　name);
}
//"Vishal"를 매개변수로 greet 함수 호출
greet("Vishal");

필요에 따라 매개변수의 양을 정의할 수 있습니다。

//함수 정의
function add(num1, num2, num3) {
　　　var total = num1　+　num2　+　num3;
　　　document.write(total);
}
　
//　함수 호출
add(5,　20,　10);　//　출력:　35
add(-5,　8,　7);　　//　출력:　10

그러나, 함수 호출 시 매개변수에 따라 해당 매개변수를 함수에 전달해야 하며, 그렇지 않으면 값이 불확실해집니다。

//함수 정의
function showFullname(fName, lName) {
　　　document.write(fName　+　" "　+　lName);
}
　
//　함수 호출
showFullname("Kavy", "Mark");　//　출력: Kavy Mark
showFullname("John");　//　출력: John undefined

매개변수는 함수 내의 대체변수로 작동하며, 실행 중에 함수에 제공된 값( 매개변수)으로 대체됩니다。

함수 내에서 매개변수는 지역 변수로 표현됩니다。

함수 매개변수에 대한更多信息는 튜토리얼의 후반부에서 알 수 있습니다。

반환 값

JavaScript 함수는 return 문을 사용하여 값을 호출한 스크립트에 반환할 수 있습니다。

반환 값을 어떤 형식이든 가능하며, 배열과 객체도 포함됩니다。

JavaScript가 return 문을 만날 때, 함수는 실행을 중단합니다。

다음 함수는 "숫자"라는 이름의 매개변수를 받아서, 자신을 곱한 매개변수를 반환합니다(즉, 숫자)：

//함수 정의
function square(number) {
　　　return number　*　number;
}
//함수를 호출하면, 반환 값을 x에 저장
var x = square(5);

함수는 여러 값을 반환할 수 없습니다. 그러나, 값을 배열로 반환하여 유사한 결과를 얻을 수 있습니다：

function makeArray() {
　　　var myArray = ["Apple", "Mango", "Banana", "Orange"];
　　　return myArray;
}

() 연산자가 함수를 호출

위의 예제를 사용하여, 함수 square 객체를 참조하고, 함수 square() 결과를 참조합니다。

()를 사용하지 않으면, 함수 정의 대신 함수 결과를 반환합니다：

function square(number) {
　　　return number　*　number;
}
document.write(square(5));　　//　출력　25
document.write(square);　//　정의된 함수를 출력하십시오

함수 표현식

위의 함수 선언은 문법적으로 문장이지만, 함수를 통해표현식함수 생성

함수 표현식은 변수에 저장할 수 있으며, 항상 변수 이름을 사용하여 호출합니다.

이러한 함수는 다음과 같습니다익명의 ; 이름이 필요하지 않습니다. 예를 들어, square() 함수는 다음과 같이 정의될 수 있습니다:

var square = function(number) { return number　*　number; };
var x = square(5);　//　x =　25

또 다른 예제:

var sum = function(a, b) {
return a　+　b;
};
var x = sum(100,　8);　　//　x =　108

위의 함수는 세미콜론으로 끝나서, 그것은 실행 문장의 일부입니다.

함수 범위

함수 내부에 정의된 변수는 함수 외부에서 접근할 수 없으며, 그들은 함수의 지역 변수가 됩니다.

//　이곳의 코드는 'city'를 사용할 수 없습니다.
function myFunc() {
　　　var city = "New Delhi";
　　//　이곳의 코드는 'city'를 사용할 수 있습니다.
}
//　이곳의 코드는 'city'를 사용할 수 없습니다.

지역 변수는 함수 내에서만 사용할 수 있으므로, 같은 이름의 변수는 다른 함수 내에서도 사용할 수 있습니다.

함수 실행 시 지역 변수를 생성하고, 함수가 완료되면 지역 변수를 제거합니다.