Maison  >  Article  >  interface Web  >  Explication détaillée de la façon dont js/jquery analyse les formats json et array

Explication détaillée de la façon dont js/jquery analyse les formats json et array

高洛峰
高洛峰original
2017-02-17 16:49:231103parcourir

Avant d'analyser, nous devons clarifier plusieurs concepts : Quelles sont les différences et les points de contact entre les tableaux, les tableaux associatifs et json ?

1. Introduction aux concepts
1. Tableau

Syntaxe :
ECMAScript v3 spécifie la syntaxe des littéraux de tableau, et JavaScript 1.2 et JScript 3.0 l'implémentent. Vous pouvez créer et initialiser un tableau en plaçant une liste d'expressions séparées par des virgules entre crochets. Les valeurs de ces expressions deviendront des éléments du tableau. Par exemple :

var a = [1, true, 'abc'];

Voir l'API pour les opérations spécifiques

ps : doit être séparé par des crochets.

2. Tableau associatif

1. Syntaxe :
var myhash= {"key1″:"val1″, "key2″:"val2″ };//obj

2.var
myhash= {key1:”val1″, key2:”val2″};//obj-can aussi

ps : presque identique au format json, mais le format json a plus d'exigences Strict (les paires clé-valeur à l'intérieur doivent utiliser des guillemets doubles), mais json ne peut être utilisé que comme standard de format. Si vous souhaitez opérer dessus, il doit être converti en un objet tableau associatif (obj).

2. Opération simple
1. Ajouter une valeur de clé au tableau associatif de hachage

// Ajouter une nouvelle clé newkey, la valeur de clé est newval

myhash[” newkey ”] = “newval”;

2. Supprimer les valeurs de clés existantes dans le tableau associatif de Hash

// Supprimer une clé newkey, et par la même occasion, la newval correspondant à la valeur de la clé disparaîtra
delete myhash[”newkey”];

3. Parcourez le tableau associatif de hachage

// Parcourez tout le tableau de hachage
pour (clé dans myhash ) {
val = myhash[ key];
}

4. Obtenir la valeur

Méthode 1.myhash.key1
Méthode 2.myhash.key2

3.json
Exigences de format :

{"key1″:"val1″, "key2″:"val2″ };//Suivez strictement ce format et l'opération peut être basée sur le fonctionnement des tableaux associatifs

2. Précédent Plusieurs points clés dans l'interaction en arrière-plan
1 Lorsque les données envoyées par le serveur ne sont pas un json, mais plusieurs jsons, la chaîne doit être assemblée en contactant des tableaux et. tableaux associatifs
Par exemple : var objs = [{ id : 1, name: 'n_1' }, { id: 2, name: 'n_2'}];

2. les données envoyées par le serveur au client ne sont qu'une chaîne, donc afin de lui permettre d'effectuer les opérations nécessaires dessus en js et de les convertir en un objet exécutable js via eval().
Par conséquent, le $.parseJSON() fourni dans jQuey a des limites. Si c'est la situation mentionnée en 1 ci-dessus, vous devez utiliser eval() pour la conversion, puis utiliser $.each(objs,function(i ,o ){...}) pour faire fonctionner

3. Exemple de code spécifique
Code de la page :

<body>
 <input type="button" value="send ajax json" onclick="sendAjaxByjson();"/>
 <input type="button" value="send ajax array" onclick="sendAjaxByarray();"/>
</body>
 <script type="text/javascript">
  function sendAjaxByjson(){
   $.post("json",{},function(data){
    var obj=data;
    alert(typeof obj);//string
    //var a=eval(obj);不解,不注释则会报错..
    var strToobj=$.parseJSON(obj);
    alert(strToobj.name);
    alert(typeof strToobj)//obj
    var obja={'name':'techbirds','age':'23','sex':'male'};
    alert(typeof obja);//obj
    alert(obja['name']+":"+obja.age);
    delete obja['name'];
   });
  }
  function sendAjaxByarray(){
   $.post("array",{},function(data){
    var str=data;
    alert(typeof str);//string
    alert(typeof eval(str));//object
    var obja=[1,2,3,4,5];
    alert(typeof obja);//object
   });
  }
 </script>


Code backend :

@Override
 protected void service(HttpServletRequest req, HttpServletResponse reps)
   throws ServletException, IOException {
  Map<String, Object> jsonMap=new HashMap<String, Object>();
  jsonMap.put("name", "techbirds");
  jsonMap.put("age", 23);
  jsonMap.put("sex", "male");
  reps.getWriter().print(JSONObject.fromObject(jsonMap).toString());
  reps.getWriter().flush();
  reps.getWriter().close();
 }
 @Override
 protected void service(HttpServletRequest req, HttpServletResponse reps)
   throws ServletException, IOException {
  String array="[1,2,3,4,5,6]";
  reps.getWriter().print(array);
  reps.getWriter().flush();
  reps.getWriter().close();
 }

Pour des explications plus détaillées sur les méthodes js/jquery pour analyser les formats json et array, veuillez faire attention au site Web PHP chinois !

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn