Home » Code Tìm hiểu về Parse JS – JSON, hoặc JavaScript Object Notation, là tất cả xung quanh chúng ta. Nếu bạn đã từng sử dụng một ứng dụng web, thì rất có thể nó đã sử dụng JSON để cấu trúc, lưu trữ và truyền dữ liệu giữa các máy chủ và thiết bị của bạn. Sử dụng hàm JavaScript Lưu ý: Đảm bảo văn bản ở định dạng JSON, nếu không bạn sẽ gặp lỗi cú pháp. Đã đăng vào thg 5 21, 2020 6:13 SA 3 phút đọc Xin chào các bạn. Hôm nay mình sẽ giới thiệu với các bạn về Syntax Parser trong Javascript. Syntax parser là một phần của công cụ Javascript. Nó đọc ký tự code của bạn theo character, cho biết code của bạn làm gì và điểm tra xem nó có đúng ngữ pháp hay không. Bạn có thể hiểu Syntax Parser sẽ giống như là một trình thông dịch giữa code và máy tính.Nó sẽ dịch code của bạn thành code có thành đọc được bằng máy.Giúp Javascrip linh hoạt hơn và có khả năng chịu lỗi. Điều đó có nghĩa là Javascript nổi tiếng với khả năng chịu lỗi trái ngược với các ngôn ngữ như C # và Java. Dưới đây là một số ví dụ:
Còn rất nhiều những ví dụ khác nữa. Tuy nhiên, đôi khi, trình phân tích cú pháp thực hiện những điều bạn không muốn ở vị trí đầu tiên. Dó là việc - Trong đoạn mã dưới đây, từ khóa Để làm đúng , bạn nên luôn luôn nhớ giữ từ khóa Tóm lại, code của chúng ta không được máy tính thực thi trực tiếp mà thông qua công cụ Javascript. Công cụ Javascript thiết lập bối cảnh thực thi và diễn giải code của chúng ta một cách tốt nhất và thực hiện những điều mà có thể chúng ta biết hoặc không biết. Dưới đây mình có giới thiệu với các bạn về Syntax Parser trong Javascript.Nếu có bất kì thắc mắc gì hãy để lại comment ở phía dưới nhé. Tham Khảo chi tiết hơnhttps://medium.com/@easyexpresssoft/javascript-syntax-parser-4b7f3f320ebe All rights reserved JSON là gì? JSON (JavaScript Object Notation) là một định dạng lightweight, được dùng cho mục đích chia sẻ dữ liệu. Các bạn sẽ dễ dàng thấy các dịch vụ cung cấp Rest API, thường hay trả về dữ liệu về cho client dưới dạng JSON. Khái niệm Parse JSON Javascript hẳn quen thuộc với các bạn! Mình lấy ví dụ như: Firebase, NewYork Times… đều có API trả về là JSON. Mặc dù JSON có nguồn gốc từ Javascript, Tuy nhiên, JSON là một định dạng dữ liệu nên nó được sử dụng bởi bất kỳ ngôn ngữ lập trình mà không có giới hạn nào cả. Bài viết này, chúng ta sẽ cùng nhau tìm hiểu các sử dụng JSON trong Javascript. Xem Javascript xử lý JSON như thế nào nhé. Nội dung chính của bài viết
JSON là một định dạng dùng để chia sẻ, lưu trữ dữ liệu. Trong đó, JSON sử dụng cặp Key – Value để định dạng dữ liệu. Tại sao lại nói JSON là định dạng lightweight? Bởi vì JSON có rất ít quy tắc khi định dạng dữ liệu. Nếu nói chính xác thì chỉ có 2 quy tắc:
Tất cả chỉ có như vậy. Bạn đã hiểu Json là gì chưa? Dưới đây là một ví dụ về định dạng JSON. {
"first name": "John",
"last name": "Smith",
"age": "25",
"address": {
"street address": "21 2nd Street",
"city": "New York"
},
"phone numbers": [
{
"type": "home",
"number": "212 555-1234"
},
{
"type": "fax",
"number": "646 555-4567"
}
]}
Khi nào thì sử dụng JSON? Có nhiều tình huống sử dụng JSON lắm, trong đây là một số ý tưởng:
Có một trường hợp sử dụng JSON khá phổ biến đó chính là Ajax. Kỹ thuật AJAX thường sẽ tạo request tới server và nhận dữ liệu trả về dạng JSON. Trong Parse JSON Javascript, chúng ta có gặp một khái niệm đó là Object. Thực ra các bạn đã gặp Object ở rất nhiều nơi rồi, mình cũng đã có hẳn một bài viết về Object trong Javascript. Bạn có thể đọc thêm nhé. Nhưng khái niệm Object trong JSON thì có gì khác với Object bình thường mà bạn đã biết? Mời bạn đọc tiếp. #Object là gìObject trong Json được thể hiện bằng dấu ngoặc nhọn {}. Khái niệm Object trong Json cũng khá tương đồng với Object trong Javascript. Tuy nhiên, Object trong Json vẫn có những giới hạn như:
Sau đây là một số ví dụ mình họa cho các trường hợp không hợp lệ: // Key dạng biến số - không nằm trong cặp dầu ngoặc kép
const str1 = `{ text : "X", "number": 1990 }`;
// Key đặt trong cặp dấu ngoặc đơn
const str2 = `{'text': "X", "number": 1990 }`;
// Có dấu phẩy cuối cùng
const str3 = `{"text": "X", "number": 1990, }`;
// Value là undefined
const str4 = `{"text": "X", "number": undefined }`;
// Value chứa biểu thức tính toán
const str5 = `{"text": "X", "number": 1 + 1 }`;
// Value là kiểu Date
const str6 = `{"text": "X", "number": new Date() }`;
// Value là function
const str7 = `{"text": "X", "number": function () {} }`;
// Value là number nhưng tồn tại số 0 ở đầu
const str8 = `{"text": "X", "number": 01990 }`;
// Value là số thập phân nhưng sau dấu (.) không có chữ số nào
const str9 = `{"text": "X", "number": 1990. }`;
>> Đọc thêm: 7 khái niệm Javascript không thể bỏ qua #Parse JSON Javascript như thế nào?Có một điểm của Javascript mà mình cực thích đó là làm việc với JSON rất sướng. Trước đây, khi mình viết ứng dụng Android, mỗi lần phải làm việc với JSON là mình lại ngại. Lý do là mỗi khi phải parse JSON trong Android, mình cần phải định nghĩa một data model có các thuộc tính tương đồng với các key của JSON. Sau này có thư viện hỗ trợ như gson thì cũng đỡ hơn xíu. Nhưng với Javascript thì việc Parse JSON Javascript dễ như ăn cháo vậy. Để minh họa cho quan điểm của mình, chúng ta cùng thử đi qua một ví dụ sau. Giả sử mình có một file json (contacts.json)như sau: {
"name":"Timothy",
"age":35,
"address":{
"street":"1 Main St",
"city": "Montreal"
},
"interests":["cooking", "biking"]
}
Trong đó: name là một String, age là một number, còn address là một object, interests là một array. Đủ bộ các thành phần nhé. Nói thêm một chút: Khi làm việc với JSON, bạn sẽ gặp 2 trường hợp: một là việc với JSON như một đối tượng hoặc là một String. Nếu JSON là một đối tượng trong file .js hay .html, bạn có thể khởi tạo biến như sau: let contacts = {
name:"Timothy",
age:35,
address:{
street:"1 Main St",
city: "Montreal"
},
interests:["cooking", "biking"]
}
Với trường hợp này, bạn có truy cập vào bất kỳ thuộc tính của JSON. contacts.name // Timothy contacts.age // 35 contacts.address.street // 1 Main St contacts.address.city // Montreal contacts.interests[0] // cooking contacts.interests[1] // biking Hoặc là một chuỗi (String) thì như sau: let contacts = { "name":"Timothy", "age":35, "address":{ "street":"1 Main St", "city": "Montreal"}, "interests":["cooking", "biking"]}Nếu nhìn dạng String khó nhìn quá, bạn có thể sử dụng tool sau để định dạng lại cho dễ nhìn hơn: codebeautify. Với trường hợp dạng String, cũng tương tự như ở trên, chỉ khác là bạn cần gọi thêm một hàm let json_object = JSON.parse(contacts) json_object.name // Timothy Looping một arrays JSONNhư ví dụ trên, chúng ta có một mảng các sở thích (interests). Để sử dụng các phần tử trong mảng thì dùng một vòng loop như for chẳng hạn. for (var i = 0; i < contacts.interests.length; i++) {
console.log(contacts.interests[i]);
}
------------
output:
cooking
biking
#Tạm kếtMình hi vọng qua bài viết, bạn đã hiểu Json là gì, cách sử dụng và parse Json Javascript. Các bạn nên nhớ là JSON được sử dụng rất nhiều, vì vậy đừng bỏ qua kiến thức về JSON nhé. Phần tiếp theo trong series học Javascript cơ bản, chúng ta sẽ gặp lại nhau trong bài viết về những sai lầm phổ biến khi lập trình Javascript nhé. Nhớ đón đọc các bạn nhé! |
