[Javascript] eval() 사용방법

몇 개월간을 기다려오던 스터디 모임에서 스터디를 시작하기 위해 문제를 내주었다.

eval() 함수를 이용해서 데이터를 확인하는 내용의 문제였다.

 

이 문제에서 가장 중요했던 부분은

 

eval(function(p,a,c,k,e,r){e=function(c){return c.toString(a)};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('$(0(){$(".2").3();$(4).5(\'6\',"#7",0(){$.8({9:"d",e:"/f/g.h",i:"j",k:0(){l()},m:0(a){1(a.n)},o:0(a,b,c){1(\'에러가 발생하였습니다.\')},p:0(){q()}})})});',27,27,'function|alert|btnDiv|hide|document|on|click|btn|ajax|type||||POST|url|exam|answerExamQuestion|do|dataType|json|beforeSend|lodingBarStart|success|resultMsg|error|complete|lodingBarEnd'.split('|'),0,{}))

 

이 함수를 어떻게 사용하는가였다.

 

javascript를 사용해서 단순 함수 실행인줄 알았는데 eval()은 그런 형태가 아니었다.

 

콘솔환경에서 console.log()를 이용해서 funtion 함수를 확인한 후에 실행하는 것이었다.

 

위 코드를 console.log()로 실행해보면

 

$(function(){
   $(".btnDiv").hide();
   $(document).on('click',"#btn",function(){
      $.ajax({
         type:"POST",
         url:"/exam/answerExamQuestion.do",
         dataType:"json",
         beforeSend:function(){
           lodingBarStart();
         },
         success:function(a){
           alert(a.resultMsg);
         },
         error:function(a,b,c){
           alert('에러가 발생하였습니다.');
         },         complete:function(){
           lodingBarEnd();
         }
     })
  })
});

 

와 같은 함수가 나오게 된다.

 

이 함수를 개발자모드에서 $('#btn').click(); 로 실행하게 되면 success 되면서 해당 값을 가지고와 alert 창에 데이터를 보여주게 된다.

 

1시간 가량을 노가다를 하면서 얻은 나름(?) 값진 경험이었다.

 

eval() 함수는 안쓰는게 함정이지만 재미있었다.