Javascript json.parse () là một hàm tích hợp để chuyển đổi văn bản thành đối tượng Javascript. Chúng ta có thể chuyển đổi chuỗi JSON thành đối tượng bằng phương thức json.parse ().

Bạn đang xem : js phân tích cú pháp tệp json

Công dụng chính của JSON là để trao đổi dữ liệu giữa máy khách và máy chủ. Khi chúng tôi nhận dữ liệu từ máy chủ web, dữ liệu luôn là một chuỗi, vì vậy chúng tôi cần phân tích cú pháp dữ liệu bằng JSON.parse () và dữ liệu trở thành một đối tượng JavaScript .

JSON là gì

JSON có nguồn gốc từ ngôn ngữ lập trình JavaScript và nó là lựa chọn tự nhiên để sử dụng làm định dạng dữ liệu trong JavaScript. Ví dụ: khi chúng tôi tạo và sử dụng API cho thiết bị di động và các ứng dụng khác.

JSON là viết tắt của JavaScript Object Notation , thường được phát âm như “ Jason “.

Nếu bạn muốn bắt đầu suy nghĩ về nơi bạn có thể sử dụng JSON trong các dự án JavaScript của mình, một số trường hợp sử dụng chung của JSON bao gồm:

  1. Lưu trữ dữ liệu.

  2. Tạo cấu trúc dữ liệu từ đầu vào của người dùng.

  3. Thứ ba, chuyển dữ liệu từ máy khách sang máy chủ, máy chủ sang máy chủ và máy chủ sang máy khách.

  4. Cuối cùng là định cấu hình và xác minh dữ liệu.

Định dạng JSON

Định dạng của JSON bắt nguồn từ cú pháp đối tượng JavaScript , nhưng nó hoàn toàn dựa trên văn bản.

Đây là định dạng dữ liệu khóa-giá trị thường được hiển thị trong dấu ngoặc nhọn.

Khi làm việc với JSON, bạn có thể sẽ thấy các đối tượng JSON trong tệp .json, nhưng chúng cũng có thể tồn tại dưới dạng đối tượng JSON hoặc Chuỗi trong ngữ cảnh của chương trình.

Xem cú pháp sau.

 {
  "character_name": "Mười một",
  "Actor_name": "Millie Bobby Brown",
  "lứa tuổi 15"
}

Bạn có thể xác thực cú pháp JSON tại đây .

Bạn có thể xem JSON là một chuỗi chứ không phải là một đối tượng trong ngữ cảnh của tệp chương trình hoặc tập lệnh JavaScript. Trong trường hợp này, bạn cũng có thể thấy tất cả trong một dòng.

 let Strange = '{"character_name": "Eleven", "Actor_name": "Millie Bobby Brown", "age": "15"}'

Javascript JSON.parse ()

json parse () là một hàm JavaScript được tích hợp sẵn để chuyển đổi văn bản thành các đối tượng. Hàm json.parse () đang chuyển đổi chuỗi json thành đối tượng. Phương thức parse () là đồng bộ, do đó, dữ liệu JSON càng lớn, thì thời gian thực thi chương trình của bạn sẽ bị chặn cho đến khi JSON đã hoàn thành phân tích cú pháp. Nếu bạn có dữ liệu JSON là một phần của Chuỗi , thì cách tốt nhất để phân tích cú pháp đó là sử dụng JSON .parse () .

Chúng tôi sẽ lấy một ví dụ và hiểu cách hoạt động của điều này.

Hãy giả sử rằng chúng tôi nhận được văn bản sau từ máy chủ web:

 '{"name": "Krunal", "age": 25, "city": "Rajkot", "Degree": "BE"}' 

Bây giờ, hãy sử dụng hàm JSON.parse () để chuyển đổi văn bản thành đối tượng JavaScript .

 let obj = JSON.parse ('{"name": "Krunal", "age": 25, "city": "Rajkot", "Degree": "BE "} '); 

Vì vậy, toàn bộ Chuỗi trở thành một đối tượng JS ngay bây giờ và chúng ta có thể truy cập các giá trị của nó theo các thuộc tính của nó.

 console.log (obj.degree); // ĐƯỢC 

Đây là ví dụ chính về Phân tích cú pháp JSON trong Javascript.

Ngoại lệ trong JSON

Đối tượng ngày tháng không được phép trong JSON . Nếu bạn cần bao gồm ngày, bạn cần viết nó dưới dạng chuỗi.

 let Birth = '{"BirthDate": "1993-09-10"}';
