Aman mengubah string JSON menjadi objek

Diberikan string data JSON, bagaimana saya bisa dengan aman mengubah string itu menjadi objek JavaScript?

Jelas saya bisa melakukan ini dengan tidak aman dengan sesuatu seperti:

var obj = eval("(" + json + ')');

tapi itu membuat saya rentan terhadap string JSON yang berisi kode lain, yang tampaknya sangat berbahaya hanya untuk eval.

JSON.parse(jsonString) adalah pendekatan JavaScript murni selama Anda dapat menjamin browser yang cukup modern.

Metode jQuery sekarang sudah tidak digunakan lagi. Gunakan metode ini sebagai gantinya:

let jsonObject = JSON.parse(jsonString);

Jawaban asli menggunakan fungsi jQuery yang sudah usang :

Jika Anda menggunakan jQuery cukup gunakan:

jQuery.parseJSON( jsonString );

Persis seperti yang Anda cari (lihat dokumentasi jQuery ).

Jawaban ini untuk IE <7, untuk browser modern periksa jawaban Jonathan di atas.

Jawaban ini sudah usang dan jawaban Jonathan di atas ( JSON.parse(jsonString)) sekarang adalah jawaban terbaik .

JSON.org memiliki parser JSON untuk banyak bahasa termasuk empat yang berbeda untuk JavaScript. Saya percaya kebanyakan orang akan mempertimbangkan implementasi goto json2.js mereka.

Gunakan contoh kode sederhana di " JSON.parse () ":

var jsontext = '{"firstname":"Jesper","surname":"Aaberg","phone":["555-0100","555-0120"]}';
var contact = JSON.parse(jsontext);

dan membalikkannya:

var str = JSON.stringify(arr);

Saya tidak yakin tentang cara lain untuk melakukannya tetapi inilah cara Anda melakukannya di Prototipe (tutorial JSON) .

new Ajax.Request('/some_url', {
  method:'get',
  requestHeaders: {Accept: 'application/json'},
  onSuccess: function(transport){
    var json = transport.responseText.evalJSON(true);
  }
});

Memanggil evalJSON()dengan true sebagai argumen membersihkan string yang masuk.

Ini tampaknya menjadi masalah:

Input yang diterima melalui websocket Ajax dll, dan itu akan dalam format String, tetapi Anda perlu tahu apakah itu JSON.parsable. Masalahnya adalah, jika Anda selalu menjalankannya JSON.parse, program MUNGKIN melanjutkan "berhasil" tetapi Anda masih akan melihat kesalahan dilemparkan di konsol dengan yang ditakuti "Error: unexpected token 'x'".

var data;

try {
  data = JSON.parse(jqxhr.responseText);
} catch (_error) {}

data || (data = {
  message: 'Server error, please retry'
});

Jika Anda menggunakan jQuery , Anda juga dapat menggunakan:

$.getJSON(url, function(data) { });

Maka Anda dapat melakukan hal-hal seperti

data.key1.something
data.key1.something_else

dll.

$.ajax({
  url: url,
  dataType: 'json',
  data: data,
  success: callback
});

Callback meneruskan data yang dikembalikan, yang akan menjadi objek JavaScript atau array seperti yang didefinisikan oleh struktur JSON dan diuraikan menggunakan $.parseJSON()metode ini.

Hanya untuk bersenang-senang, berikut ini cara menggunakan suatu fungsi:

 jsonObject = (new Function('return ' + jsonFormatData))()

Menggunakan JSON.parsemungkin merupakan cara terbaik.

Berikut ini contoh demo langsung .

var jsonRes = '{ "students" : [' +
          '{ "firstName":"Michel" , "lastName":"John" ,"age":18},' +
          '{ "firstName":"Richard" , "lastName":"Joe","age":20 },' +
          '{ "firstName":"James" , "lastName":"Henry","age":15 } ]}';
var studentObject = JSON.parse(jsonRes);

Cara termudah menggunakan parse()metode:

var response = '{"result":true,"count":1}';
var JsonObject= JSON.parse(response);

Kemudian Anda bisa mendapatkan nilai elemen JSON, misalnya:

var myResponseResult = JsonObject.result;
var myResponseCount = JsonObject.count;

Menggunakan jQuery seperti yang dijelaskan dalam jQuery.parseJSON()dokumentasi:

JSON.parse(jsonString);

Coba gunakan metode dengan objek Data ini. mis .: Data='{result:true,count:1}'

