Json.stringify la gi

Thứ sáu, 18/09/2020 | 00:00 GMT+7

Đối tượng JSON , có sẵn trong tất cả các trình duyệt hiện đại, có hai phương pháp hữu ích để xử lý nội dung có định dạng JSON: parse và stringify . JSON.parse() nhận một chuỗi JSON và biến nó thành một đối tượng JavaScript. JSON.stringify() nhận một đối tượng JavaScript và chuyển đổi nó thành một chuỗi JSON.


Đây là một ví dụ:

const myObj = { name: 'Skip', age: 2, favoriteFood: 'Steak' }; const myObjStr = JSON.stringify(myObj); console.log(myObjStr); // "{"name":"Sammy","age":6,"favoriteFood":"Tofu"}" console.log(JSON.parse(myObjStr)); // Object {name:"Sammy",age:6,favoriteFood:"Tofu"}

Và mặc dù các phương thức thường được sử dụng trên các đối tượng, chúng cũng được dùng trên các mảng:

const myArr = ['bacon', 'lettuce', 'tomatoes']; const myArrStr = JSON.stringify(myArr); console.log(myArrStr); // "["shark","fish","dolphin"]" console.log(JSON.parse(myArrStr)); // ["shark","fish","dolphin"]

JSON.parse()

JSON.parse() có thể nhận một hàm làm đối số thứ hai có thể biến đổi các giá trị đối tượng trước khi chúng được trả về. Ở đây các giá trị của đối tượng được chuyển thành chữ hoa trong đối tượng trả về của phương thức parse pháp:

const user = { name: 'Sammy', email: '', plan: 'Pro' }; const userStr = JSON.stringify(user); JSON.parse(userStr, (key, value) => { if (typeof value === 'string') { return value.toUpperCase(); } return value; });

Lưu ý: Dấu phẩy ở cuối không hợp lệ trong JSON, vì vậy JSON.parse() sẽ thông báo lỗi nếu chuỗi được chuyển tới nó có dấu phẩy ở cuối.

JSON.stringify()

JSON.stringify() có thể nhận thêm hai đối số, đối số đầu tiên là hàm replacer và đối số thứ hai là giá trị String hoặc Number để sử dụng làm space trong chuỗi trả về.

Hàm thay thế được dùng để lọc ra các giá trị, vì bất kỳ giá trị nào được trả về là undefined sẽ nằm ngoài chuỗi trả về:

const user = { id: 229, name: 'Sammy', email: '' }; function replacer(key, value) { console.log(typeof value); if (key === 'email') { return undefined; } return value; } const userStr = JSON.stringify(user, replacer); // "{"id":229,"name":"Sammy"}"

Và một ví dụ với đối số space trắng được truyền vào:

const user = { name: 'Sammy', email: '', plan: 'Pro' }; const userStr = JSON.stringify(user, null, '...'); // "{ // ..."name": "Sammy", // ..."email": "", // ..."plan": "Pro" // }"

Kết luận

Trong hướng dẫn này, bạn đã khám phá cách sử dụng các phương thức JSON.parse() và JSON.stringify() . Nếu bạn muốn tìm hiểu thêm về cách làm việc với JSON trong Javascript, hãy xem Hướng dẫn Cách làm việc với JSON trong JavaScript của ta .

Để biết thêm thông tin về cách viết mã trong JavaScript, hãy xem loạt bài Cách viết mã trong JavaScript hoặc xem trang chủ đề JavaScript của ta để biết các bài tập và dự án lập trình.


Tags:


Các tin liên quan

Json.stringify la gi

JSON.stringify() là một hàm kinh điển trong Javascript để chuyển một Object sang JSON. Có rất nhiều thư viện sử dụng JSON.stringify() như res.json() trong Express , post() trong Axios và cả Webpack stats. Trong bài viết này mình sẽ trình bày một cách tổng quan về JSON.stringify() bao gồm cả các trường hợp lỗi.

Bạn đang xem: Stringify là gì

const obj = { answer: 42 };const str = JSON.stringify(obj);str; // "{"answer":42}"typeof str; // "string"JSON.stringify() sử dụng chung với hàm JSON.parse(), đây là cách ta sao chép một Object mà không ảnh hưởng đến Object cũ.

const obj = { answer: 42 };const clone = JSON.parse(JSON.stringify(obj));clone.answer; // 42clone === obj; // false

Trường hợp đặc biệt và lỗi.

1. Khi một Object có một property trỏ về chính nó, JSON.stringify() trả về 1 errorconst obj = {};obj.prop = obj;// Throws "TypeError: TypeError: Converting circular structure to JSON"JSON.stringify(obj);2. Các trường hợp NaN và Infinity, JSON.stringify() sẽ trả về nullconst obj = { nan: parseInt("not a number"), inf: Number.POSITIVE_INFINITY};JSON.stringify(obj) // "{"nan":null,"inf":null}"3. Lọc bỏ hết tất cả các giá trị undefined hay functionconst obj = { fn: function() {}, undef: undefined};JSON.stringify(obj) // "{}"

Các tham số còn lại của JSON.stringify()

JSON.stringify() nhận vào 3 tham số , đa phần chúng ta không biết đến 2 tham số còn lại.

const obj = { a: 1, b: 2, c: 4, d: { e: 4 }};//Nếu là number thì tăng lên 1JSON.stringify(obj, function replacer(key, val) { if(typeof val === "number") { return val + 1; } return val;})// "{"a":2,"b":3,"c":4,"d":{"e":5}}"Tham số thứ 3 là spaces, cho phép format lại đoạn code in ra console. Có nhiều cách để hiển thị ra thứ mà ta mong muốn.

const obj = { a: 1, b: 2, c: 4, d: { e: 4 }};JSON.stringify(obj);// "{"a":1,"b":2,"c":3,"d":{"e":4}}"JSON.stringify(obj, null, " ");// hoặcJSON.stringify(obj, null, 2);// {// "a": 1,// "b": 2,// "c": 3,// "d": {// "e": 4// }// }//Không nhất thiết phải là dấu khoảng trắngJSON.stringify(obj, null, "__"); // {// __"a": 1,// __"b": 2,// __"c": 3,// __"d": {// ____"e": 4// __}// }Ví dụ như ta có thể lược bỏ dữ liệu nhạy cảm như password ra khỏi Object bằng JSON.stringify().

const obj = { name: "John Doe", password: "isLuckyman", nested: { hashedPassword: "c3RhcmdhemVy" }};JSON.stringify(obj, function replacer(key, val) { if(key.match(/password/i)) { return undefined; } return val;});// "{"name":"John Doe","nested": {}}"

Hàm toJSON()

Khi đi qua hàm JSON.stringify() nếu bên trong Object có hàm toJSON(), thì nó sẻ trả về kết quả của hàm này.

Xem thêm: Vietgle Tra Cứu Tiếng Anh Là Gì ? Nghĩa Của Từ Tra Cứu Trong Tiếng Việt

const obj = { name: "John Doe", nested: { test: "nothing to show", toJSON: () => "test" }};JSON.stringify(obj);// "{"name":"John Doe","nested":"test"}"Rất nhiều thư viện sử dụng JSON.stringify() kết hợp toJSON() để đảm bảo output lúc serialize ra đúng với mong muốn như Moment objects và Mongoose documents. Hy vọng bài viết sẽ giúp các bạn có thể hiểu rõ và sử dụng JSON.stringigy() hợp lý và hiệu quả.