let obj = JSON.parse (sinh);
obj.birthDate = new Ngày (obj.birthDate);

console.log (obj.birthDate); //1993-09-10T00:00:00.000Z 

Hàm không đồng bộ trong Javascript

Bạn có thể kiểm traHướng dẫn async-await nếu bạn không biết hàm không đồng bộ trong javascript là gì.

Bạn có thể xử lý JSON không đồng bộ bằng cách đặt nó bên trong promise setTimeout gọi, đảm bảo rằng quá trình phân tích cú pháp xảy ra trong lần lặp tiếp theo của vòng lặp sự kiện.

Đối với ví dụ này, chúng tôi đang sử dụng Node.js để giải thích. Vì vậy, hãy tạo một tệp có tên server.js và thêm mã sau vào bên trong tệp đó.

Bạn cần cài đặt Node.js trên máy tính của mình để thực thi các chương trình javascript.

 // server.js

const parseJsonAsyncFunc = jsonString = & gt; {
  trả lại Lời hứa mới (giải quyết = & gt; {
    setTimeout (() = & gt; {
      giải quyết (JSON.parse (jsonString));
    });
  });
}

let data = '{"name": "Krunal", "age": 25, "city": "Rajkot", "Degree": "BE"}';
parseJsonAsyncFunc (data) .then (jsonData = & gt; console.log (jsonData.degree)); 

Bây giờ, hãy chuyển đến terminal và thực hiện lệnh sau.

 máy chủ nút 

Cách phân tích cú pháp JSON trong Javascript

Vì vậy, chúng tôi đã sử dụng Promise để xử lý JSON không đồng bộ .

Không đồng bộ-Await trong JavaScript

Nếu chúng tôi không muốn sử dụng Promise, chúng tôi có thể sử dụng async-await trong Node.js . Sau đó, ví dụ của chúng tôi trông giống như dưới đây. Đầu ra vẫn như cũ, nhưng chúng tôi không sử dụng Promise .

 // server.js

hàm async parseJsonAsyncFunc (jsonString) {
  const obj = await JSON.parse (jsonString);
  console.log (obj.degree);
}

let data = '{"name": "Krunal", "age": 25, "city": "Rajkot", "Degree": "BE"}';
parseJsonAsyncFunc (dữ liệu); 

Bạn có thể tìm hiểu thêm về async-await trên liên kết này.

Làm việc với tệp JSON.

Hãy giả sử rằng chúng tôi có tệp JSON với nội dung sau.

 {
  "dữ liệu":[
    {
      "tên": "Krunal",
      "tuổi": 25,
      "thành phố": "Rajkot",
      "độ": "ĐƯỢC"
    },
    {
      "name": "Ankit",
      "tuổi": 23,
      "thành phố": "Rajkot",
      "độ": "MCA"
    },
    {
      "name": "Nehal",
      "tuổi": 30,
      "thành phố": "Rajkot",
      "độ": "ĐƯỢC"
    }
  ]
} 

Hãy để chúng tôi đặt tên cho nó là data.json. Chúng tôi có thể sử dụng hiệu quả tệp này trong ứng dụng Node.js bằng cách yêu cầu tệp này. Vì vậy, hãy viết mã sau bên trong tệp server.js .

Ở đây, JSON.parse không liên quan gì đến nó, nhưng tôi muốn cho bạn biết rằng chúng tôi có thể yêu cầu bất kỳ tệp JSON nào trong ứng dụng Node.js của chúng tôi và sử dụng nó như một đối tượng Javascript chuẩn.

 // server.js

let dataFile = request ('./ data.json');
console.log (dataFile.data [0] .degree);

Phân tích cú pháp JSON lồng nhau trong JavaScript

JSON đối tượng và mảng cũng có thể được lồng vào nhau. Đối tượng JSON có thể tùy ý chứa các đối tượng JSON khác, mảng, mảng lồng nhau, mảng đối tượng JSON, v.v.

Ví dụ dưới đây sẽ chỉ cho bạn cách phân tích cú pháp đối tượng JSON lồng nhau và trích xuất tất cả các giá trị trong JavaScript.

 // app.js

