1 săptămână în urmă · 660e8cedf1
--- a/11.复习/1.事件委托.html
+++ b/11.复习/1.事件委托.html
@@ -19,7 +19,6 @@
 
				         }
			
 
				     </style>
			
 
				 </head>
			
 
				-
			
 
				 <body>
			
 
				     <ul>
			
 
				         <li>1</li>
			
@@ -27,7 +26,7 @@
 
				         <li>3</li>
			
 
				         <li>4</li>
			
 
				     </ul>
			
 
				-    <button @click="handleAdd">添加</button>
			
 
				+    <button>添加</button>
			
 
				     <div id="box1">
			
 
				         <div id="box2"></div>
			
 
				     </div>
			
--- a/11.复习/2.this指向.html
+++ b/11.复习/2.this指向.html
@@ -0,0 +1,52 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="en">
			
 
				+
			
 
				+<head>
			
 
				+    <meta charset="UTF-8">
			
 
				+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
			
 
				+    <title>Document</title>
			
 
				+    <style>
			
 
				+        #box {
			
 
				+            width: 200px;
			
 
				+            height: 200px;
			
 
				+            background-color: #f00;
			
 
				+        }
			
 
				+    </style>
			
 
				+</head>
			
 
				+
			
 
				+<body>
			
 
				+    <div id="box"></div>
			
 
				+    <script>
			
 
				+        var box = document.getElementById("box");
			
 
				+        // 1.点击事件 this指向该对象
			
 
				+        // box.onclick = function() {
			
 
				+        //     console.log(this) 
			
 
				+        // }
			
 
				+        // 2.定时器 this指向window
			
 
				+        // setTimeout(()=> {
			
 
				+        //     console.log(this)
			
 
				+        // },2000)
			
 
				+        // box.onclick = function () {
			
 
				+        //     setTimeout(() => {
			
 
				+        //         console.log(this)
			
 
				+        //     }, 2000)
			
 
				+        // }
			
 
				+        // setInterval(定时器) / setTimeout(延时器)
			
 
				+        // 3.对象中  普通函数 调用本身;箭头函数调用 上下级
			
 
				+        // let obj = {
			
 
				+        //     name:"图图",
			
 
				+        //     age:3,
			
 
				+        //     address:function() {
			
 
				+        //         console.log(this,'语音')
			
 
				+        //     }
			
 
				+        // }
			
 
				+        // obj.address();
			
 
				+        // 4.普通函数 this指向window
			
 
				+        function fn() {
			
 
				+            console.log(this)
			
 
				+        }
			
 
				+        fn()
			
 
				+    </script>
			
 
				+</body>
			
 
				+
			
 
				+</html>
			
--- a/11.复习/3.修改this指向.html
+++ b/11.复习/3.修改this指向.html
@@ -0,0 +1,31 @@
 
				+<!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 fn(x,y) {
			
 
				+            const sum = x + y;
			
 
				+            console.log(sum,'sum');
			
 
				+            console.log(this,'this');
			
 
				+            console.log(this.name,'name');
			
 
				+        }
			
 
				+        let obj = {
			
 
				+            name:"图图",
			
 
				+        }
			
 
				+        // fn(2,3)
			
 
				+        // fn.call(obj,2,3);
			
 
				+        // fn.apply(obj,[2,3]);
			
 
				+        fn.bind(obj,2,3)();
			
 
				+        /**
			
 
				+         * call bind apply
			
 
				+         * 1.bind无法直接调用 call和apply可以直接调用
			
 
				+         * 2.call和bind从第二项开始，要传入的参数逐个传入
			
 
				+         * 3.apply从第二项开始，要传入的参数以数组形式传入
			
 
				+        */
			
 
				+    </script>
			
 
				+</body>
			
 
				+</html>
			
--- a/11.复习/4.原型和原型链.html
+++ b/11.复习/4.原型和原型链.html
@@ -0,0 +1,86 @@
 
				+<!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 fn() {
			
 
				+        //     console.log(this)
			
 
				+        //     return '哈哈'
			
 
				+        // }
			
 
				+        // console.log(fn(),'fn')
			
 
				+        // 匿名函数
			
 
				+        // let xxx = function() {}
			
 
				+        // // 立即执行函数
			
 
				+        // (function(){})()
			
 
				+        // let obj = {
			
 
				+        //     name:"图图",
			
 
				+        //     age:3,
			
 
				+        //     address:function() {
			
 
				+
			
 
				+        //     }
			
 
				+        // }
			
 
				+        /** 
			
 
				+         * 构造函数
			
 
				+         * 1.首字母大写
			
 
				+         * 2.new进行实例化调用
			
 
				+         * 3.this指向当前实例
			
 
				+         * 4.构造函数  不用return反值
			
 
				+         * 属性写在构造函数中
			
 
				+         * 方法写在原型中
			
 
				+         * */
			
 
				+        function Person() {
			
 
				+            this.name = "图图";
			
 
				+            this.age = 3;
			
 
				+        }
			
 
				+        // 原型  
			
 
				+        Person.prototype.address = function () {
			
 
				+            console.log("翻斗花园")
			
 
				+        }
			
 
				+        /**
			
 
				+         * 原型：
			
 
				+         * 1.所有的构造函数中都自带了一个prototype属性(显性)，该属性指向的是当前构造函数的原型
			
 
				+         * 2.所有的构造函数中自带了一个constructor属性(构造器),该属性指向的是当前原型的构造函数
			
 
				+         * 3.构造函数可以通过new去进行实例化 产生该构造函数的实例化对象
			
 
				+         * 4.实例化对象可以通过_proto_（隐性）方法访问该构造函数原型中的属性和方法
			
 
				+         * 
			
 
				+        */
			
 
				+        let p1 = new Person();
			
 
				+        console.log(p1, 'p1')
			
 
				+        p1.address();
			
 
				+        // var person = new Person();
			
 
				+        // console.log(person.__proto__ == Person.prototype)
			
 
				+        // console.log(Person.prototype.constructor == Person)
			
 
				+        // console.log(Object.getPrototypeOf(person) === Person.prototype)
			
 
				+
			
 
				+        /**
			
 
				+         * 原型链
			
 
				+         * 访问对象属性 先从对象本身找
			
 
				+         * 通过_proto_去原型上找
			
 
				+         * 若还没有找到 则在原型对象的原型上查找  找到则返回  未找到反undefined
			
 
				+        */
			
 
				+
			
 
				+
			
 
				+         /* 面试题
			
 
				+         *  所有的函数数据类型都天生自带一个prototype属性，该属性的属性值是一个对象，指向原型
			
 
				+         *  prototype的属性值中天生自带一个constructor属性，其constructor属性值指向当前原型所属的构造函数/类
			
 
				+         *  所有的对象数据类型（实例），都天生自带一个_proto_属性，该属性的属性值指向当前实例所属类的原型
			
 
				+         *  总结
			
 
				+         *  把所有的对象共用的属性全部放在堆内存的一个对象（共用属性组成的对象）
			
 
				+         *  ，然后让每一个对象的 __proto__存储这个「共用属性组成的对象」的地址。
			
 
				+         *  而这个共用属性就是原型，原型出现的目的就是为了减少不必要的内存消耗。
			
 
				+         *  而原型链就是对象通过__proto__向当前实例所属类的原型上查找属性或方法的机制
			
 
				+         *  ，如果未找到，则去Object的原型上找，还是没有找到想要的属性或者是方法则查找结束，
			
 
				+         *  最终会返回undefined
			
 
				+         * /
			
 
				+
			
 
				+    </script>
			
 
				+</body>
			
 
				+
			
 
				+</html>
			
--- a/11.复习/5.获取屏幕的宽高.html
+++ b/11.复习/5.获取屏幕的宽高.html
@@ -0,0 +1,15 @@
 
				+<!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 screenWidth = document.body.clientWidth || document.documentElement.clientWidth;
			
 
				+        var screenHeight = document.body.clientHeight || document.documentElement.clientHeight;
			
 
				+        console.log(screenHeight, 'screenHeight')
			
 
				+    </script>
			
 
				+</body>
			
 
				+</html>
			
--- a/11.复习/img/1.png
+++ b/11.复习/img/1.png
--- a/11.复习/img/2.png
+++ b/11.复习/img/2.png
--- a/11.复习/img/3.png
+++ b/11.复习/img/3.png
--- a/11.复习/img/4.png
+++ b/11.复习/img/4.png