fengchuanyu 9 months ago
parent
commit
c18d787065

+ 62 - 0
5_ES6/18_判断数据类型.html

@@ -0,0 +1,62 @@
+<!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>
+        // Function Array Object ...
+
+        var str = "hello";
+        var num = 10;
+        var boo = true;
+        var arr = [1,2];
+        var obj = {a:1};
+        var foo = function(){console.log(1)};
+        var und = undefined;
+        var nu = null;
+
+        // 方法一
+        // console.log( typeof str );
+        // console.log( typeof num);
+        // console.log( typeof boo);
+        // console.log( typeof arr);
+        // console.log( typeof obj);
+        // console.log( typeof foo);
+        // console.log( typeof und);
+        // console.log( typeof nu);
+
+        // 方法二
+        // instanceof 只能判断 object array function
+        // console.log( arr instanceof Array );
+        // console.log( obj instanceof Object );
+        // console.log( str instanceof String );
+        // console.log( foo instanceof Function );
+
+        // 方法三
+        // console.log(arr.constructor == Array)
+        // console.log(str.constructor == String);
+        // console.log(num.constructor == Number);
+        // console.log(foo.constructor == Function);
+        // console.log(obj.constructor == Object);
+        // console.log(boo.constructor == Boolean);
+
+        // 方法四
+        console.log( Object.prototype.toString.call(und) );
+        console.log( Object.prototype.toString.call(nu) );
+        console.log( Object.prototype.toString.call(str) );
+        console.log( Object.prototype.toString.call(num) );
+        console.log( Object.prototype.toString.call(foo) );
+        console.log( Object.prototype.toString.call(boo) );
+        console.log( Object.prototype.toString.call(arr) );
+        console.log( Object.prototype.toString.call(obj) );
+
+
+
+
+
+    </script>
+</body>
+</html>

+ 19 - 1
5_ES6/练习题2_讲解.html

@@ -114,7 +114,12 @@
         // window.setInterval(foo(), 1000);
 
         // function foo() {
-        //补全此处代码实现每隔一秒 输出累加的值 1 2 3 4 5 6 ...
+        // //补全此处代码实现每隔一秒 输出累加的值 1 2 3 4 5 6 ...
+        //     var i = 1
+        //     return function(){
+
+        //         console.log(i++);
+        //     }
         // }
         // window.setInterval(foo(), 1000);
 
@@ -170,6 +175,19 @@
         // var foo2 = foo.bind(obj,"world");
         // foo2()
 
+        //9、补全下列代码
+        var o = { prop: 'loveCoding' };
+
+        function independent() {
+            return this.prop;
+        }
+        //在此补全代码
+
+        // o.f = independent.bind(o);
+        o.f = function(){
+            return independent.call(o)
+        }
+        console.log(o.f()); //  loveCoding
     </script>
 </body>
 

+ 58 - 0
5_ES6/练习题3_手动实现bind.html

@@ -0,0 +1,58 @@
+<!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>
+        //10、用call 或 apply 实现bind 方法
+        function foo(str1,str2) {
+            console.log(this.a,str1,str2)
+        }
+        var obj = {
+            a: "hello"
+        }
+        // foo.bind(obj);
+        // 实现代码
+        Function.prototype.bind2 = function(){
+            // console.log(this);
+            var _obj = arguments[0];
+            // var p1 = arguments[1];
+            // var p2 = arguments[2];
+            // console.log(Array.from(arguments))
+            var pArr = Array.prototype.slice.call(arguments,1);
+            // console.log(pArr);
+            // console.log(arguments);
+            var that = this;
+            return function(){
+                // console.log(that)
+                that.apply(_obj,pArr)
+            }
+        }
+
+        var obj1 = {
+            a:"world"
+        }
+
+        // 执行
+        var foo2 = foo.bind2(obj1,"love","coding");
+        foo2()//hello
+
+        // function foo3(){
+        //     console.log(this.a)
+        // }
+        // var foo4 = foo3.bind2(obj);
+        // foo4();
+
+
+        var arr = ["obj",'a','b','c','d'];
+        var arr1 = arr.slice(1);
+        // console.log(arr1);
+    </script>
+</body>
+
+</html>

+ 40 - 0
5_ES6/练习题4_深度克隆.html

@@ -0,0 +1,40 @@
+<!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 = [1,2,3,['a','b']];
+        // // 扩展运算符只能实现浅拷贝
+        // var arr2 = [...arr];
+        // arr[0] = "hello";
+        // arr[3][0] = "world";
+        // console.log(arr2);
+
+
+        // var arr = [1,2,3,['a','b','c']];
+        // var arr2 = arr;
+        // arr[0] = "hello";
+        // console.log(arr2);
+
+
+        var arr = [1,2,3,['a','b','c']];
+        var obj = {
+            a:1,
+            b:2,
+            c:{
+                str:"hello",
+                num:10
+            }
+        }
+        var newArr = deepClone(arr);
+        var newObj = deepClone(obj);
+
+
+
+    </script>
+</body>
+</html>