Maison > interface Web > js tutoriel > 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

高洛峰
Libérer: 2017-02-17 16:49:23
original
1133 Les gens l'ont consulté

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>
Copier après la connexion


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();
 }
Copier après la connexion
 @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();
 }
Copier après la connexion

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 !

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal