update:构造函数相关

02-CSS/05-CSS样式表的继承性和层叠性.md

@@ -132,7 +132,6 @@ PS：不进位，实际上能进位（奇淫知识点：255个标签，等于1
 
 ![](http://img.smyhvae.com/20170727_0843.png)
 
-
 另外：**如果大家的权重相同，那么就采用就近原则：谁描述的近，听谁的**。举例如下：(box3 描述得最近，所以采用 box3 的属性)
 
 ![](http://img.smyhvae.com/20190122_1530.png)

03-JavaScript基础/11-this.md

@@ -89,8 +89,11 @@
 
 ES6中的箭头函数并不会使用上面四条标准的绑定规则，而是会继承外层函数调用的this绑定（无论this绑定到什么）。
 
+
 ## arguments（待定）
 
+> 这部分，小白可能看不懂。所以，这一段，可以忽略。
+
 在调用函数时，浏览器每次都会传递进两个隐含的参数：
 
 - 1.函数的上下文对象 this

03-JavaScript基础/18-对象的创建、构造函数和原型.md → 03-JavaScript基础/12-对象的创建、构造函数和原型.md

@@ -1,18 +1,6 @@
 
 
-
-
-## 面向对象的概念
-
-**对象的作用是：封装信息**。比如Student类里可以封装学生的姓名、年龄、成绩等。
-
-那为什么不用数组封装信息呢？首先，数组只能存放同一种类型的数据；其次，要...
-
-对象具有**特征**（属性）和**行为**（方法）。
-
-面向对象：可以创建自定义的类型、很好的支持继承和多态。
-
-面向对象的特征：封装、继承、多态。
+ > 在看本文之前，可以先复习前面的一篇文章：《03-JavaScript基础/07-对象简介和对象的基本操作.md》
 
 ## 创建自定义对象的几种方法
 
@@ -39,8 +27,39 @@ console.log(o);
 
 ![](http://img.smyhvae.com/20180125_1834.png)
 
-### 方式二：利用构造函数
+### 方式二：工厂模式
 
+通过该方法可以大批量的创建对象。
+
+```javascript
+        /*
+         * 使用工厂方法创建对象
+         *  通过该方法可以大批量的创建对象
+         */
+        function createPerson(name, age, gender) {
+            //创建一个新的对象
+            var obj = new Object();
+            //向对象中添加属性
+            obj.name = name;
+            obj.age = age;
+            obj.gender = gender;
+            obj.sayName = function() {
+                alert(this.name);
+            };
+            //将新的对象返回
+            return obj;
+        }
+
+        var obj2 = createPerson("猪八戒", 28, "男");
+        var obj3 = createPerson("白骨精", 16, "女");
+        var obj4 = createPerson("蜘蛛精", 18, "女");
+```
+
+**弊端：**
+
+使用工厂方法创建的对象，使用的构造函数都是Object。**所以创建的对象都是Object这个类型，就导致我们无法区分出多种不同类型的对象**。
+
+### 方式三：利用构造函数
 
 ```javascript
         //利用构造函数自定义对象
@@ -66,62 +85,57 @@ console.log(o);
 
 ![](http://img.smyhvae.com/20180125_1350.png)
 
+接下来，我们专门来讲一下构造函数。
 
-### 方式三：工厂模式
+## 构造函数
+
+### 代码引入
 
-通过该方法可以大批量的创建对象。
 
 ```javascript
-        /*
-         * 使用工厂方法创建对象
-         *  通过该方法可以大批量的创建对象
-         */
-        function createPerson(name, age, gender) {
-            //创建一个新的对象
-            var obj = new Object();
-            //向对象中添加属性
-            obj.name = name;
-            obj.age = age;
-            obj.gender = gender;
-            obj.sayName = function() {
-                alert(this.name);
-            };
-            //将新的对象返回
-            return obj;
-        }
+      // 创建一个构造函数，专门用来创建Person对象
+      function Person(name, age, gender) {
+        this.name = name;
+        this.age = age;
+        this.gender = gender;
+        this.sayName = function() {
+          alert(this.name);
+        };
+      }
 
-        var obj2 = createPerson("猪八戒", 28, "男");
-        var obj3 = createPerson("白骨精", 16, "女");
-        var obj4 = createPerson("蜘蛛精", 18, "女");
-```
+      function Dog() {}
 
-**分析：**
+      var per = new Person("孙悟空", 18, "男");
+      var per2 = new Person("玉兔精", 16, "女");
+      var per3 = new Person("奔波霸", 38, "男");
 
-使用工厂方法创建的对象，使用的构造函数都是Object。所以创建的对象都是Object这个类型，就导致我们无法区分出多种不同类型的对象。
+      var dog = new Dog();
+```
 
-## 构造函数
 
+### 构造函数和普通函数的区别
 
-### new和this
+构造函数就是一个普通的函数，创建方式和普通函数没有区别，不同的是构造函数习惯上首字母大写。
 
-**this：**
+构造函数和普通函数的区别就是**调用方式**的不同：普通函数是直接调用，而构造函数需要使用new关键字来调用。
 
-1、this只出现在函数中。
+**this的指向也有所不同**：
 
-2、谁调用函数，this就指的是谁。
+- 1.以函数的形式调用时，this永远都是window。比如`fun();`相当于`window.fun();`
 
-3、new People();   People中的this代指被创建的对象实例。
+- 2.以方法的形式调用时，this是调用方法的那个对象
 
+- 3.以构造函数的形式调用时，this是新创建的那个对象
 
-**new之后：**
+### new 一个构造函数的执行流程
 
-（1）开辟内存空间，存储新创建的对象。new Object()
+（1）开辟内存空间，存储新创建的对象
 
-（2）**把this设置为当前对象**
+（2）将新建的对象设置为构造函数中的this，在构造函数中可以使用this来引用 新建的对象
 
-（3）执行内部代码，设置对象属性和方法
+（3）执行函数中的代码（包括设置对象属性和方法等）
 
-（4）返回新创建的对象
+（4）将新建的对象作为返回值返回
 
 因为this指的是new一个Object之后的对象实例。于是，下面这段代码：
 
@@ -145,7 +159,43 @@ console.log(o);
 
 注意上方代码中的注释。
 
-于是，便得出了接下来的代码。
+### 类、实例
+
+使用同一个构造函数创建的对象，我们称为一类对象，也将一个构造函数称为一个**类**。
+
+通过一个构造函数创建的对象，称为该类的**实例**。
+
+
+### instanceof
+
+使用 instanceof 可以检查**一个对象是否为一个类的实例**。
+
+**语法如下**：
+
+```javascript
+对象 instanceof 构造函数
+```
+
+如果是，则返回true；否则返回false。
+
+**代码举例**：
+
+```javascript
+      function Person() {}
+
+      function Dog() {}
+
+      var person1 = new Person();
+
+      var dog1 = new Dog();
+
+      console.log(person1 instanceof Person); // 打印结果： true
+      console.log(dog1 instanceof Person); // 打印结果：false
+
+      console.log(dog1 instanceof Object); // 所有的对象都是Object的后代。因此，打印结果为：true
+```
+
+根据上方代码中的最后一行，需要补充一点：**所有的对象都是Object的后代，因此任何对象和Object左instanceof检查时都会返回true**。
 
 
 ## others
@@ -222,10 +272,6 @@ class Customer {
 ```
 
 
-
-
-
-
 ## new一个构造函数的过程
 
 - 1.开辟对内存空间，创建一个新的对象
@@ -237,7 +283,6 @@ class Customer {
 - 4.返回新创建的对象
 
 
-
 ## 原型对象
 
 ### 原型的引入
@@ -301,7 +346,6 @@ class Customer {
 
 我们所创建的每一个函数，解析器都会向函数中添加一个属性prototype。这个属性对应着一个对象，这个对象就是我们所谓的原型对象。
 
-
 如果函数作为普通函数调用prototype没有任何作用，当函数以构造函数的形式调用时，它所创建的实例对象中都会有一个隐含的属性，指向该构造函数的原型，我们可以通过__proto__来访问该属性。
 
 原型对象就相当于一个公共的区域，所有同一个类的实例都可以访问到这个原型对象，我们可以将对象中共有的内容，统一设置到原型对象中。
@@ -311,7 +355,6 @@ class Customer {
 以后我们创建构造函数时，可以将这些对象共有的属性和方法，统一添加到构造函数的原型对象中，这样就不用分别为每一个对象添加，也不会影响到全局作用域，就可以使每个对象都具有这些属性和方法了。
 
 
-
 ### 原型链
 
 原型对象也是对象，所以它也有原型，当我们使用一个对象的属性或方法时，会现在自身中寻找，自身中如果有，则直接使用。如果没有则去原型对象中寻找。如果原型对象中有，则使用，如果没有则去原型的原型中寻找,直到找到Object对象的原型。Object对象的原型没有原型，如果在Object原型中依然没有找到，则返回undefined。

README.md

@@ -7,12 +7,15 @@
 
 前端入门和进阶学习笔记。从零开始学前端，做一个web全栈工程师。持续更新中...
 
-PS：如果你发现文中的图片加载不出来，不妨[看这里](https://github.com/smyhvae/Web/issues/20#issue-390074432)。  
+维护这个项目的初衷，可以看这篇文章：[裸辞两个月，海投一个月，从Android转战Web前端的求职之路](https://zhuanlan.zhihu.com/p/55981212)
 
-维护这个项目的初衷，可以看这篇文章：[裸辞两个月，海投一个月，从Android转战Web前端的求职之路](https://www.cnblogs.com/smyhvae/p/8732781.html)
+前端入门路线和推荐学习资源，可以看这篇文章：[2019年Web前端入门的自学路线](https://www.cnblogs.com/smyhvae/p/8776837.html)
 
-前端入门路线和推荐学习资源，可以看这篇文章：[2018年Web前端入门的自学路线](https://www.cnblogs.com/smyhvae/p/8776837.html)
+### 项目指引
 
+如果你发现文中的图片加载不出来，不妨[看这里](https://github.com/smyhvae/Web/issues/20#issue-390074432)。
+
+如果你发现本项目有内容上的错误，欢迎提交 issues 进行指正。
 
 ### 学习交流