let show = `{
  "netflix": {
      "name": "Stranger Things",
      "người sáng tạo": "Anh em nhà Duffer",
      "năm": 2016,
      "character": ["Eleven", "Mike", "Dustin"],
      "thể loại": "Khoa học viễn tưởng / Kinh dị",
      "giá bán": {
          "1 người": "5 đô la", "2 người": "8 đô la", "4 người": "13 đô la"
      }
  }
} ';

// Chuyển đổi đối tượng JSON thành đối tượng JS
let obj = JSON.parse (hiển thị);

// Định nghĩa hàm đệ quy để in các giá trị lồng nhau
function printValues ​​(obj) {
  for (let k in obj) {
      if (obj [k] instanceof Object) {
          printValues ​​(obj [k]);
      } khác {
         console.log (obj [k]);
      };
  }
};

// In tất cả các giá trị từ đối tượng kết quả
printValues ​​(obj);

Xem kết quả đầu ra.

 ➜ es git: (master) ✗ ứng dụng nút
Những điều kỳ lạ
Anh em nhà Duffer
2016
Mười một
Mike
Dustin
Khoa học viễn tưởng / Kinh dị
$ 5
$ 8
$ 13
➜ es git: (master) ✗

JSON.stringify

Hàm JSON.parse () sẽ chuyển đổi Chuỗi thành Javascript > đối tượng .

Hàm JSON.stringify () sẽ chuyển đổi Javascript Object thành Chuỗi .

 // server.js

let dataFile = request ('./ data.json');
let stringData = JSON.stringify (dataFile);
console.log (stringData);

KHAI THÁC JSON VỚI NODE

Vì vậy, nó đã chuyển đổi toàn bộ Đối tượng Javascript thành Chuỗi .

< / p>

FileSystem trong Node.js

Viết mã sau vào trong tệp server.js .

 // server.js

const fs = request ('fs');
const fileContents = fs.readFileSync ('./ data.json', 'utf8');

thử {
  const data = JSON.parse (fileContents)
  console.log (dữ liệu);
} bắt (lỗi) {
  console.error (lỗi);
} 

Bạn có thể tìm thấy kết quả bên dưới.

Phương thức phân tích cú pháp JavaScript JSON ()

Trong ví dụ trên, hệ thống Node.js đọc tệp một cách đồng bộ.

Bạn cũng có thể đọc tệp không đồng bộ bằng cách sử dụng fs.readFile và đây là tùy chọn tốt nhất.

Trong trường hợp này, nội dung tệp được cung cấp dưới dạng lệnh gọi lại và bên trong lệnh gọi lại, bạn có thể xử lý JSON.

Viết mã sau vào trong tệp server.js .

 // server.js

const fs = request ('fs');

fs.readFile ('./ data.json', 'utf8', (err, fileContents) = & gt; {
  nếu (sai) {
    console.error (err)
    trở về;
  }
  thử {
    const data = JSON.parse (fileContents)
    console.log (dữ liệu);
  } bắt (lỗi) {
    console.error (lỗi);
  }
}) 

Ở đây, chúng tôi cũng nhận được kết quả tương tự.

Xâu chuỗi một mảng JavaScript

Bạn có thể chuyển đổi các mảng JavaScript thành chuỗi JSON, như sau.

 // app.js

let arr = ["Millie", "Gaten", "Finn", "Caleb", "Noah"];

// Chuyển mảng JS thành chuỗi JSON
let json = JSON.stringify (arr);
console.log (json);

Xem kết quả.

 ➜ es git: (master) ✗ ứng dụng nút
["Millie", "Gaten", "Finn", "Caleb", "Noah"]
➜ es git: (master) ✗

Javascript

JSON

phân tích cú pháp mảng

Giả sử bạn có dữ liệu sau.

 data = `{
  "thành công": đúng,
  "ứng dụng": [
    {
      "app_name": "FB",
      "app_type": "Mạng xã hội",
      "app_unit": "1"
    },
    {
      "app_name": "Paypal",
      "app_type": "Thanh toán",
      "app_unit": "2"
    },
    {
      "app_name": "Netflix",
      "app_type": "Phương tiện",
      "app_unit": "3"
    }]
} '

Bây giờ, chúng ta cần phân tích cú pháp mảng đó bằng hàm JSON.parse () .

Xem đoạn mã sau.

 // app.js

