6.JSON.html 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <!--
  10. JSON: JavaScript Object Natation
  11. js对象 表示 数据结构
  12. -->
  13. <script>
  14. // js对象
  15. var obj = {
  16. name:"Lucy",
  17. age: 19
  18. }
  19. // json对象
  20. /***
  21. * var 声明对象
  22. * var obj = "{'属性名':'属性值'}"
  23. * 注意:单引包双引
  24. */
  25. var obj1 = "{'name':'LiLi'}";
  26. // console.log(obj);
  27. // console.log(obj1);
  28. var arr = [
  29. {id:1,name:"孙悟空"},
  30. {id:2,name:"猪八戒"},
  31. {id:3,name:"哪吒"}
  32. ]
  33. console.log(arr,'arr');
  34. var arr1 = '[{"id":"1","name":"孙悟空"},{"id":"2","name":"猪八戒"},{"id":"3","name":"哪吒"}]'
  35. console.log(arr1,'arr1');
  36. // js转json JSON.stringify
  37. var arr2 = JSON.stringify(arr);
  38. console.log(arr2,'arr2');
  39. // json转js JSON.parse
  40. var arr3 = JSON.parse(arr2);
  41. console.log(arr3,'arr3')
  42. var arr4 = JSON.parse(arr1);
  43. console.log(arr4,'arr4');
  44. /**
  45. * 堆:引用数据类型
  46. * 栈:基本数据类型 引用数据类型的指针
  47. * 深浅拷贝:
  48. */
  49. var obj3 = {
  50. name:"12"
  51. }
  52. obj4 = obj3;
  53. obj3 = JSON.stringify(obj3)
  54. var obj4;
  55. obj4.name = '21';
  56. // obj4 = {
  57. // name:"21"
  58. // }
  59. // obj4 = JSON.stringify(obj4);
  60. // obj4 = '{"name":"10"}'
  61. console.log(obj4,'obj4');
  62. console.log(obj3,'obj3');
  63. var obj2;
  64. obj2 = obj;
  65. console.log(obj2);
  66. // 深拷贝:一个对象复制另一个对象的内容 修改当前对象 原对象不发生改变
  67. // obj2 = '{"name":"小明","age":"22"}'
  68. // 浅拷贝:一个对象复制另一个对象的内容 修改当前对象 原对象发生改变;
  69. // obj2.name ='画画';
  70. obj2 = {
  71. name:"哈哈",
  72. age: 10
  73. }
  74. console.log(obj2,'obj2');
  75. console.log(obj,'obj')
  76. </script>
  77. </body>
  78. </html>