웹 프론트엔드 JS 튜토리얼 JavaScript 탐색: eval()은 '악마'입니다

JavaScript 탐색: eval()은 '악마'입니다

Nov 28, 2016 pm 02:41 PM
JavaScript

현재 코드에서 eval()을 사용하는 경우 "eval()은 악마입니다"라는 진언을 기억하세요. 이 메서드는 모든 문자열을 받아들이고 이를 JavaScript 코드로 처리합니다. 문제의 코드가 미리 알려진 경우(런타임에 결정되지 않음) eval()을 사용할 이유가 없습니다. 코드가 런타임 시 동적으로 생성되는 경우 eval을 사용하지 않고 동일한 목표를 달성하는 더 좋은 방법이 있습니다. 예를 들어 동적 속성에 액세스하려면 대괄호 표기법을 사용하는 것이 더 좋고 간단합니다.

// 反面示例
var property = "name";
alert(eval("obj." + property));
 
// 更好的
var property = "name";
alert(obj[property]);
로그인 후 복사

eval()을 사용하면 실행되는 코드(예: 네트워크에서)가 발생하므로 보안 위험도 발생합니다. 조작되었을 수도 있습니다. 이는 Ajax 요청의 JSON 응답을 처리할 때 매우 흔히 발생하는 부정적인 교훈입니다. 이러한 경우 안전과 효율성을 보장하기 위해 JavaScript 내장 메서드를 사용하여 JSON 응답을 구문 분석하는 것이 가장 좋습니다. 브라우저가 JSON.parse()를 지원하지 않는 경우 JSON.org의 라이브러리를 사용할 수 있습니다.

setInterval(), setTimeout() 및 Function() 생성자에 문자열을 전달하는 것은 대부분의 경우 eval()을 사용하는 것과 유사하므로 피해야 한다는 점을 기억하는 것도 중요합니다. 뒤에서 JavaScript는 프로그램에 전달한 문자열을 평가하고 실행해야 합니다.

// 反面示例
setTimeout("myFunc()", 1000);
setTimeout("myFunc(1, 2, 3)", 1000);
 
// 更好的
setTimeout(myFunc, 1000);
setTimeout(function () {
   myFunc(1, 2, 3);
}, 1000);
로그인 후 복사

new Function() 구문을 사용하는 것은 eval()과 유사하므로 주의해서 접근해야 합니다. 이는 강력한 구조일 수 있지만 종종 오용됩니다. 반드시 eval()을 사용해야 한다면 대신 new Function()을 사용하는 것을 고려해 볼 수 있습니다. new Function()의 코드 평가는 로컬 함수 범위에서 작동하므로 코드에서 평가되는 var로 정의된 모든 변수는 자동으로 전역 변수가 되지 않으므로 작은 잠재적 이점이 있습니다. 자동 전역 변수를 방지하는 또 다른 방법은 eval() 호출을 즉시 함수로 래핑하는 것입니다.

un만이 네임스페이스를 전역 변수로 오염시키는 다음 예를 고려해보세요.

console.log(typeof un);     // "undefined"
console.log(typeof deux);   // "undefined"
console.log(typeof trois);  // "undefined"
 
var jsstring = "var un = 1; console.log(un);";
eval(jsstring);             // logs "1"
 
jsstring = "var deux = 2; console.log(deux);";
new Function(jsstring)();   // logs "2"
 
jsstring = "var trois = 3; console.log(trois);";
(function () {
   eval(jsstring);
}()); // logs "3"
 
console.log(typeof un);     // number
console.log(typeof deux);   // "undefined"
console.log(typeof trois);  // "undefined"
로그인 후 복사

eval()과 Function 구문의 또 다른 차이점은 eval()이 범위 체인을 방해할 수 있는 반면 Function()이 더 안전하다는 것입니다. Function()을 어디에서 실행하든 전역 범위만 표시됩니다. 따라서 지역변수 오염을 효과적으로 방지할 수 있다. 다음 예에서 eval()은 Function이 수행할 수 없는 외부 범위의 변수에 액세스하고 수정할 수 있습니다(Function과 new Function을 사용하는 것은 동일합니다).

(function () {
   var local = 1;
   eval("local = 3; console.log(local)"); // logs "3"
   console.log(local); // logs "3"
}());
 
(function () {
   var local = 1;
   Function("console.log(typeof local);")(); // logs undefined
}());
로그인 후 복사


본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

뜨거운 기사 태그

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

JavaScript로 문자열 문자를 교체하십시오 JavaScript로 문자열 문자를 교체하십시오 Mar 11, 2025 am 12:07 AM

JavaScript로 문자열 문자를 교체하십시오

jQuery는 요소 패딩/마진을 얻습니다 jQuery는 요소 패딩/마진을 얻습니다 Mar 01, 2025 am 08:53 AM

jQuery는 요소 패딩/마진을 얻습니다

jQuery 날짜가 유효한지 확인하십시오 jQuery 날짜가 유효한지 확인하십시오 Mar 01, 2025 am 08:51 AM

jQuery 날짜가 유효한지 확인하십시오

10 JQuery Accordions 탭 10 JQuery Accordions 탭 Mar 01, 2025 am 01:34 AM

10 JQuery Accordions 탭

10 JQuery 플러그인을 확인할 가치가 있습니다 10 JQuery 플러그인을 확인할 가치가 있습니다 Mar 01, 2025 am 01:29 AM

10 JQuery 플러그인을 확인할 가치가 있습니다

노드 및 HTTP 콘솔로 HTTP 디버깅 노드 및 HTTP 콘솔로 HTTP 디버깅 Mar 01, 2025 am 01:37 AM

노드 및 HTTP 콘솔로 HTTP 디버깅

사용자 정의 Google 검색 API 설정 자습서 사용자 정의 Google 검색 API 설정 자습서 Mar 04, 2025 am 01:06 AM

사용자 정의 Google 검색 API 설정 자습서

jQuery div에 스크롤 바를 추가합니다 jQuery div에 스크롤 바를 추가합니다 Mar 01, 2025 am 01:30 AM

jQuery div에 스크롤 바를 추가합니다

See all articles