Explication détaillée de la conversion JavaScript et de l'analyse de la méthode JSON examples_javascript skills

Les exemples de cet article décrivent la conversion JavaScript et les méthodes d'analyse JSON. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

Les données au format json sont les suivantes :

var json = { 'jquery': [{ "id": "1", "type": "ASP.NET", "title": "JSON全解析"}] }
    alert(json.jquery[0].id);
    alert(json.jquery[0].type);
    alert(json.jquery[0].title);

Javascript analyse les données json :

window.onload = function() {
 var json = { "China": "[{'City':'上海','value':'1'},{'City':'南京','value':'2'},{'City':'杭州','value':'3'},{'City':'武汉','value':'4'}]" }
 var datas = eval(json.China);
 for (var i = 0; i < datas.length; i++) 
 {
  alert(datas[i].City);
  alert(datas[i].value);
 }
}

Supplément : méthode JSON d'analyse jQuery :

Utilisez la fonction eval pour analyser et chaque méthode jquery pour parcourir

Utilisez JQuery pour analyser les données JSON. En tant qu'objet de transmission de la requête asynchrone JQuery, le résultat renvoyé après la requête JQuery est un objet json. Ce qui est considéré ici est la forme de chaîne renvoyée par le serveur sous forme JSON. plug-ins tels que JSONObject L'objet JSON est similaire à celui-ci et ne sera pas expliqué ici.

Le jeu de chaînes JSON est d'abord donné ici. Le jeu de chaînes est le suivant :

var data=" 
{ 
root: 
[ 
  {name:'1',value:'0'}, 
  {name:'6101',value:'北京市'}, 
  {name:'6102',value:'天津市'}, 
  {name:'6103',value:'上海市'}, 
  {name:'6104',value:'重庆市'}, 
]
}"; 

Sur la base des types de données obtenus de manière asynchrone par JQuery - objets json et chaînes, nous introduisons ici les méthodes de traitement des résultats obtenues par les deux méthodes.

eval()

Pour la chaîne JSON renvoyée par le serveur, si la requête asynchrone jquery ne précise pas le type, ou l'accepte en mode chaîne, alors elle doit être objectivée, ce n'est pas trop gênant, ou il s'agit de mettre la chaîne. dans eval() Exécuté une fois. Cette méthode convient également pour obtenir des objets json à l'aide d'un javascipt ordinaire. Voici un exemple :

.

// 转换为json对象
var dataObj=eval("("+data+")");

Pourquoi devons-nous ajouter ("(" data ")"); pour évaluer ici ?

La raison est : le problème de l'évaluation elle-même. Puisque json commence et se termine par "{}", il sera traité comme un bloc d'instructions dans JS, il doit donc être forcé pour être converti en expression.

Le but de l'ajout de parenthèses est de forcer la fonction eval à convertir l'expression entre parenthèses en objet au lieu de l'exécuter en tant qu'instruction lors du traitement du code JavaScript. Par exemple, prenez l'objet littéral {}. Si aucun crochet extérieur n'est ajouté, alors eval reconnaîtra les accolades comme les marques de début et de fin du bloc de code JavaScript, et {} sera considéré comme exécutant une instruction vide. Les deux résultats d'exécution suivants sont donc différents :

// return undefined
alert(eval("{}"); 
// return object[Object]
alert(eval("({})");

Ce type d'écriture peut être vu partout dans JS. Par exemple : (function()) {}(); Lors d'opérations de fermeture, etc.

//输出root的子对象数量 
alert(dataObj.root.length);
$.each(dataObj.root,fucntion(idx,item){ 
  if(idx==0){ 
    return true; 
  } 
  //输出每个root子对象的名称和值 
  alert("name:"+item.name+",value:"+item.value); 
}) 

Pour que js général génère des objets json, il vous suffit de remplacer la méthode $.each() par une instruction for, et les autres restent inchangées.

Chaîne JSON renvoyée par le serveur

Pour la chaîne JSON renvoyée par le serveur, si la requête asynchrone jquery définit le type (généralement cet attribut de configuration) sur "json", ou utilise la méthode $.getJSON() pour obtenir le retour du serveur, alors l'eval( ) n'est pas nécessaire. Parce que le résultat obtenu à ce moment est déjà un objet json, il vous suffit d'appeler directement l'objet. Ici, la méthode $.getJSON est utilisée comme exemple pour illustrer la méthode de traitement des données :

.

$.getJSON("http://www.xxxx.com/",{param:"gaoyusi"},function(data){ 
  //此处返回的data已经是json对象 
  //以下其他操作同第一种情况 
  $.each(data.root,function(idx,item){ 
    if(idx==0){ 
      //同countinue，返回false同break 
      return true;
    } 
    alert("name:"+item.name+",value:"+item.value); 
  }); 
}); 

Ce qui nécessite une attention particulière ici, c'est que la méthode eval() de la méthode 1 exécute dynamiquement la chaîne (éventuellement un script js), ce qui peut facilement provoquer des problèmes de sécurité du système. Par conséquent, vous pouvez utiliser certaines bibliothèques de scripts client tierces qui contournent eval(). Par exemple, JSON en JavaScript fournit une bibliothèque de scripts ne dépassant pas 3 Ko.

La deuxième méthode d'analyse consiste à utiliser des objets Function. Son application typique est l'analyse des données renvoyées telles que le succès sous la méthode AJAX dans JQuery.

var json='{"name":"CJ","age":18}';
data =(new Function("","return "+json))();

Les données à ce moment sont un objet json qui sera analysé.

J'espère que cet article sera utile à tout le monde dans la programmation JavaScript.