JSON.parse(), JSON.stringify() 및 eval()_javascript 기술의 기능에 대한 심층 분석

"JSON(JavaScript Object Notation)은 경량 데이터 교환 형식입니다. ECMAScript의 하위 집합을 기반으로 합니다. 언어 독립적인 텍스트 형식을 사용하기 때문에 C 언어 계열과 유사한 습관도 사용하며 다음과 같은 특징을 갖습니다. 이러한 특성으로 인해 JSON은 인간이 쉽게 읽고 쓸 수 있고 기계가 쉽게 구문 분석하고 생성할 수 있는 이상적인 데이터 교환 언어입니다(일반적으로 네트워크 전송 속도를 향상시키는 데 사용됨).”

오늘은 jquery의 JSON.parse() 및 JSON.stringify() 함수에 대해 간략하게 이야기하고 싶습니다. 그런데 기본 JS의 eval() 함수에 대해서도 언급하겠습니다

(1) JSON.parse 기능

함수: JSON(JavaScript Object Notation) 문자열을 객체로 변환합니다. ​

구문: JSON.parse(text [, Revival])

매개변수:

텍스트　필수입니다. 유효한 JSON 문자열입니다.

부활 선택사항. 결과를 변환하는 함수입니다. 이 함수는 개체의 각 구성원에 대해 호출됩니다.

반환 값: 객체 또는 배열

예:

var json = '{"name":"GDT","age":,"University":"GDUT"}';
var info = JSON.parse(json);　　//解析为JSON对象
document.write(info.name + ' is a student of ' + info.University + ' and he is ' + info.age + " years old."); /info为Object对象

(2) JSON.stringify() 함수

함수: JavaScript 값을 JSON(JavaScript Object Notation) 문자열로 변환

구문: JSON.stringify( value [, replacement] [, space])

매개변수:

value　필수, 일반적으로 변환해야 하는 JavaScript 값(일반적으로 객체 또는 배열)

replacer　결과를 변환하는 데 사용되는 선택적, 함수 또는 배열

공간 선택사항. 읽기 쉽도록 반환 값 JSON 텍스트에 들여쓰기, 공백 및 줄 바꿈을 추가합니다.

반환 값: JSON 텍스트가 포함된 문자열

예:

var info = {name:"GDT",age:,University:"GDUT"};
var json = JSON.stringify(info); //转换为JSON字符串
document.write(json); //output为{"name":"GDT","age":23,"University":"GDUT"}

(3) eval() 함수

함수: eval() 함수는 문자열을 계산하고 그 안의 JavaScript 코드를 실행할 수 있습니다.

구문: eval(문자열)

매개변수:

string　필수, 평가할 JavaScript 표현식 또는 실행할 명령문이 포함된 평가할 문자열입니다.

반환값: 계산된 문자열의 값이 있으면 반환(없으면 변경 없이 반환)

예:

eval("x=;y=;document.write(x*y)"); //output为
document.write(eval("+"));　　//output为
var x=;
document.write(eval(x+));　　//output为

JSON 문자열을 객체로 구문 분석하려면 eval() 함수를 사용하세요. 이 함수는 JSON.parse()의 기능을 완성할 수 있지만 다음 코드를 참조하세요.

// JSON.parse()
var json = '{"name":"GDT","age":,"University":"GDUT"}';
var info = JSON.parse(json);　　　 //解析为JSON对象
document.write(info); //output为[object Object]
//eval()
var json = '{"name":"GDT","age":,"University":"GDUT"}';
var info = eval('(' + json + ')'); //解析为JSON对象
document.write(info); //output为[object Object]

eval()도 문자열을 묶기 위해 한 쌍의 괄호를 사용한다는 사실을 눈치채셨는지 모르겠습니다. 이에 대한 더 나은 설명을 찾았습니다.

이유: eval 자체의 문제 때문입니다. json은 "{}"로 시작하고 끝나기 때문에 JS에서는 명령문 블록으로 처리되므로 강제로 표현식으로 변환해야 합니다. .

해결책: 괄호를 추가하는 목적은 JavaScript 코드를 처리할 때 명령문으로 실행하는 것이 아니라 eval 함수가 괄호 안의 표현식을 객체로 변환하도록 강제하는 것입니다. 예를 들어 객체 리터럴 {}을 사용하면 외부 대괄호가 추가되지 않으면 eval은 중괄호를 JavaScript 코드 블록의 시작 및 끝 표시로 인식하고 {}는 빈 문을 실행하는 것으로 간주됩니다. 다음 예시를 통해 차이점을 확인해보세요

alert(eval("{}")); // return undefined
alert(eval('('+'{}'+')')); // return object[Object] 

또한 엄격한 쓰기 형식을 사용하는 JSON.parse()에 비해 eval()은 모든 문자열을 구문 분석할 수 있습니다. eval은 상대적으로 느슨하고 잠재적인 보안 문제가 있기 때문에 안전하지 않습니다. 예를 들어 다음 코드는 다음과 같습니다.

var str = '{"a":"b"}';
document.write(eval("("+str+")")); //正常解析为对象
var str = '{"a": (function(){alert("I can do something bad!");})()}';
eval('('+str+')'); //可以用来执行木马脚本 

악의적인 사용자가 json 문자열에 페이지에 트로이 목마 링크를 삽입하는 스크립트를 삽입하는 경우에도 eval을 사용하여 작동할 수 있습니다. 하지만 JSON.parse()를 사용하면 이 문제를 걱정할 필요가 없습니다. eval() 함수는 매우 강력하지만 실제로 사용할 기회가 많지 않다는 것을 알 수 있습니다.

개인적인 요약을 할 시간입니다. 4월 1일 만우절에 탄생한 블로그입니다. 현재 기술이 형편없기 때문에 양해해 주시기 바랍니다. 지금 할 수 있다는 걸 차근차근 쌓아가며 앞으로의 성공을 위한 좋은 기반을 마련해 파이팅~