Home Explore Help
Sign In
lovecoding
/
vipAllDay
10
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

html5

e 10 months ago
parent
26f2ea4d17
commit
6c8a4da30e
4 changed files with 173 additions and 77 deletions
Unified View Show Diff Stats
  1. 73 77
      html5/6.JSON.html
  2. 29 0
      html5/7.深拷贝.html
  3. 39 0
      html5/8.深拷贝.html
  4. 32 0
      html5/9.深拷贝.html

+ 73 - 77
html5/6.JSON.html
View File 

@@ -1,86 +1,82 @@
 
 <!DOCTYPE html>
 
 <!DOCTYPE html>
 
 <html lang="en">
 
 <html lang="en">
 
-<head>
 
-    <meta charset="UTF-8">
 
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+  <head>
 
+    <meta charset="UTF-8" />
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
     <title>Document</title>
 
     <title>Document</title>
 
-</head>
 
-<body>
 
+  </head>
 
+  <body>
 
     <!-- 
     <!-- 
         JSON: JavaScript Object Natation
 
         JSON: JavaScript Object Natation
 
                 js对象    表示  数据结构
 
                 js对象    表示  数据结构
 
      -->
 
      -->
 
-     <script>
 
-        // js对象
 
-        var obj = {
 
-            name:"Lucy",
 
-            age: 19
 
-        }
 
-        // json对象
 
-        /***
 
-         * var 声明对象
 
-         * var obj = "{'属性名':'属性值'}"
 
-         * 注意：单引包双引  
-         */
 
-        var obj1 = "{'name':'LiLi'}";
 
-        // console.log(obj);
 
-        // console.log(obj1);
 
-        var arr = [
 
-            {id:1,name:"孙悟空"},
 
-            {id:2,name:"猪八戒"},
 
-            {id:3,name:"哪吒"}
 
-        ]
 
-        console.log(arr,'arr');
 
-        var arr1 = '[{"id":"1","name":"孙悟空"},{"id":"2","name":"猪八戒"},{"id":"3","name":"哪吒"}]'
 
-        console.log(arr1,'arr1');
 
-        // js转json JSON.stringify
 
-        var arr2 = JSON.stringify(arr);
 
-        console.log(arr2,'arr2');
 
-        // json转js JSON.parse
 
-        var arr3 = JSON.parse(arr2);
 
-        console.log(arr3,'arr3')
 
-        var arr4 = JSON.parse(arr1);
 
-        console.log(arr4,'arr4');
 
+    <script>
 
+      // js对象
 
+      var obj = {
 
+        name: "Lucy",
 
+        age: 19,
 
+      };
 
+      // json对象
 
+      /***
 
+       * var 声明对象
 
+       * var obj = "{'属性名':'属性值'}"
 
+       * 注意：单引包双引
 
+       */
 
+      var obj1 = "{'name':'LiLi'}";
 
+    
+      // console.log(obj);
 
+      // console.log(obj1);
 
+      var arr = [
 
+        { id: 1, name: "孙悟空" },
 
+        { id: 2, name: "猪八戒" },
 
+        { id: 3, name: "哪吒" },
 
+      ];
 
+      console.log(arr, "arr");
 
+      var arr1 =
 
+        '[{"id":"1","name":"孙悟空"},{"id":"2","name":"猪八戒"},{"id":"3","name":"哪吒"}]';
 
+      console.log(arr1, "arr1");
 
+      // js转json JSON.stringify
 
+      var arr2 = JSON.stringify(arr);
 
+      console.log(arr2, "arr2");
 
+      // json转js JSON.parse
 
+      var arr3 = JSON.parse(arr2);
 
+      console.log(arr3, "arr3");
 
+      var arr4 = JSON.parse(arr1);
 
+      console.log(arr4, "arr4");
 
 
 
-        /**
 
-         * 堆：引用数据类型
 
-         * 栈：基本数据类型 引用数据类型的指针
 
-         * 深浅拷贝：
 
-        */
 
-       var obj3 = {
 
-        name:"12"
 
-       }
 
-       obj4 = obj3;
 
-       obj3 = JSON.stringify(obj3)
 
-       var obj4;
 
-       obj4.name = '21';
 
-    //    obj4 = {
 
-    //     name:"21"
 
-    //    }
 
-        // obj4 = JSON.stringify(obj4);
 
-        // obj4 = '{"name":"10"}'
 
-       console.log(obj4,'obj4');
 
-       console.log(obj3,'obj3');
 
