0基础小白深入掌握Json json转js对象的方法

前言：

上节说道：只见那周瑜拿着大刀，骑着大马，飞奔而来。然后子龙一个回马枪打的那周瑜是落荒而逃~~咳咳……

不好意思，跑题了，回到正题。

上节讲解了js中处理json的一个很重要的方法：

JSON.stringify() ，没有读的小伙伴先去看一下文章：

你真会用js中的JSON（二）？

这节继续来讲另一个同样重要的方法，怎么样把一个json字符串转成json中的对象，有转就有解嘛~~

JSON.parse()

该方法的作用是把json字符串转成javascript中对象：

var json = '{"name": "张三", "age": 10, "address": "北京"}'
var obj = JSON.parse(json)
console.log(obj.name) // '张三'
console.log(obj.age) // 10
console.log(obj.address) // '北京'
// 用法还是挺简单的。但是如果我不小心手残了，
// 把json字符串写错了，比如：键忘记写双引号了，看看会有什么效果

var errorJson = '{name: "张三", "age": 10, "address": "北京"}'
var obj1 = JSON.parse(errorJson)
// Uncaught SyntaxError: Unexpected token n in JSON at position 1

// 是的，报错啦~~~
// 这说明，如果我们传入的json字符串是一个错误的格式，那么该方法会报错

通常，我们会用try…catch语句来捕获一下这个错误，

var errorJson = '{name: "张三", "age": 10, "address": "北京"}'
try{
  JSON.parse(errorJson)
}catch(e){
  // 捕获错误，对错误对行处理
  console.log(e)
}

parse()方法还可以接收另一个可选参数，该参数和stringify()方法的第二个参数差不多，类型为函数类型的。

var json = '{"name": "张三", "age": 10, "address": "北京"}'
var handleFunction = function (key, value) {
  if (key === 'age') {
    return value + 10
  }
  return value
}
var obj = JSON.parse(json, handleFunction)
console.log(obj) // name: "张三", age: 20, address: "北京"}
// 上面代码我们判断如果键是`age`的话，就让值加10，最终得到结果是：20
// 和 stringify()函数用法基本一样。

对象中的toJSON

先说用法：如果某个对象中定义了toJSON方法，那么在把个对象转成json字符串的时候，就会调用这个方法，而忽略对象的其它属性。

// 先来看一个没有toJSON方法的对象
var person = {
  name: '张三',
  age: 10,
  address: '北京'
}
var json = JSON.stringify(person)
console.log(json) // {"name":"张三","age":10,"address":"北京"}

// 再看一下如果给这个对象加上toJSON方法
var person = {
  name: '张三',
  age: 10,
  address: '北京',
  toJSON: function(){
    return '我是toJSON方法的返回值'
  }
}
var json = JSON.stringify(person)
console.log(json) // "我是toJSON方法的返回值"
// 可以发现，如果定义了toJSON方法，stringify()就会调用对象的toJSON方法，
// 并且把返回值做为要转成json的对象


// 再来看一个例子
var person = {
  name: '张三',
  age: 10,
  address: '北京',
  toJSON: function(){
    return {
      name: '李四',
      age: 20,
      address: '上海'
    }
  }
}
var json = JSON.stringify(person)
console.log(json) //{"name":"李四","age":20,"address":"上海"}
// 可以发现，要转json的对象已经和原来不一样了。

好了，js中的JSON知识点就介绍这么多。