새소식

300x250
2. 웹개발/환경설정 & etc

JSON 파싱 eval vs JSON.parse

  • -
728x90

 

Eval VS JSON

 

- eval을 사용하지 않고 JSON.parse로 충분히 구현가능.
- 보안상 javascript 코드 바로실행가능 즉, 쓰지 말자
- eval로 실행할 코드는 컴파일러가 미리 최적화  X

- 프레임워크 구현 보다 높은 수준에서 자바스크립트 사용시 eval 적절히 활용이 필수

 

eval 함수의 파라미터로 입력된 String은 JavaScript 파서에 의해 구문 분석되고 실행된다.
eval 함수에 전달된 코드는 eval 함수가 호출되는 것과 같은 상황에서 실행되며, 실행된 코드에 리턴값이 있는 경우 해당값을 리턴.

JSON 데이터의 경우 JSON.parse함수를 사용해 JSON(JavaScript Object Notation) 텍스트를 deserialize 하는 것이 eval 함수보다 안전하고 실행속도도 빠르다.


<script type="text/javascript">
// JSON 표기법
var jsonStr = "{no:1, name:'갓댐'}";
eval("var Obj = ("+ jsonStr +")" );
document.write(Obj.no + ', ');
document.write(Obj.name);
</script>


eval()은 빠르기는 하지만 단순히 그안의 스트링을 그대로 실행시켜 주는 것이기 때문에 리턴값으로 자바스크립트 명령문이 온다면 그대로 실행시켜버리기 때문에 보안이슈가 발생할 수 있다. 

자세히  jsonStr을 보면 위 eval에서 사용한 json은 json 형식에 위배 된다.  " 가 안들어갔음


 <script type="text/javascript">
var jsonStr = '{"no":1, "name":"갓댐"}';
//eval("var obj = ("+ jsonStr +")" );
var obj = JSON.parse(jsonStr);
document.write(obj.no + ', ');
document.write(obj.name);
</script>


최신브라우저는 javascript 엔진이 JSON을 객체로 채택한듯 하다.

JSON 의 현재 최신브라우저에서는 정상적으로 동작하나 예전 구형 브라우저에서는  JSON 객체를 못찾을수 있다.


그러한 문제를 해결하기 위해서는
JSON.parse()를 사용하기 위해서는 Douglas Crockford가 만든 json2.js가 필요하다.
json2.js는 더글라스 크록포드가 JSON의 편리한 사용을 위해 만든 JSON API의 새버전이다.
(그래서 2가 붙어있다.)

- www.json.org 접속
- 하단 메뉴중 JavaScript - json2.js 클릭
json2,.js 파일을
<script type="text/javascript" src="json2.js"></script>  해줘야 한다.

300x250
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.