Anwendungsfall für JSON-Objekte (mit Code)

Dieses Mal bringe ich Ihnen einen Fall zur Verwendung von JSON-Objekten (mit Code). Was sind die Vorsichtsmaßnahmen für die Verwendung von JSON-Objekten? Das Folgende ist ein praktischer Fall, schauen wir uns das an.

Die vorherigen Wörter

Der vollständige Name von JSON (Javascript Object Notation) ist Javascript Object Notation, ein Textformat für den Datenaustausch und keine Programmiersprache zum Lesen strukturierter Daten. Es wurde 2001 von Douglas Crockford mit dem Ziel vorgeschlagen, das umständliche und umständliche XML-Format zu ersetzen. In diesem Artikel wird der Inhalt von JSON ausführlich vorgestellt.

Grammatikregeln

Die Syntax von JSON kann die folgenden drei Arten von Werten darstellen

[1] Einfacher Wert

Einfache Werte verwenden dieselbe Syntax wie JavaScript und können Zeichenfolgen, numerische Werte, boolesche Werte und Nullen in JSON darstellen

Zeichenfolgen müssen durch doppelte Anführungszeichen dargestellt werden. Einfache Anführungszeichen können nicht verwendet werden. Der Wert muss dezimal ausgedrückt werden und NaN und Infinity können nicht verwendet werden

[Hinweis] JSON unterstützt den in JavaScript undefinierten Sonderwert

//合格的简单值
5
"hello world"
true
null

//不合格的简单值
+0x1
'hello world'
undefined
NaN
Infinity

[2] Objekt

Ein komplexer Datentyp, der eine geordnete Menge von Schlüssel-Wert-Paaren darstellt. Der Wert in jedem Schlüssel-Wert-Paar kann ein einfacher Wert oder ein komplexer Datentypwert sein

Im Vergleich zu JavaScript-Objektliteralen weist JSON drei Unterschiede auf

1. JSON hat kein Variablenkonzept

2. In JSON muss der Schlüsselname des Objekts in doppelte Anführungszeichen gesetzt werden

3. Da JSON keine Javascript-Anweisung ist, gibt es am Ende kein Semikolon

[Hinweis] Zwei Eigenschaften mit demselben Namen sollten nicht im selben Objekt erscheinen

//合格的对象
{
  "name":"huochai",
  "age":29,
  "school":{
    "name":"diankeyuan",
    "location":"beijing"
  }
}

//不合格的对象
{ name: "张三", 'age': 32 }//属性名必须使用双引号
{};//不需要末尾的分号
{ "birthday": new Date('Fri, 26 Aug 2011 07:13:10 GMT'),
 "getName": function() {
   return this.name;
 }
} // 不能使用函数和日期对象

【3】Array

Array ist ebenfalls ein komplexer Datentyp, der eine Menge geordneter Werte A darstellt Liste, auf deren Werte über einen numerischen Index zugegriffen werden kann. Der Wert des Arrays kann auch von beliebigem Typ sein – einfacher Wert, Objekt oder Array

Das JSON-Array hat auch keine Variablen und Semikolons. Durch die Kombination von Arrays und Objekten können komplexere Datensammlungen gebildet werden

[. Hinweis] Nach dem letzten Mitglied eines Arrays oder Objekts kann kein Komma hinzugefügt werden analysiert als nützliche Javascript-Objekte

ECMAScript5 standardisiert das Verhalten beim Parsen von JSON und definiert das globale Objekt JSON

[Hinweis] IE7-Browser unterstützt nicht

Es gibt zwei JSON-Objekte Methoden: stringify() und parse(). Diese beiden Methoden werden verwendet, um JavaScript

-Objekte

in JSON-Strings zu serialisieren und JSON-Strings in native JavaScript-Werte zu analysieren

stringify()

Die Methode JSON.stringify() wird verwendet einen Wert in einen String umwandeln. Die Zeichenfolge sollte dem JSON-Format entsprechen und kann mit der JSON.parse()-Methode

wiederhergestellt werden. Standardmäßig enthält die von JSON.stringify() ausgegebene JSON-Zeichenfolge keine Leerzeichen oder Einrückungen

var jsonObj = {
  "title":"javascript",
  "group":{
    "name":"jia",
    "tel":12345
  }
};
//{"title":"javascript","group":{"name":"jia","tel":12345}}
JSON.stringify(jsonObj);

