JavaScript에서 변수에 함수 할당

Muhammad Muzammil Hussain 2023년10월12일
  1. HTML에서 JavaScript를 사용하여 변수에 함수를 할당하는 예
  2. 주어진 HTML 코드 검사
  3. JavaScript에서 변수에 함수를 할당하는 다른 방법
JavaScript에서 변수에 함수 할당

이 기사에서는 선언된 함수를 변수에 할당하고 함수에 매개변수가 포함되어 있는지 여부를 확인하는 방법을 설명합니다. 변수와 관련된 함수는 모든 값을 반환하고 해당 값을 변수에 저장할 수 있습니다. 할당된 변수를 사용하여 원하는 만큼 함수를 호출할 수도 있습니다.

var variable_name = function functionName() {};

HTML에서 JavaScript를 사용하여 변수에 함수를 할당하는 예

사용자가 지정한 값이 짝수인지 홀수인지 식별하는 함수를 checkValue 변수에 할당합니다. 기능은 사용자가 입력에 값을 삽입하고 submit 버튼을 누를 때마다 트리거됩니다. 해당 함수를 호출하고 value is even 또는 value is odd라는 경고 상자를 표시해야 합니다.

<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML | Assign Function to Variable Example
    </title>
 
    <script type="text/javascript">
    </script>
 
</head>
 
<body>
 
    <h2>Hi Users Check your choosen value is a even or odd.</h2>
   <form id="form" onsubmit="return false;">
    <input type="text" id="userInput" maxlength="1" placeholder="Enter any number" />
    <input  type="submit" onclick="checkValue();" />
</form>

<script>
    // function to check value is even or odd
var checkValue = function() {
    var givenValue = document.getElementById("userInput").value;
if(givenValue % 2 == 0){
  alert(givenValue+" is even")
}
else {
   alert(givenValue+" is odd")
}

}
</script>
 
</body>
<html>

위의 HTML 페이지 소스에서 사용자로부터 정수 값을 가져오는 간단한 입력 형식의 숫자를 볼 수 있으며 submit 버튼이 있어 값을 제출하고 기능을 진행합니다.

여기에서 doctype HTML에서 JavaScript 문을 사용하는 데 필요한 <script> 태그를 볼 수 있습니다. 해당 태그에서 선언된 checkValue 변수에 함수를 할당했습니다.

함수는 givenValue 변수에 사용자가 지정한 값을 포함합니다. 다음 단계에서는 모듈러스 연산자(%)와 함께 조건문을 사용하여 주어진 값의 나머지가 2인지 여부를 확인했습니다.

다음 단계에서 function()은 조건에 따라 given value is even 또는 given value is odd를 포함하는 경고 상자를 사용자에게 단순히 표시합니다.

주어진 HTML 코드 검사

코드를 명확하게 이해하려면 아래의 모든 단계를 따르세요.

var variable_name = function functionName() {};
  • 메모장이나 다른 텍스트 편집 도구를 사용하여 텍스트 문서를 만듭니다.
  • 생성된 텍스트 파일에 주어진 코드를 붙여넣습니다.
  • 확장자가 .html인 텍스트 파일을 저장하고 기본 브라우저에서 엽니다.
  • 값을 입력하는 입력 양식과 제출 버튼을 볼 수 있습니다. 해당 버튼을 사용하여 값을 확인할 수 있습니다.

JavaScript에서 변수에 함수를 할당하는 다른 방법

아래 그림과 같이 동일한 결과도 얻을 수 있습니다. 매개변수가 있는 변수에 함수를 할당하여 값을 전달하고 값을 확인하고 조건부로 명령문을 반환합니다.

var checkEvenOdd =
    function(value) {
  // will check passed value
  if (value % 2 == 0) {
    return value + ' is even'
  } else {
    return value + ' is odd'
  }
}

    console.log(checkEvenOdd(2))

출력:

2

위의 예에서 정수 값을 매개변수로 전달해야 하는 함수와 함께 할당된 checkEvenOdd는 주어진 if 조건으로 해당 값을 확인하고 문자열을 반환합니다. 다음 단계에서 checkEvenOdd() 함수는 console.log()에서 호출되어 결과를 표시합니다.

관련 문장 - JavaScript Function

관련 문장 - JavaScript Variable