JavaScript 함수 문

정의와 사용법

function 문으로 함수를 선언합니다.

선언된 함수는 '보관하여 나중에 사용할 수 있습니다'로, 나중에 호출할 때 실행됩니다.

JavaScript에서 함수는 객체이며, 속성과 메서드를 모두 가지고 있습니다.

함수 정의(함수 정의 참조)

JavaScript 튜토리얼을 읽어보세요. 함수와 JavaScript 스코프에 대해 필요한 모든 지식을 배울 수 있습니다. 함수 정의, 매개변수, 호출, 클로저에 대한 자세한 정보는 함수 정의, 매개변수, 호출, 클로저 튜토리얼을 참조하세요.

ヒント:함수에서 값을 반환하려면 return 문을 사용하십시오.

예제

함수를 선언하고 id="demo"의 요소에 "Hello World"를 출력하도록 호출합니다:

function myFunction() { // 함수 선언
  document.getElementById("demo").innerHTML = "Hello World!";
}
myFunction(); // 함수 호출

직접 시험해 보세요

하단에 더 많은 TIY 예제가 있습니다.

문법

function functionName(parameters) {
  실행될 코드
}

매개변수 값

매개변수 설명
functionName 필수 사항입니다. 함수 이름을 정의하고 '보관하여 나중에 사용할 수 있습니다'. 함수 이름은 문자, 숫자, 밑줄, 그리고 달러 심볼(변수와 동일한 규칙)을 포함할 수 있습니다.
parameters

선택 사항입니다. 쉼표로 구분된 하나 이상의 매개변수 이름을 지정합니다.

함수 매개변수는 함수 정의에 나열된 이름입니다.

함수 매개변수는 함수가 호출될 때 받는 실제 값입니다. 함수 내부에서 매개변수는 지역 변수로 사용됩니다.

주석:함수 호출 시 매개변수가 누락되면, 누락된 매개변수의 값은 undefined로 설정됩니다.

기술 세부 사항

JavaScript 버전: ECMAScript 1

더 많은 예제

예제

PI의 값을 반환합니다:

function myFunction() {
  return Math.PI;
}

직접 시험해 보세요

예제

a와 b의 곱을 반환합니다:

function myFunction(a, b) {
  return a * b;
}

직접 시험해 보세요

예제

함수를 사용하면 다른 매개변수를 가진 동일한 코드를 여러 번 사용하여 다른 결과를 얻을 수 있습니다。

화씨를 섭씨로 변환합니다:

function toCelsius(fahrenheit) {
  return (5/9) * (fahrenheit-32);
}

직접 시험해 보세요

예제

함수는 변수로 사용될 수 있습니다。

대신:

temp = toCelsius(32);
text = "The temperature is " + temp + " Centigrade";
사용할 수 있습니다:
text = "The temperature is " + toCelsius(32) + " Centigrade";

직접 시험해 보세요

예제

JavaScript 함수는 arguments 객체라는 내장 객체를 가집니다。

arguments.length 속성은 함수 호출 시 전달받은 매개변수의 개수를 반환합니다:

function myFunction(a, b) {
  return arguments.length;
}

직접 시험해 보세요

예제

버튼을 클릭하면 함수가 호출되며, 이 함수는 id="demo"의 요소에 "Hello World"를 출력합니다:

<button onclick="myFunction()">나를 클릭하세요</button>
<p id="demo"></p>
<script>
function myFunction() {
  document.getElementById("demo").innerHTML = "Hello World";
}
</script>

직접 시험해 보세요

예제

JavaScript 함수는 표현식을 사용하여 정의될 수 있습니다。

함수 표현식은 변수에 저장될 수 있습니다:

var x = function (a, b) {return a * b};

직접 시험해 보세요

예제

함수 표현식을 변수에 저장한 후, 해당 변수는 함수로 사용될 수 있습니다:

var x = function (a, b) {return a * b};
var z = x(4, 3);

직접 시험해 보세요

브라우저 지원

문장 크롬 IE 파이어폭스 사파리 오페라
function 지원 지원 지원 지원 지원

관련 페이지

JavaScript 강의:JavaScript 함수

JavaScript 강의:JavaScript 범위

JavaScript 강의:JavaScript 함수 정의

JavaScript 강의:JavaScript 함수 매개변수

JavaScript 강의:JavaScript 함수 호출

JavaScript 강의:JavaScript 함수 클로저

JavaScript 참조 가이드:JavaScript return 문