<strong>1. 서문</strong> <br>함수를 먼저 정의한 후 사용해야 합니다. 이는 기본적으로 모든 프로그래밍 언어의 철칙입니다. <br>일반적으로 JavaScript 함수를 호출해야 하는 경우 기본 상황은 함수를 먼저 정의한 다음 호출하는 것입니다. 예시 보기<br><div class="codetitle"> <span><a style="CURSOR: pointer" data="95148" class="copybut" id="copybut95148" onclick="doCopy('code95148')"><u>코드 복사</u></a></span> 코드는 다음과 같습니다.</div> <div class="codebody" id="code95148"> <br><-- by oscar999 2013- 1-16--> <br><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/ Loose.dtd" > <br><html> <br><head> <br><meta http-equiv="Content-Type" content="text/html"> <br>< ;title>Say Hello</title> <br><body> <br><script>//함수 sayHello() <br>{ <br>alert("hello"); <br>//함수 호출 <br>sayHello() <br></body> </html> ; <br><br> <br>그런데 함수를 명시적으로 호출할 필요가 없고 함수가 정의되었을 때 실행되도록 하려면 어떻게 작성해야 할까요? <br><br>2. 사고과정<br> <br>위의 예시를 보면 위의 사용 조건을 똑똑히 조합해 보면 다음과 같이 생각할 수 있습니다. </div>===》함수에 호출이 있으므로 함수 정의 뒤에 중괄호 한 쌍을 추가하면 실행될 수 있나요? 다음과 같습니다. <br><br><strong></strong><br>코드 복사<br><br><div class="codetitle"> 코드는 다음과 같습니다.<span><a style="CURSOR: pointer" data="86862" class="copybut" id="copybut86862" onclick="doCopy('code86862')"> <u>function sayHello() </u>{ </a>alert("hello"); </span>}(); </div> <div class="codebody" id="code86862"> <br>안타깝게도 위의 작성 방법은 js 구문 오류를 보고합니다. <br>자바스크립트 파서는 전역 함수나 함수 내부 함수 키워드를 파싱할 때 기본적으로 함수 표현식 대신 중괄호를 함수 명령문으로 파싱하기 때문입니다. <br><br>즉, 마지막 중괄호 쌍은 기본적으로 이름이 없는 함수로 구문 분석되며, 함수 선언에 이름이 필요하기 때문에 구문 오류 메시지가 발생합니다. <br> </div>===》 중괄호 안에 매개변수를 전달하면 표현식으로 파싱될까?라고 생각할 수도 있습니다. <br><br><br><br><br>코드 복사<br><br><div class="codetitle"> 코드는 다음과 같습니다.<span><a style="CURSOR: pointer" data="64836" class="copybut" id="copybut64836" onclick="doCopy('code64836')"> <u>function sayHello() </u>{ </a>alert ("hello"); </span>}(1); </div> <div class="codebody" id="code64836"> <br>실제로 오류가 사라졌습니다. 하지만 위의 쓰기 방법은 다음 쓰기 방법의 효과와 동일합니다 <br><br><br><br> </div> 코드 복사 <br><br><div class="codetitle"> 코드는 다음과 같습니다 <span><a style="CURSOR: pointer" data="4357" class="copybut" id="copybut4357" onclick="doCopy('code4357')"> <u>function sayHello () </u>{ </a>alert("hello") </span>} </div>(1) <div class="codebody" id="code4357"> <br> <br> 서로 관련이 없으면 함수가 실행되지 않습니다<br><br>3. 올바른 표기 <br> <br>JavaScript의 경우 괄호() 안에 문장을 넣을 수 없으므로 이때 파서가 함수 키워드를 구문 분석하면 함수 선언이 아닌 함수 표현식으로 구문 분석됩니다. 따라서 전체 코드(함수 부분과 끝에 있는 중괄호 쌍 포함)를 중괄호로 묶으세요. </div> <br><br><strong></strong>코드 복사<br><br><div class="codetitle"> 코드는 다음과 같습니다. <span><a style="CURSOR: pointer" data="85794" class="copybut" id="copybut85794" onclick="doCopy('code85794')"> <u>(function sayHello() </u>{ </a> Alert("hello"); </span>}()); </div> <div class="codebody" id="code85794"> <br><br><br> <br><br>코드 복사</div> <br><br> 코드는 다음과 같습니다.<div class="codetitle"><span> <a style="CURSOR: pointer" data="68041" class="copybut" id="copybut68041" onclick="doCopy('code68041')">(function sayHello() <u>{ </u>alert( "hello"); </a>})(); </span></div> <div class="codebody" id="code68041">첫 번째 방법을 사용하는 것이 좋습니다. <br>그러나 현재 더 나은 js 라이브러리 중 다수는 두 번째 방법을 사용하고 있습니다. <br>예: 웹 그래픽 드로잉: git, draw2d,....</div>