try {
  eval('var obj=' + Data);
  console.log(obj.count);
}
catch(e) {
  console.log(e.message);
}

Metode ini sangat membantu dalam Nodejs ketika Anda bekerja dengan pemrograman port serial

Saya menemukan cara "lebih baik":

Dalam CoffeeScript:

try data = JSON.parse(jqxhr.responseText)
data ||= { message: 'Server error, please retry' }

Dalam Javascript:

var data;

try {
  data = JSON.parse(jqxhr.responseText);
} catch (_error) {}

data || (data = {
  message: 'Server error, please retry'
});

Penguraian JSON selalu menyebalkan. Jika inputnya tidak seperti yang diharapkan, ia melempar kesalahan dan membuat crash apa yang Anda lakukan.

Anda dapat menggunakan fungsi kecil berikut untuk mengurai input Anda dengan aman. Itu selalu mengubah objek bahkan jika inputnya tidak valid atau sudah menjadi objek yang lebih baik untuk kebanyakan kasus:

JSON.safeParse = function (input, def) {
  // Convert null to empty object
  if (!input) {
    return def || {};
  } else if (Object.prototype.toString.call(input) === '[object Object]') {
    return input;
  }
  try {
    return JSON.parse(input);
  } catch (e) {
    return def || {};
  }
};

JSON.parse(jsonString);

json.parse akan berubah menjadi objek.

Jika kita memiliki string seperti ini:

"{\"status\":1,\"token\":\"65b4352b2dfc4957a09add0ce5714059\"}"

maka kita cukup menggunakan JSON.parsedua kali untuk mengonversi string ini menjadi objek JSON:

var sampleString = "{\"status\":1,\"token\":\"65b4352b2dfc4957a09add0ce5714059\"}"
var jsonString= JSON.parse(sampleString)
var jsonObject= JSON.parse(jsonString)

Dan kita dapat mengekstraksi nilai dari objek JSON menggunakan:

// instead of last JSON.parse:
var { status, token } = JSON.parse(jsonString);

Hasilnya adalah:

status = 1 and token = 65b4352b2dfc4957a09add0ce5714059

JSON.parse() mengubah string JSON apa saja yang diteruskan ke fungsi menjadi objek JSON.

Untuk memahaminya dengan lebih baik, tekan F12untuk membuka "Periksa Elemen" di browser Anda dan pergi ke konsol untuk menulis perintah berikut:

var response = '{"result":true,"count":1}'; //sample json object(string form)
JSON.parse(response); //converts passed string to JSON Object.

Sekarang jalankan perintah:

console.log(JSON.parse(response));

Anda akan mendapatkan output sebagai Obyek {result: true, count: 1}.

Untuk menggunakan Obyek itu, Anda dapat menetapkannya ke variabel, mungkin obj:

var obj = JSON.parse(response);

Dengan menggunakan objdan .operator dot ( ) Anda dapat mengakses properti dari objek JSON.

Coba jalankan perintah:

console.log(obj.result);

Dokumentasi resmi :

The JSON.parse()Metode mem-parsing string JSON, membangun nilai JavaScript atau objek yang dijelaskan oleh string. reviverFungsi opsional dapat disediakan untuk melakukan transformasi pada objek yang dihasilkan sebelum dikembalikan.

Sintaksis:

JSON.parse(text[, reviver])

Parameter:

text : String yang diurai sebagai JSON. Lihat objek JSON untuk deskripsi sintaks JSON.

reviver (optional) : Jika suatu fungsi, ini menentukan bagaimana nilai yang awalnya dihasilkan oleh parsing ditransformasikan, sebelum dikembalikan.

Nilai pengembalian

Objek yang sesuai dengan teks JSON yang diberikan.

Pengecualian

Melempar pengecualian SyntaxError jika string untuk mem-parse tidak valid JSON.

Mengubah objek ke JSON, dan kemudian menguraikannya, bekerja untuk saya, seperti:

JSON.parse(JSON.stringify(object))

Pisahkan string JSON dengan JSON.parse(), dan data menjadi objek JavaScript:

JSON.parse(jsonString)

Di sini, JSON mewakili untuk memproses dataset JSON.

Bayangkan kami menerima teks ini dari server web:

'{ "name":"John", "age":30, "city":"New York"}'

Untuk menguraikan objek JSON:

var obj = JSON.parse('{ "name":"John", "age":30, "city":"New York"}'); 

Berikut objadalah objek JSON masing-masing yang terlihat seperti:

