[JavaScript]eval 함수 사용법

 

eval 함수란?

eval() 함수는 전달된 문자열을 JavaScript 코드로 해석하여 해석된 코드를 실행합니다. 만약, 해석하지 못하면 SyntaxError가 발생합니다.

 

eval() 함수는 JavaScript의 전역 객체이며, 해석된 코드에서 마지막 표현식 또는 구문 값을 반환합니다. 이때, 값이 존재하지 않으면 undefined를 반환합니다.

 

목차

1. eval() 함수 사용 방법
2. 엄격 모드의 eval() 함수
3. eval() 함수 내부에서 함수를 정의

---

eval() 함수 사용 방법

다음은 eval() 함수를 사용하여 콘솔에 메시지를 출력하는 코드입니다.

eval("console.log('Hello World')");

실행 결과

 

eval() 함수는 다음 코드처럼 여러 JavaScript문을 실행할 수 있습니다.

eval("var x = 10; x = x + 10; console.log(x)");

실행 결과

 

지역 스코프(Local Scope)에서 eval() 함수 호출

eval() 함수는 다른 함수에서 사용할 수 있습니다.

 

다음은 다른 함수에서 eval() 함수를 호출하는 코드입니다.

var strVal1 = "Eval() ";

function printStrValue() { 
    var strVal2 = "Func"; 
    eval('var strResult = strVal1 + strVal2'); 
    console.log(strResult); 
}

printStrValue();

실행 결과

eval() 함수는 전역 함수이므로 로컬 스코프(Local Scope)에서 사용할 수 있습니다. 즉, printStrValue() 함수 내부에서 eval() 함수를 사용할 수 있습니다.

 

하지만, eval() 함수를 참조하여 간접적으로 호출하는 경우 문제가 발생합니다.

 

다음은 printStrValue() 함수 내부에서 eval() 함수를 변수에 할당 후 간접적으로 호출하는 코드입니다.

var strVal1 = "Eval() ";

function printStrValue() { 
    var strVal2 = "Func"; 
    var callEvalFunc = eval;
    callEvalFunc('var strResult = strVal1 + strVal2')
    console.log(strResult); 
}

printStrValue();

실행 결과

변수 callEvalFunc는 eval() 함수를 할당받았기에 전역 범위에서 호출됩니다. 하지만, printStrValue() 함수의 지역 스코프에 존재하는 변수 strVal2에 접근할 수 없어서 참조 오류가 발생합니다.

---

엄격 모드의 eval() 함수

다음은 eval() 함수를 호출하는 간단한 코드이며, 정상적으로 실행됩니다.

eval("var str = 'Hello World'");
console.log(str);

실행 결과

 

엄격 모드(use strict)를 추가 후 동일한 코드를 실행합니다.

'use strict'
eval("var str = 'Hello World'");
console.log(str);

실행 결과

엄격 모드를 사용하면, eval() 함수 내부의 변수 str은 전역 범위(Global Scope)에서 사용할 수 없으며, eval() 함수 내부에서만 사용할 수 있습니다.

---

eval() 함수 내부에서 함수를 정의

다음은 eval() 함수 내부에서 함수를 정의하는 코드입니다.

eval("(function printValue() {console.log('Hello World')})");

printValue();

실행 결과

eval() 함수에서 printValue() 함수를 정의하여 전역 객체에 추가될거라 예상했지만, 에러가 발생합니다.

 

eval() 함수는 단순히 표현식을 평가하며, printValue() 함수를 반환합니다.

 

printValue() 함수를 사용하려면 eval() 함수의 반환 값을 사용합니다.

var evalReturn = eval("(function printValue() {console.log('Hello World')})");

evalReturn();

실행 결과

 

다음은 위 코드에서 eval() 함수 내부에 "( )"를 제거 후 반환 값을 확인하는 코드입니다.

var evalReturn = eval("function printValue() {console.log('Hello World')}");

console.log(evalReturn);

실행 결과

이전 예제와는 달리 undefined를 반환합니다.

 

즉, eva() 함수 내부에서 함수를 정의하는 경우 "( )" 사용 여부에 결과가 달라질 수 있습니다.