JSON(JavaScript Object Notation, JS 對象簡譜) 是一種輕量級的數(shù)據(jù)交換格式。它基于 [ECMAScript] (歐洲計算機協(xié)會制定的js規(guī)范)的一個子集，采用完全獨立于編程語言的文本格式來存儲和表示數(shù)據(jù)。簡潔和清晰的層次結(jié)構(gòu)使得 JSON 成為理想的數(shù)據(jù)交換語言。 易于人閱讀和編寫，同時也易于機器解析和生成，并有效地提升網(wǎng)絡(luò)傳輸效率
注意json字符串中的屬性名只能是字符串，并且只能用雙引號。屬性值如果是字符串的話，也只能使用雙引號
let str = '{"name":"李四","age":18}'
let productsStr = '[{"pname":"iphone11","price":1000},{"pname":"iphone12","price":2000}]'
把json字符串轉(zhuǎn)為js中的對象
JSON.parse(str)
把js中的對象z轉(zhuǎn)化為json字符串
let obj = {
name:'zhangsan',
age:18,
sex:true,
aa:null,
// bbb:undefined,
children:[{name:'xiaoming'},{name:'xiaohong'}]
}
JSON.stringify(obj);
JSON常見報錯
eval 函數(shù)
eval() 函數(shù)可計算某個字符串，并執(zhí)行其中的的 JavaScript 代碼。
eval("x=10;y=20;document.write(x*y)")
document.write(eval("2+2"))
var x=10
document.write(eval(x+17))
var A = '{ "a": 1 , "b" : "hello"}';
JSON.parse(A)
eval("("+A+")");//把字符串 轉(zhuǎn)為對象
localstorge
什么是localStorage
在HTML5中，新加入了一個localStorage特性，這個特性主要是用來作為本地存儲來使用的，
解決了cookie存儲空間不足的問題(cookie中每條cookie的存儲空間為4k)，
localStorage中一般瀏覽器支持的是5M大小，這個在不同的瀏覽器中l(wèi)ocalStorage會有所不同
localStorage的優(yōu)勢
1、localStorage拓展了cookie的4K限制
2、localStorage會可以將第一次請求的數(shù)據(jù)直接存儲到本地，這個相當(dāng)于一個5M大小的針對于前端頁面的數(shù)據(jù)庫，相比于cookie可以節(jié)約帶寬，但是這個卻是只有在高版本的瀏覽器中才支持的
localStorage的局限
1、瀏覽器的大小不統(tǒng)一，并且在IE8以上的IE版本才支持localStorage這個屬性
2、目前所有的瀏覽器中都會把localStorage的值類型限定為string類型，這個在對我們?nèi)粘１容^常見的JSON對象類型需要一些轉(zhuǎn)換
localStorage的寫入
localStorage只支持string類型的存儲
//寫入c字段
localStorage.setItem("c",3);
localStorage的讀取
var c=localStorage.getItem("c");
console.log(c)
localStorage的修改
改這個步驟比較好理解，思路跟重新更改全局變量的值一樣
localStorage.setItem("c",3);
將localStorage中的某個鍵值對刪除
localStorage.removeItem("a");
將localStorage的所有內(nèi)容清除
localStorage.clear();
localStorage其他注意事項
一般我們會將JSON(js中的對象)存入localStorage中，但是在localStorage會自動將localStorage轉(zhuǎn)換成為字符串形式
這個時候我們可以使用JSON.stringify()這個方法，來將JSON轉(zhuǎn)換成為JSON字符串
var data={
name:'zhangsan',
sex:'man',
};
var d=JSON.stringify(data);
storage.setItem("data",d);
//將JSON字符串轉(zhuǎn)換成為JSON對象輸出
var json=storage.getItem("data");
var jsonObj=JSON.parse(json);
思考怎么往localStorage中存入數(shù)組，并且可以向localStorage中這個數(shù)組中添加元素
強化練習(xí)應(yīng)用
使用localStorage實現(xiàn)購物車功能
案例 輪播圖
