자바스크립트에서 JSON 데이터 처리를 위한 네 가지 라이브러리 소개
JSON(JavaScript Object Notation)은 많은 웹 애플리케이션에서 데이터 교환을 위한 주요 포맷입니다. 그러나 크기가 큰 JSON 파일을 처리하거나, 보안적인 측면에서 안전하게 JSON 데이터를 처리하는 등 복잡한 작업을 수행하려면, 기본적인 JSON 메서드인 JSON.parse와 JSON.stringify만으로는 부족할 때가 있습니다. 이럴 때 사용할 수 있는 몇 가지 라이브러리에 대해 알아보겠습니다.
1. Lodash
Lodash는 JavaScript에서 가장 널리 사용되는 유틸리티 라이브러리 중 하나입니다. Lodash는 배열, 숫자, 객체, 문자열, 함수 등을 다루는 데 필요한 많은 메서드를 제공합니다. JSON 데이터를 처리하는 데 특히 유용합니다.
- 공식 사이트: https://lodash.com/
▼ 예제 코드
<!DOCTYPE html>
<html>
<head>
<script src="js/lodash.min.js"></script>
</head>
<body>
<script>
// object 변수에 객체 할당
let object = {
name: "BlueShare",
age: 30,
gender: "man",
city: "Seoul",
};
// Lodash의 create 함수를 사용하여 object를 복사한 other 생성
let other = _.create(object);
// other의 name 속성 출력
console.log(other.name); // 출력: 'BlueShare'
// other의 age 속성 출력
console.log(other.age); // 출력: 30
// other의 gender 속성 출력
console.log(other.gender); // 출력: 'man'
// other의 city 속성 출력
console.log(other.city); // 출력: 'Seoul'
</script>
</body>
</html>
위 코드는 Lodash 라이브러리를 이용하여 JavaScript 객체를 복사하는 예제입니다. 여기서 _.create 함수는 첫 번째 인자로 받은 객체를 복사하여 새 객체를 생성합니다. 이때 생성된 객체는 원본 객체의 속성을 모두 가지게 됩니다.
따라서, 이 코드를 실행하면 콘솔에 ‘BlueShare’, 30, ‘man’, ‘Seoul’이 차례로 출력됩니다. 이는 other 객체가 object 객체의 속성을 모두 복사하였기 때문입니다.
2. Underscore.js
Underscore.js는 Lodash와 유사한 기능을 제공하는 또 다른 유틸리티 라이브러리입니다. 이 라이브러리는 특히 JSON 데이터의 속성을 점검하는 데 유용합니다.
- 공식 사이트: https://underscorejs.org/
▼ 예제 코드
<script src="js/underscore-umd-min.js"></script>
<script>
// object 변수에 객체 할당
let object = {
name: "BlueShare",
age: 30,
};
// Underscore.js의 has 함수를 사용하여 객체에서 'name' 속성의 존재 여부 확인
let hasName = _.has(object, "name");
// 'name' 속성의 존재 여부 출력
console.log(hasName); // 출력: true
// Underscore.js의 has 함수를 사용하여 객체에서 'age' 속성의 존재 여부 확인
let hasAge = _.has(object, "age");
// 'age' 속성의 존재 여부 출력
console.log(hasAge); // 출력: true
</script>
위 코드는 Underscore.js 라이브러리를 사용하여 JavaScript 객체에서 특정 속성의 존재 여부를 확인하는 예제입니다. Underscore.js의 _.has 메서드는 첫 번째 인자로 받은 객체에서 두 번째 인자로 받은 키(속성명)가 존재하는지를 boolean 값으로 반환합니다.
따라서, 이 코드를 실행하면 콘솔에 true, true가 차례로 출력됩니다. 이는 object 객체에 ‘name’, ‘age’ 속성이 모두 존재하기 때문입니다.
3. Stream-json
stream-json은 Node.js 환경에서 동작하는 라이브러리로, 큰 JSON 파일을 처리하는 데 특화되어 있습니다. 이 라이브러리를 사용하면 메모리 문제없이 대용량의 JSON 데이터를 효율적으로 처리할 수 있습니다.
▼ 예제 코드
// Node.js 내장 모듈인 'fs' (파일 시스템)를 불러옵니다.
let fs = require('fs');
// 'stream-json' 라이브러리의 'StreamArray' 모듈을 불러옵니다.
let StreamArray = require('stream-json/streamers/StreamArray');
// 'StreamArray' 모듈을 사용하여 JSON 스트림을 생성합니다.
let jsonStream = StreamArray.make();
// JSON 스트림에 'data' 이벤트 리스너를 등록합니다.
// 'data' 이벤트는 스트림이 새로운 데이터를 받았을 때 발생합니다.
// 이 리스너는 새로운 데이터가 도착하면 해당 데이터의 인덱스와 값이 출력됩니다.
jsonStream.output.on('data', function(object){
console.log(object.index, object.value);
});
// 'fs' 모듈의 'createReadStream' 메서드를 사용하여 'bigfile.json' 파일을 읽어들이고, 읽어들인 데이터를 jsonStream에 전달합니다.
fs.createReadStream('bigfile.json').pipe(jsonStream.input);
위 코드는 ‘stream-json’ 라이브러리를 사용하여 대용량의 JSON 파일을 읽고 처리하는 예제입니다. ‘stream-json’ 라이브러리는 JSON 데이터를 스트림으로 처리하여 메모리 사용량을 최소화하고, 대용량 파일도 효율적으로 처리할 수 있게 해 줍니다.
4. jsonwebtoken
jsonwebtoken은 JSON Web Token(JWT)를 생성하고 검증하는 데 사용되는 라이브러리입니다. JWT는 웹 애플리케이션에서 사용자 인증을 위한 표준 방식 중 하나이며, 이 라이브러리를 통해 안전하게 토큰을 관리할 수 있습니다.
▼ 예제 코드
// 'jsonwebtoken' 라이브러리를 불러옵니다.
var jwt = require('jsonwebtoken');
// 'jsonwebtoken'의 'sign' 함수를 사용하여 새로운 JSON Web Token(JWT)을 생성합니다.
// 이 함수는 첫 번째 인자로 전달받은 데이터를 토큰으로 변환하고, 두 번째 인자로 전달받은 문자열을 비밀 키로 사용하여 토큰을 서명합니다.
// 이 예제에서는 데이터로 { foo: 'bar' } 객체를, 비밀 키로 'shhhhh' 문자열을 사용합니다.
var token = jwt.sign({ foo: 'bar' }, 'shhhhh');
// ... 이후 ...
// 'jsonwebtoken'의 'verify' 함수를 사용하여 토큰을 검증합니다.
// 이 함수는 첫 번째 인자로 전달받은 토큰을, 두 번째 인자로 전달받은 비밀 키를 사용하여 검증합니다.
// 토큰이 유효하면 콜백 함수의 두 번째 인자로 전달받은 데이터에 암호화되었던 데이터를 담은 객체를 반환합니다.
jwt.verify(token, 'shhhhh', function(err, decoded) {
// 이 예제에서는 콜백 함수에서 반환받은 데이터 객체의 'foo' 속성을 출력합니다.
console.log(decoded.foo) // bar
});
위 코드는 ‘jsonwebtoken’ 라이브러리를 사용하여 JSON Web Token(JWT)를 생성하고 검증하는 예제입니다. JWT는 웹 애플리케이션에서 사용자 인증을 위한 표준 방식 중 하나로, 이 라이브러리를 사용하면 간편하게 JWT를 다룰 수 있습니다.
☞ 이 네 가지 라이브러리는 JSON 데이터를 다루는 데 큰 도움이 될 것입니다. 하지만 실제로 이 라이브러리들을 사용하려면 Node.js 환경이 필요하다는 점을 명심해야 합니다. 이러한 라이브러리를 이용하면 복잡한 JSON 데이터를 보다 쉽고 효과적으로 다룰 수 있습니다.
함께 보면 좋은 이전 게시글
- 자바스크립트 JSON 처리: JSON.stringify()와 JSON.parse() 사용하기
- 자바스크립트 비동기 처리: Promise 사용하기
- 자바스크립트 비동기 처리: async/await 사용하기
- 자바스크립트 객체: 객체 생성, 접근, 변경, 추가, 삭제 방법
- 자바스크립트 URI 인코딩 처리: encodeURI(), encodeURIComponent() 함수
이 글이 도움이 되셨다면 공유를 부탁 드립니다. 다음 글에서 뵙겠습니다!