Maison > interface Web > js tutoriel > Explication détaillée de la définition de l'objet JSON et des étapes de mise en œuvre de la valeur dans JS

Explication détaillée de la définition de l'objet JSON et des étapes de mise en œuvre de la valeur dans JS

php中世界最好的语言
Libérer: 2018-05-22 11:53:15
original
2968 Les gens l'ont consulté

Cette fois, je vais vous apporter une explication détaillée des étapes de définition d'objet JSON et d'implémentation de valeur dans JS. Quelles sont les précautions pour la définition d'objet JSON et l'implémentation de valeur dans JS. cas. Jetons un coup d'oeil une fois.

1.JSON (JavaScript Object Notation) est un format de données simple qui est plus léger que XML. JSON est un format JavaScript natif, ce qui signifie qu'aucune API ou boîte à outils spéciale n'est requise pour gérer les données JSON en JavaScript.

Les règles de JSON sont simples : un objet est une collection non ordonnée de paires "nom:valeur". Un objet commence par "{" (crochet gauche) et se termine par "}" (crochet droit). Chaque "nom" est suivi d'un ":" (deux-points) ; les paires "nom/valeur" sont séparées par "," (virgule).

Les règles sont les suivantes :

1) Le mappage est représenté par deux points (":"). Nom : Valeur
2) Les données parallèles sont séparées par des virgules (","). Nom 1 : valeur 1, nom 2 : valeur 2
3) La collection mappée (objet) est représentée par des accolades ("{}"). {Nom 1 : Valeur 1, Nom 2 : Valeur 2}
4) La collection (tableau) de données parallèles est représentée par des crochets ("[]").
[
{nom 1 : valeur, nom 2 : valeur 2},
{nom 1 : valeur, nom 2 : valeur 2}
]
5) Les types que l'élément valorise ​​peut avoir : chaîne, nombre, objet, tableau, vrai, faux, nul

2. Cinq méthodes d'écriture en json :

1) Manière traditionnelle de stocker des données et d'appeler des données

<script type="text/javascript">
//JS传统方式下定义"类"
function Person(id,name,age){
this.id = id;
this.name = name;
this.age = age;
}
//JS传统方式下创建"对象"
var p = new Person(20141028,"一叶扁舟",22); 
//调用类中的属性,显示该Person的信息
window.alert(p.id);
window.alert(p.name);
window.alert(p.age);
</script>
Copier après la connexion

2) Le premier style :

<script type="text/javascript">
var person = {
id:001,
name:"一叶扁舟",
age:23
}
window.alert("编号:"+person.id);
window.alert("用户名:"+person.name);
window.alert("年龄:"+person.age);
</script>
Copier après la connexion

3) Le deuxième style :

<script type="text/javascript">
var p = [
{id:001,name:"一叶扁舟",age:22},
{id:002,name:"无悔",age:23},
{id:003,name:"无悔_一叶扁舟",age:24}
]; 
 
for(var i = 0; i < p.length; i++){
window.alert("编号:"+p[i].id);
window.alert("用户名:"+p[i].name);
window.alert("年龄:"+p[i].age);
 
}
</script>
Copier après la connexion

4) Le troisième style :

<script type="text/javascript">
var p = {
"province":[
{"city":"福州"},
{"city":"厦门"},
{"city":"莆田"}
]
};
window.alert("所在城市:" + p.province[0].city);
</script>
Copier après la connexion

5) Le quatrième style :

<script type="text/javascript">
var p = {
"ids":[
{"id":001},
{"id":002},
{"id":003}
],
"names":[
{"name":"一叶扁舟"},
{"name":"无悔"},
{"name":"无悔_一叶扁舟"}
]
}; 
 
for(var i = 0; i < p.names.length; i++){
window.alert("名字:"+p.names[i].name); 
}
for(var i = 0; i < p.ids.length; i++){
window.alert("id:"+p.ids[i].id);
}
 
</script>
Copier après la connexion

6) Le cinquième style :

<script type="text/javascript">
var p = {
"province":["福州","厦门","莆田"]
};
window.alert("城市的个数:"+p.province.length);
window.alert("分别是:\n");
for(var i=0;i<p.province.length;i++){
window.alert(p.province[i]);
}
</script>
Copier après la connexion

Je crois que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des choses plus passionnantes. , veuillez faire attention à php Autres articles connexes sur le site chinois !

Lecture recommandée :

Explication détaillée des étapes pour implémenter une requête floue avec jQuery

Gestion des problèmes Async/wait hell

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en 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