js의 중괄호에는 네 가지 의미 기능이 있습니다
의미 1, 가장 일반적인 복합문 구성
if( 조건 ) {
//...
}else {
//...
}
for() {
//...
}
의미론 2, 객체 리터럴 선언
var obj = {
name : 'jack',
age : 23
};
전체가 대입문이고, 여기서 {name:'jack',age:23}은 표현식이고 단독으로 존재하면 문법 오류가 없습니다.
의미 3, 함수 또는 함수 리터럴 선언
function f1(){
//...
}
var f2 = function(){
//...
}
f1과 non-f2의 차이점은 전자는 구문 해석 기간에 있고 후자는 런타임에 있다는 점입니다. 차이점은 다음과 같습니다. 함수를 호출하는 코드가 함수 정의 뒤에 있으면 차이가 없습니다. 함수를 호출하는 코드가 함수 정의 앞에 있으면 f1은 계속 호출될 수 있지만 f2는 다음과 같은 오류를 보고합니다. f2가 정의되지 않았습니다.
의미론 4, 구조적 예외 처리를 위한 구문 기호
try {
//...
}catch( ex ){
//...
}마지막으로{
//...
}
여기의 중괄호와 일치하는 문(의미 1)에는 차이가 있습니다. 중괄호에 문이 하나만 있는 경우 if/else/에서 중괄호를 생략할 수 있습니다. for 등. 단, try/catch/finally는 생략할 수 없습니다.
다음 코드 때문에 오랫동안 고생했습니다
function(){}() //익명 함수는 즉시 실행되며 구문 분석 중에 오류가 보고됩니다.
{}.constructor //생성자를 가져옵니다.
의아스러운 점은 [].constructor가 이렇게 작성되었지만 오류를 보고하지 않는 이유입니다. 객체의 직접 값이고 다른 하나는 배열의 직접 값을 얻으려는 생성자일 뿐입니다.
물론, receive 변수를 추가해도 오류가 보고되지 않습니다.
var c = {}.constructor;
같은 상황에서
var fn = function(){}() , 오류가 보고되지 않습니다.
실제로 문제를 일으키는 것은 js의 "문 우선순위"입니다. 즉, {}는 객체 리터럴의 의미(의미 2)나 선언된 함수가 아닌 복합 명령문 블록(의미 1)으로 이해됩니다. (의미 3).
function(){}()에서 중괄호는 복합문으로 이해됩니다. 당연히 이전 function() 선언 함수의 구문이 불완전하여 구문 분석 중에 오류가 발생합니다.
{}.constructor에서 중괄호는 복합문으로 이해되며, 중괄호 뒤에 도트 연산자가 옵니다. 도트 연산자 앞에 합리적인 개체가 없으면 자연스럽게 오류가 보고됩니다.
수정 사항은 잘 알려져 있습니다. 필수 연산자()를 추가합니다.
(function(){})(), (function(){});//강제로 함수로 이해되도록 합니다(의미론적) 3) "함수( )"는 함수가 실행된다는 의미, 즉 선언 직후에 실행된다는 뜻이다.
({}).constructor //({})는 중괄호를 객체 리터럴로 이해하도록 합니다(의미 체계 2). "Object.xx"는 당연히 객체의 멤버를 얻는 것을 의미합니다. 정상적으로 실행됩니다.
확장: JQUERY 플러그인 작성을 미리 실행해야 합니다
일부 JQ 플러그인을 주의 깊게 살펴보면 다음과 같은 코드를 종종 발견할 수 있습니다. (function($){$(function( ){/*code*/})}($))
위 글을 읽어보시면 왜 많은 JQ 플러그인이 필요한지 알게 되실 겁니다. 네, 그런데 글을 쓸 때 이런 플러그인은 거의 접하지 못하는데 장점이 많네요~~