{ "name":"John", "age":30, "city":"New York"}

Untuk mengambil nilai, gunakan .operator:

obj.name // John
obj.age //30

Konversi objek JavaScript menjadi string dengan JSON.stringify().

Hanya untuk pengurai sampul untuk berbagai jenis input

Mengurai data dengan JSON.parse (), dan data menjadi objek JavaScript.

var obj = JSON.parse('{ "name":"John", "age":30, "city":"New York"}');

Saat menggunakan JSON.parse () pada JSON yang berasal dari array, metode akan mengembalikan array JavaScript, bukan objek JavaScript.

var myArr = JSON.parse(this.responseText);
console.log(myArr[0]);

Objek tanggal tidak diizinkan di JSON. Untuk Dates lakukan hal seperti ini

var text = '{ "name":"John", "birth":"1986-12-14", "city":"New York"}';
var obj = JSON.parse(text);
obj.birth = new Date(obj.birth);

Fungsi tidak diizinkan di JSON. Jika Anda perlu memasukkan fungsi, tulis sebagai string.

var text = '{ "name":"John", "age":"function () {return 30;}", "city":"New York"}';
var obj = JSON.parse(text);
obj.age = eval("(" + obj.age + ")");

Pertanyaan yang lebih lama, saya tahu, namun tidak ada yang memperhatikan solusi ini dengan menggunakan new Function(), fungsi anonim yang mengembalikan data.

Contoh saja:

 var oData = 'test1:"This is my object",test2:"This is my object"';

 if( typeof oData !== 'object' )
  try {
   oData = (new Function('return {'+oData+'};'))();
  }
  catch(e) { oData=false; }

 if( typeof oData !== 'object' )
  { alert( 'Error in code' ); }
 else {
        alert( oData.test1 );
        alert( oData.test2 );
      }

Ini sedikit lebih aman karena dijalankan di dalam suatu fungsi dan tidak dikompilasi dalam kode Anda secara langsung. Jadi jika ada deklarasi fungsi di dalamnya, itu tidak akan terikat ke objek jendela default.

Saya menggunakan ini untuk 'mengkompilasi' pengaturan konfigurasi elemen DOM (misalnya atribut data) sederhana dan cepat.

Ringkasan:

Javascript (baik browser dan NodeJS) memiliki objek bawaan JSON. Pada Obyek ini ada 2 metode yang mudah untuk berurusan dengan JSON. Mereka adalah sebagai berikut:

1. JSON.parse() Dibawa JSONsebagai argumen, mengembalikan objek JS
2. JSON.stringify() Mengambil objek JS sebagai argumen mengembalikan JSONobjek

Aplikasi lain:

Selain itu untuk sangat nyaman berhadapan dengan JSONmereka dapat digunakan untuk cara lain. Kombinasi kedua JSONmetode ini memungkinkan kita untuk membuat klon array atau objek yang sangat mudah. Sebagai contoh:

let arr1 = [1, 2, [3 ,4]];
let newArr = arr1.slice();

arr1[2][0] = 'changed'; 
console.log(newArr); // not a deep clone

let arr2 = [1, 2, [3 ,4]];
let newArrDeepclone = JSON.parse(JSON.stringify(arr2));

arr2[2][0] = 'changed'; 
console.log(newArrDeepclone); // A deep clone, values unchanged

Anda juga dapat menggunakan reviverfungsi untuk memfilter.

var data = JSON.parse(jsonString, function reviver(key, value) {
   //your code here to filter
});

Untuk informasi lebih lanjut, baca JSON.parse.

JSON.parse adalah cara yang tepat untuk mengubah string menjadi objek tetapi jika string yang diuraikan bukan objek atau jika string tidak benar maka akan menimbulkan kesalahan yang akan menyebabkan sisa kode rusak sehingga ideal untuk membungkus fungsi JSON.parse di dalam try-catch like

try{
   let obj = JSON.parse(string);
}catch(err){
   console.log(err);
}

Coba ini. Yang ini ditulis dalam naskah.

         export function safeJsonParse(str: string) {
               try {
                 return JSON.parse(str);
                   } catch (e) {
                 return str;
                 }
           }

/**
 * Safely turning a JSON string into an object
 *
 * @param {String} str - JSON String
 * @returns deserialized object, false if error
 */
export function jsonParse(str) {
  let data = null;
  try {
    data = JSON.parse(str);
  } catch (err) {
    return false;
  }
  return data;
}