基于AJAX获取数据/JSON字符串转换为对象

获取数据和实现数据绑定
=>真实项目中，页面中大部分数据都不是写死的，而是动态绑定的
A：从服务器端获取到数据（基于AJAX/JSONP等技术，通过服务器端提供的数据API接口地址，把数据请求回来）
B：把获取的数据进行解析
C：把数据绑定在HTML页面中（数据绑定）；ES6中的模板字符串

let productData = null;
let xhr = new XMLHttpRequest();//=>创建ajax实例
xhr.open('GET','./json/product.json',false);//=>打开一个请求的地址（一般地址都是服务器提供好的，会给我们一个api接口文档），最后一个参数是设置同步还是异步（false:同步 true：异步），真实项目中最常使用的是异步
xhr.onreadystatechange = () => {
      if(xhr.readyState === 4 && xhr.status ===200) {
         productData = xhr.responseText;
      }
};
xhr.send(null);

//=>获取的结果是一个字符串："json格式的字符串",我们此时需要把获取的字符串转换为对象
console.log(productData);

json格式不是一种数据类型，而是一种数据格式，只要把对象的属性名用双引号括起来，此时的对象就不再称为普通对象，而是叫json格式的对象
从服务器获取的数据格式一般都是json格式的（大部分都是json格式字符串）

window.JSON
      1.parse:把JSON格式的字符串转为对象
      2.stringify：把对象转换为JSON格式的字符串
window.JSON.parse
JSON.stringify

productData = JSON.parse(productData);