>  기사  >  웹 프론트엔드  >  【JavaScript 튜토리얼】JavaScript 기능

【JavaScript 튜토리얼】JavaScript 기능

黄舟
黄舟원래의
2016-12-24 14:50:05907검색

JavaScript 함수

함수는 호출 시 실행되는 이벤트 기반 또는 재사용 가능한 코드 블록입니다.

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
alert("Hello World!");
}
</script>
</head>

<body>
<button onclick="myFunction()">Try it</button>
</body>
</html>

JavaScript 함수 구문

함수는 중괄호로 묶인 코드 블록이며 앞에 function이라는 키워드가 사용됩니다.

function functionname()
{
执行代码
}

이 함수가 호출되면 함수 내의 코드가 실행됩니다.

함수는 이벤트가 발생할 때(예: 사용자가 버튼을 클릭할 때) 직접 호출할 수 있으며 JavaScript를 통해 어디서나 호출할 수 있습니다.

JavaScript는 대소문자를 구분합니다. function 키워드는 소문자여야 하며, 함수 이름과 동일한 대소문자를 사용하여 함수를 호출해야 합니다.

매개변수를 사용하여 함수 호출

함수를 호출할 때 매개변수라고 하는 값을 전달할 수 있습니다.

이러한 매개변수는 함수에서 사용할 수 있습니다.

쉼표(,)로 구분하여 원하는 만큼 매개변수를 보낼 수 있습니다.

myFunction(argument1,argument2)

함수를 선언할 때 매개변수를 변수로 선언하세요.

function myFunction(var1,var2)
{
代码
}

변수와 매개변수는 일관된 순서로 나타나야 합니다. 첫 번째 변수는 전달된 첫 번째 매개변수의 지정된 값입니다.

<button onclick="myFunction(&#39;Harry Potter&#39;,&#39;Wizard&#39;)">Try it</button>

<script>
function myFunction(name,job)
{
alert("Welcome " + name + ", the " + job);
}
</script>

위 함수는 버튼을 클릭하면 "Welcome Harry Potter, the Wizard"라는 메시지가 표시됩니다.

함수는 유연하며 다양한 매개변수를 사용하여 호출할 수 있으며, 이는 다양한 메시지를 제공합니다.

인스턴스

<button onclick="myFunction(&#39;Harry Potter&#39;,&#39;Wizard&#39;)">Try it</button>
<button onclick="myFunction(&#39;Bob&#39;,&#39;Builder&#39;)">Try it</button>

클릭한 항목에 따라 다른 버튼, 위의 예에서는 "Welcome Harry Potter, the Wizard" 또는 "Welcome Bob, the Builder"라는 메시지가 표시됩니다.

반환 값이 있는 함수

때때로 함수가 호출된 위치에 값을 반환하는 기능이 필요할 때가 있습니다.

이는 return 문을 사용하여 수행할 수 있습니다.

return 문을 사용하면 함수 실행을 중지하고 지정된 값을 반환합니다.

구문

function myFunction()
{
var x=5;
return x;
}

위 함수는 값 5를 반환합니다.

참고: 전체 JavaScript는 실행을 중지하지 않고 함수만 중지합니다. JavaScript는 함수가 호출된 위치부터 코드를 계속 실행합니다.

함수 호출은 반환 값으로 대체됩니다.

var myVar=myFunction();

myVar 변수의 값은 "myFunction()" 함수에서 반환된 값인 5입니다.

변수로 저장하지 않고도 반환 값을 사용할 수 있습니다.

document.getElementById("demo").innerHTML=myFunction();

"demo" 요소의 innerHTML은 5가 됩니다. 이는 "myFunction( )"는 값을 반환합니다.

함수에 전달된 인수를 기준으로 반환 값을 지정할 수 있습니다.

두 숫자의 곱을 계산하여 결과를 반환합니다.

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

document.getElementById("demo").innerHTML=myFunction(4,3);

"demo" 요소의 innerHTML은 다음과 같습니다.

12

단순히 함수를 종료하려는 경우 return 문을 사용할 수도 있습니다. 반환 값은 선택 사항입니다.

function myFunction(a,b)
{
if (a>b)
  {
  return;
  }
x=a+b
}

a가 b보다 큰 경우 위 코드는 함수를 종료하고 a와 b의 합을 계산하지 않습니다.

로컬 자바스크립트 변수

자바스크립트 함수 내에서 var를 사용하여 선언한 변수는 로컬 변수이므로 함수 내에서만 접근할 수 있습니다. (이 변수의 범위는 로컬입니다.)

변수가 선언된 함수에서만 변수를 인식하므로 같은 이름의 지역 변수를 다른 함수에서 사용할 수 있습니다.

지역 변수는 함수가 완료되는 즉시 삭제됩니다.

전역 자바스크립트 변수

함수 외부에서 선언된 변수는 전역 변수이며 웹페이지의 모든 스크립트와 함수에서 접근할 수 있습니다.

JavaScript 变量的生存期

JavaScript 变量的生命期从它们被声明的时间开始。

局部变量会在函数运行以后被删除。

全局变量会在页面关闭后被删除。

向未声明的 JavaScript 变量分配值

如果您把值赋给尚未声明的变量,该变量将被自动作为全局变量声明。

这条语句:

carname="Volvo";

将声明一个全局变量 carname,即使它在函数内执行。

 以上就是【JavaScript教程】JavaScript 函数的内容,更多相关内容请关注PHP中文网(www.php.cn)!


성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.