dữ liệu = `{
  "thành công": đúng,
  "ứng dụng": [
    {
      "app_name": "FB",
      "app_type": "Mạng xã hội",
      "app_unit": "1"
    },
    {
      "app_name": "Paypal",
      "app_type": "Thanh toán",
      "app_unit": "2"
    },
    {
      "app_name": "Netflix",
      "app_type": "Phương tiện",
      "app_unit": "3"
    }]
} '

let jsonData = JSON.parse (dữ liệu);
for (let i = 0; i & lt; jsonData.apps.length; i ++) {
  let app = jsonData.apps [i];
  console.log (app.app_name);
}

Xem kết quả.

 ➜ es git: (master) ✗ ứng dụng nút
FB
Paypal
Netflix
➜ es git: (master) ✗

Đó là nó cho hướng dẫn này.

Bài đăng được đề xuất

Javascript Object.keys ()

Javascript Object.values ​​()

Javascript Object.assign ()

Javascript Object.create ()

Javascript Object.freeze ()


Xem thêm những thông tin liên quan đến chủ đề js phân tích cú pháp tệp json

Easy JavaScript – How to parse an array of JSON data (42)

alt

  • Tác giả: Nazmus Nasir
  • Ngày đăng: 2017-04-08
  • Đánh giá: 4 ⭐ ( 3425 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Welcome to the 42nd Easy JavaScript tutorial, part of EasyProgramming.net. We looked at the for…in loop last time, and I mentioned that you can take it one step further by dynamically creating javaScript Objects inside of an array, and iterate through the array and parse your JSON.

    This is extremely useful when you’re trying to parse large sets of data. You can even use this to create a script like my JSON to Table which allows you to convert ANY JSON input into a neat HTML table: https://www.easyprogramming.net/playground/jtable.php

    To fork the fiddle and follow along: https://jsfiddle.net/easyjs/kwhhLcv9/

    For more information, please visit http://www.EasyProgramming.net to view my other programming tutorials! Find videos of C++ tutorials, Excel tutorials, and JavaScript Tutorials.

    I hope you enjoy the video and if you have any questions, please ask in the comments below. If you have any requests feel free to let me know. Thanks for watching and remember to subscribe!

    EasyJavaScript JavaScript JSON

    ———–
    Visit my website: https://www.easyprogramming.net
    Subscribe on YouTube: https://www.youtube.com/c/nazmusnasir
    Support me on Patreon: https://www.patreon.com/nazmus
    Follow me on Twitter: https://twitter.com/NazmusN
    Like me on Facebook: https://www.facebook.com/EasyProgrammingNet
    Check out my Github: https://github.com/naztronaut

Phân tích cú pháp JSON với Node.js

  • Tác giả: tech-wiki.online
  • Đánh giá: 5 ⭐ ( 5870 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

JAVASCRIPT: Đường dẫn tệp phân tích cú pháp JSON

  • Tác giả: vi.fmihm.org
  • Đánh giá: 4 ⭐ ( 8942 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Tôi gặp khó khăn khi cố gắng lấy đường dẫn chính xác đến tệp cục bộ. Tôi có các thư mục sau: Tài nguyên -> dữ liệu -> file.json js -> thư mục -> script.js html …

Cách phân tích cú pháp các câu trả lời JSON trong Katalon Studio

  • Tác giả: helpex.vn
  • Đánh giá: 4 ⭐ ( 8237 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Ví dụ về phản hồi JSON Giả sử chúng ta có phản hồi JSON sau và chúng ta muốn phân tích cú pháp và truy xuất dữ liệu của nó: { “menu”: { “id”: “file”, “tools”: { “actions”: [ { “id”:…

Phân tích cú pháp JSON phức tạp trong Flutter

  • Tác giả: itzone.com.vn
  • Đánh giá: 4 ⭐ ( 8423 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: The ITZone platform Vietnam is the community for anyone interested in news, training seminars, presentations etc in the IT industry

Android – Trình phân tích cú pháp JSON

  • Tác giả: isolution.pro
  • Đánh giá: 5 ⭐ ( 8152 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: JSON là viết tắt của JavaScript Object Notation, là một định dạng trao đổi dữ liệu độc lập và là giải pháp thay thế tốt nhất cho XML. Chương này giải thích cách phân tích cú pháp tệp JSON và trích xuất thông tin cần thiết từ nó. Android cung cấp bốn lớp khác nhau để thao tác dữ liệu…

JSON: Cú pháp JSON

  • Tác giả: v1study.com
  • Đánh giá: 4 ⭐ ( 2583 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Cú pháp JSON là một tập hợp con của cú pháp JavaScript. Quy tắc cú pháp JSON Cú pháp JSON bắt nguồn từ cú pháp ký hiệu đối tượng JavaScript: Dữ liệu nằm

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Sự kiện tải trang JavaScript - js khi tải trang

By ads_php