Spezifische Konvertierung

JSON.stringify('abc') // ""abc""
JSON.stringify(1) // "1"
JSON.stringify(false) // "false"
JSON.stringify([]) // "[]"
JSON.stringify({}) // "{}"
JSON.stringify([1, "false", false])// '[1,"false",false]'
JSON.stringify({ name: "张三" })// '{"name":"张三"}'

Die stringify()-Methode konvertiert

reguläre Ausdrücke

und mathematische Objekte in die String-Form leerer Objekte

JSON.stringify(/foo/) // "{}"
JSON.stringify(Math) // "{}"

Die Methode stringify() konvertiert Datumsobjekte und Wrapper-Objekte in Strings

JSON.stringify(new Boolean(true)) //"true"
JSON.stringify(new String('123')) //""123""
JSON.stringify(new Number(1)) //"1"
JSON.stringify(new Date()) //""2016-09-20T02:26:38.294Z""

Wenn das Mitglied des Objekts undefiniert oder eine Funktion ist, wird dieses Mitglied weggelassen

Wenn das Mitglied des Arrays undefiniert ist undefiniert oder eine Funktion, Dann werden diese Werte in null konvertiert

JSON.stringify({
 a: function(){},
 b: undefined,
 c: [ function(){}, undefined ]
});
// "{"c":[null,null]}"

　Die JSON.stringify()-Methode ignoriert die nicht durchquerbaren Eigenschaften des Objekts

var obj = {};
Object.defineProperties(obj, {
 'foo': {
  value: 1,
  enumerable: true
 },
 'bar': {
  value: 2,
  enumerable: false
 }
});
JSON.stringify(obj); // {"foo":1}]

Parameter

　JSON.stringify Zusätzlich zum zu serialisierenden JavaScript-Objekt kann () auch zwei weitere Parameter empfangen, mit denen verschiedene Arten der Serialisierung des JavaScript-Objekts angegeben werden. Der erste Parameter ist ein Filter, der ein Array oder eine Funktion sein kann; der zweite Parameter ist eine Option, die angibt, ob die Einrückung in der JSON-Zeichenfolge beibehalten werden soll

[Array-Filter]

Wenn die Der zweite Parameter der stringify()-Methode ist ein Array. Dies entspricht der Implementierung der Funktion eines Filters

　　【1】过滤器只对对象的第一层属性有效

var jsonObj = {
  "title":"javascript",
  "group":{
    "a":1
  }
};
//{"group":{"a":1}}
console.log(JSON.stringify(jsonObj,["group","a"]))

　　【2】过滤器对数组无效

var jsonObj =[1,2];
JSON.stringify(jsonObj,["0"])//"[1,2]"

【函数参数】

　　stringify()方法的第二个参数也可以是一个函数。传入的函数接收两个参数，属性(键)名和属性值

JSON.stringify({a:1,b:2}, function(key, value){
 if (typeof value === "number") {
  value = 2 * value;
 }
 return value;  
})
// "{"a":2,"b":4}"

　　属性名只能是字符串，而在值并非键值对儿结构的值时，键名可以是空字符串

　　这个函数参数会递归处理所有的键

　　下面代码中，对象o一共会被f函数处理三次。第一次键名为空，键值是整个对象o；第二次键名为a，键值是{b:1}；第三次键名为b，键值为1

JSON.stringify({a: {b: 1}}, function (key, value) {
 console.log("["+ key +"]:" + value);
 return value;
})
// []:[object Object]
// [a]:[object Object]
// [b]:1
// '{"a":{"b":1}}'

　　函数返回的值就是相应键的值。如果函数返回了undefined或没有返回值，那么相应的属性会被忽略

JSON.stringify({ a: "abc", b: 123 }, function (key, value) {
 if (typeof(value) === "string") {
  return undefined;
 }
 return value;
})
// '{"b": 123}'

【缩进】

　　stringify()方法还可以接受第三个参数，用于增加返回的JSON字符串的可读性

　　如果是数字，表示每个属性前面添加的空格(最多不超过10个)

　　如果是字符串(不超过10个字符)，则该字符串会添加在每行前面