+      /**
 
+       * 堆：引用数据类型
 
+       * 栈： 型 引用数据类型的指针
 
+       * 深浅拷贝：
 
+       */
 
+      var obj3 = {
 
+        name: "12",
 
+      };
 
+      obj4 = obj3;
 
+      obj3 = JSON.stringify(obj3);
 
+      var obj4;
 
+      obj4.name = "21";
 
+      //    obj4 = {
 
+      //     name:"21"
 
+      //    }
 
+      // obj4 = JSON.stringify(obj4);
 
+      // obj4 = '{"name":"10"}'
 
+      console.log(obj4, "obj4");
 
+      console.log(obj3, "obj3");
 
 
 
-
 
-
 
-
 
-       var obj2;
 
-       obj2 = obj;
 
-       console.log(obj2);
 
-    //    深拷贝：一个对象复制另一个对象的内容 修改当前对象  原对象不发生改变
 
-        // obj2 = '{"name":"小明","age":"22"}'
 
-    //    浅拷贝：一个对象复制另一个对象的内容 修改当前对象  原对象发生改变;
 
-        // obj2.name ='画画';
 
-        obj2 = {
 
-            name:"哈哈",
 
-            age: 10
 
-        }
 
-        console.log(obj2,'obj2');
 
-       console.log(obj,'obj')
 
-
 
-
 
-     </script>
 
-
 
-</body>
 
-</html>
 
+      var obj2;
 
+      obj2 = obj;
 
+      console.log(obj2);
 
+      //    深拷贝：一个对象复制另一个对象的内容 修改当前对象  原对象不发生改变
 
+      // obj2 = '{"name":"小明","age":"22"}'
 
+      //    浅拷贝：一个对象复制另一个对象的内容 修改当前对象  原对象发生改变;
 
+      // obj2.name ='画画';
 
+      obj2 = {
 
+        name: "哈哈",
 
+        age: 10,
 
+      };
 
+      console.log(obj2, "obj2");
 
+      console.log(obj, "obj");
 
+    </script>
 
+  </body>
 
+</html>

+ 29 - 0
html5/7.深拷贝.html
View File 

@@ -0,0 +1,29 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+        var person =  {
 
+            name:"LiLi",
 
+            age: 20
 
+        }
 
+        function deepClone(obj) {
 
+            var obj1 = {};
 
+            for(var key in obj) {
 
+                console.log(obj[key],'key')
 
+                obj1[key] = obj[key]
 
+            }
 
+            return obj1;
 
+        }
 
+        
+        var p1 = deepClone(person);
 
+        p1.name = 'OK';
 
+        console.log(p1,'p1');
 
+        console.log(person,'person')
 
+    </script>
 
+</body>
 
+</html>

+ 39 - 0
html5/8.深拷贝.html
View File 

@@ -0,0 +1,39 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+        var person =  {
 
+            name:"LiLi",
 
+            age: 20,
 
+            message:{
 
+                address:"哈尔滨",
 
+                sex:"女"
 
+            }
 
+        }
 
+        var a  = 1;
 
+        // console.log(typeof person);
 
+        function deepClone(obj) {
 
+            var obj1 = {};
 
+            for(var key in obj) {
 
+                if(typeof obj[key] == "object") {
 
+                    console.log(obj[key])
 
+                    obj1[key] = deepClone(obj[key]);
 
+                } else {
 
+                    obj1[key] = obj[key];
 
+                }
 
+            }
 
+            return obj1;
 
+        }
 
+        
+        var p1 = deepClone(person);
 
+        p1.message.address = '沈阳';
 
+        console.log(p1,'p1');
 
+        console.log(person,'person')
 
+    </script>
 
+</body>
 
+</html>

+ 32 - 0
html5/9.深拷贝.html
View File 

@@ -0,0 +1,32 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+       var arr = ['list',[111,222],{aa:1}];
 
+        function deepClone(data) {
 
+            var news = [];
 
+            // 判断是否是数组 Array.isArray 
+            news = Array.isArray(data) ? [] : {};
 
+            for(var key in data) {
 
+                if(typeof data[key] == 'object') {
 
+                    news[key] = deepClone(data[key]);
 
+                } else {
 
+                    news[key] = data[key];
 
+                }
 
+            }
 
+            return news;
 
+
 
+        }
 
+       var arr1 = deepClone(arr);
 
+       arr1[1][1] = 333;
 
+       arr1[2].aa = 2;
 
+       console.log(arr,'arr');
 
+       console.log(arr1,'arr1');
 
+    </script>
 
+</body>
 
+</html>