/*"{
 "p1": 1,
 "p2": 2
}"*/
JSON.stringify({ p1: 1, p2: 2 }, null, 2);
//"{"p1":1,"p2":2}"
JSON.stringify({ p1: 1, p2: 2 }, null, 0);
/*"{
|-"p1": 1,
|-"p2": 2
}"*/
JSON.stringify({ p1:1, p2:2 }, null, '|-');
toJSON()

　　有时候，JSON.stringify()还是不能满足对某些对象进行自定义序列化的需求。在这些情况下， 可以通过对象上调用toJSON()方法，返回其自身的JSON数据格式

JSON.stringify({
 toJSON: function () {
  return "Cool"
 }
})
// ""Cool""

var o = {
 foo: 'foo',
 toJSON: function() {
  return 'bar';
 }
};
JSON.stringify({x: o});// '{"x":"bar"}'

　　如果toJSON()方法返回undefined，此时如果包含它的对象嵌入在另一个对象中，会导致该对象的值变成null。而如果包含它的对象是顶级对象，结果就是undefined

JSON.stringify({
 toJSON: function () {
  return undefined
 }
})
//undefined

　　Date对象部署了一个自己的toJSON方法，自动将Date对象转换成日期字符串

JSON.stringify(new Date("2016-08-29"))
// "2016-08-29T00:00:00.000Z"

　　toJSON方法的一个应用是，可以将正则对象自动转为字符串

RegExp.prototype.toJSON =RegExp.prototype.toString;
JSON.stringify(/foo/)// ""/foo/""

　　toJSON()可以作为函数过滤器的补充，因此理解序列化的内部顺序十分重要。假设把一个对象传入JSON.stringify()，序列化该对象的顺序如下

　　1、如果存在toJSON()方法而且能通过它取得有效的值，则调用该方法。否则，按默认顺序执行序列化

　　2、如果提供了第二个参数，应用这个函数过滤器。传入函数过滤器的值是第一步返回的值

　　3、对第二步返回的每个值进行相应的序列化

　　4、如果提供了第三个参数，执行相应的格式化

parse()

　　JSON.parse方法用于将JSON字符串转化成对象

JSON.parse('{}') // {}
JSON.parse('true') // true
JSON.parse('"foo"') // "foo"
JSON.parse('[1, 5, "false"]') // [1, 5, "false"]
JSON.parse('null') // null
var o = JSON.parse('{"name": "张三"}');
o.name // 张三

　　如果传入的字符串不是有效的JSON格式，JSON.parse方法将报错

//Uncaught SyntaxError: Unexpected token u in JSON at position 0(…)JSON.parse("'String'")
//Uncaught SyntaxError: Unexpected token u in JSON at position 0(…)JSON.parse("undefined")

　　JSON.parse()方法也可以接收一个函数参数，在每个键值对儿上调用，这个函数被称为还原函数(reviver)。该函数接收两个参数，一个键和一个值，返回一个值

　　如果还原函数返回undefined，则表示要从结果中删除相应的键；如果返回其他值，则将该值插入到结果中

var o = JSON.parse('{"a":1,"b":2}', function(key, value) {
 if (key === ''){
  return value;
 }
 if (key === 'a') {
  return value + 10;
 }
});
o.a // 11
o.b // undefinef

　　在将日期字符串转换为Date对象时，经常要用到还原函数

var book = {
  "title": "javascript",
  "date": new Date(2016,9,1)
}
var jsonStr = JSON.stringify(book);
//'{"title":"javascript","date":"2016-09-30T16:00:00.000Z"}''
console.log(jsonStr)
var bookCopy = JSON.parse(jsonStr,function(key,value){
  if(key == 'date'){
    return new Date(value);
  }
  return value;
})
console.log(bookCopy.date.getFullYear());//2016

eval()

　　实际上，eval()类似于JSON.parse()方法，可以将json字符串转换为json对象

eval('(' + '{"a":1}'+')').a;//1
JSON.parse('{"a":1}').a;//1

　　但是，eval()可以执行不符合JSON格式的代码，有可能会包含恶意代码

eval('(' + '{"a":alert(1)}'+')').a;//弹出1
JSON.parse('{"a":alert(1)}').a;//报错

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：

jquery中ajax执行顺序调整

Ajax与$.ajax实例详解

Das obige ist der detaillierte Inhalt vonAnwendungsfall für JSON-Objekte (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!