update: 对象

04-JavaScript基础/04-基本数据类型vs引用数据类型.md

@@ -2,15 +2,13 @@
 
 ## 前言
 
-
+在上一篇文章中，我们介绍过，变量有以下数据类型：
-在之前的**javascript基础**文章中，我们介绍过，变量有以下数据类型：
 
 - **基本数据类型（值类型）**：String 字符串、Number 数值、Boolean 布尔值、Null 空值、Undefined 未定义。
 
 - **引用数据类型（引用类型）**：Object 对象。
 
-本文，我们针对这两种类型，做个详细介绍。我们先来看个例子。
+本文，我们针对这两种类型，做进一步介绍。我们先来看个例子。
-
 
 **基本数据类型举例**：
 
@@ -50,7 +48,7 @@
 
 从上面的例子中，可以反映出，基本数据类型和引用数据类型是有区别的。
 
-
+那到底有什么区别呢？我们进一步往下看。
 
 ## 栈内存和堆内存
 

04-JavaScript基础/09-对象简介和对象的基本操作.md

@@ -1,19 +1,92 @@
 
+## 对象简介
 
-## 面向对象简介
+### 面向对象简介
-
-**对象的作用是：封装信息**。比如Student类里可以封装学生的姓名、年龄、成绩等。
-
-对象具有**特征**（属性）和**行为**（方法）。
 
 面向对象：可以创建自定义的类型，很好的支持继承和多态。
 
 面向对象的特征：封装、继承、多态。
 
+### 对象的概念
 
-## 对象简介
+在 JavaScript 中，对象是一组**无序**的相关属性和方法的集合。
 
-### 基本数据类型和引用数据类型的对比
+**对象的作用是：封装信息**。比如Student类里可以封装学生的姓名、年龄、成绩等。
+
+对象具有**特征**（属性）和**行为**（方法）。
+
+### 为什么需要对象
+
+保存一个值时，可以使用**变量**，保存多个值（一组值）时，可以使用**数组**。
+
+比如，如果要保存一个人的信息，通过数组的方式可以这样保存：
+
+```javascript
+var arr = ['王二', 35, '男', '180'];
+```
+
+上面这种表达方式比较乱。而如果用JS中的**对象**来表达，**结构会更清晰**。如下：
+
+```javascript
+var person = {};
+
+person.name = '王二';
+person.age = 35;
+person.sex = '男';
+person.height = '180';
+```
+
+由此可见，对象里面的属性均是**键值对**：
+
+- 键：相当于属性名。
+
+- 值：相当于属性值，可以是任意类型的值（数字类型、字符串类型、布尔类型，函数类型等）。
+
+### 两条补充
+
+**补充1**：对象的属性值可以是任何的数据类型，也可以是个**函数**：（也称之为方法）
+
+```javascript
+    var obj = new Object();
+    obj.sayName = function () {
+        console.log('smyhvae');
+    };
+
+    console.log(obj.sayName);  //没加括号，就是获取方法
+    console.log('-----------');
+    console.log(obj.sayName());  //加了括号，就是调用方法。即：执行函数内容，并执行函数体的内容
+
+```
+
+打印结果：
+
+![](http://img.smyhvae.com/20180314_2109.png)
+
+**补充2**：对象中的属性值，也可以是一个**对象**。
+
+举例：
+
+```javascript
+    //创建对象 obj1
+    var obj1 = new Object();
+    obj1.test = undefined;
+
+    //创建对象 obj2
+    var obj2 = new Object();
+    obj2.name = "smyhvae";
+
+    //将整个 obj2 对象，设置为 obj1 的属性
+    obj1.test = obj2;
+
+    console.log(obj1.test.name);
+```
+
+打印结果为：smyhvae
+
+
+## 对象和数据类型之间的关系
+
+数据类型分类：
 
 - **基本数据类型（值类型）**：String 字符串、Number 数值、Boolean 布尔值、Null 空值、Undefined 未定义。
 
@@ -69,6 +142,7 @@
 
 - 由开发人员自己创建的对象
 
+
 ## 对象的基本操作
 
 ### 创建对象
@@ -81,7 +155,7 @@
 	var obj = new Object();
 ```
 
-另外，使用`typeof`检查一个对象时，会返回`object`。
+记住，使用`typeof`检查一个对象时，会返回`object`。
 
 ### 向对象中添加属性
 
@@ -121,45 +195,6 @@
 	}
 ```
 
-**补充1**：对象的属性值可以是任何的数据类型，也可以是个**函数**：（也称之为方法）
-
-```javascript
-    var obj = new Object();
-    obj.sayName = function () {
-        console.log('smyhvae');
-    };
-
-    console.log(obj.sayName);  //没加括号，获取的是对象
-    console.log('-----------');
-    console.log(obj.sayName());  //加了括号，执行函数内容，并执行函数体的内容
-
-```
-
-打印结果：
-
-![](http://img.smyhvae.com/20180314_2109.png)
-
-**补充2**：js中的属性值，也可以是一个**对象**。
-
-举例：
-
-```javascript
-    //创建对象 obj1
-    var obj1 = new Object();
-    obj1.test = undefined;
-
-    //创建对象 obj2
-    var obj2 = new Object();
-    obj2.name = "smyhvae";
-
-    //将整个 obj2 对象，设置为 obj1 的属性
-    obj1.test = obj2;
-
-    console.log(obj1.test.name);
-```
-
-打印结果为：smyhvae
-
 ### 获取对象中的属性
 
 **方式1**：
@@ -194,26 +229,26 @@
 
 **方式2**：可以使用`[]`这种形式去操作属性
 
-对象的属性名不强制要求遵守标识符的规范，但是我们使用是还是尽量按照标识符的规范去做。
+对象的属性名不强制要求遵守标识符的规范，不过我们尽量要按照标识符的规范去做。
 
-但如果要使用特殊的属性名，就不能采用`.`的方式来操作对象的属性。比如说，`123`这种属性名，如果我们直接写成`obj.123 = 789`，是会报错的。那怎么办呢？办法如下：
+但如果确实要使用特殊的属性名，就不能采用`.`的方式来操作对象的属性。比如说，`123`这种属性名，如果我们直接写成`obj.123 = 789`来操作属性，是会报错的。那怎么办呢？办法如下：
 
 语法格式如下：（读取时，也是采用这种方式）
 
-```
+```javascript
-对象["属性名"] = 属性值
+// 注意，括号里的属性名，必须要加引号
+对象['属性名'] = 属性值
 
 ```
 
-
 上面这种语法格式，举例如下：
 
 ```javascript
- obj["123"] = 789;
+ obj['123'] = 789;
 ```
 
 
-**重要**：使用`[]`这种形式去操作属性，更加的灵活，因为，我们可以在`[]`中直接传递一个**变量**，这样变量值是多少就会读取那个属性。
+**重要**：使用`[]`这种形式去操作属性，更加的灵活，因为，我们可以在`[]`中直接传递一个**变量**。
 
 
 ### 修改对象的属性值
@@ -302,21 +337,28 @@
 
 属性名和属性值是一组一组的键值对结构，键和值之间使用`:`连接，多个值对之间使用`,`隔开。如果一个属性之后没有其他的属性了，就不要写`,`，因为它是对象的最后一个属性。
 
-
+## 遍历对象中的属性：for ... in
-## 遍历对象中的属性：for in
 
 语法：
 
 ```javascript
-	for (var 变量 in 对象) {
+for (var 变量 in 对象名) {
 
-	}
+}
 ```
 
 解释：对象中有几个属性，循环体就会执行几次。每次执行时，会将对象中的**每个属性的 属性名 赋值给变量**。
 
-举例：
+语法举例：
 
+```javascript
+for (var key in obj) {
+	console.log(key); // 这里的 key 是：对象属性的键
+	console.log(obj[key]); // 这里的 obj[key] 是：对象属性的值
+}
+```
+
+举例：
 
 ```html
 <!DOCTYPE html>
@@ -330,13 +372,16 @@
 			name: "smyhvae",
 			age: 26,
 			gender: "男",
-			address: "shenzhen"
+			address: "shenzhen",
+            sayHi: function() {
+                console.log(this.name);
+            }
 		};
 
-		//枚举对象中的属性
+		// 遍历对象中的属性
-		for (var n in obj) {
+		for (var key in obj) {
-			console.log("属性名:" + n);
+			console.log("属性名:" + key);
-			console.log("属性值:" + obj[n]); // 注意，因为这里的属性名 n 是变量，所以，如果想获取属性值，不能写成 obj.n，而是要写成 obj[n]
+			console.log("属性值:" + obj[key]); // 注意，因为这里的属性名 keu 是变量，所以，如果想获取属性值，不能写成 obj.key，而是要写成 obj[key]
 		}
 	</script>
 </head>
@@ -350,8 +395,24 @@
 
 打印结果：
 
-![](http://img.smyhvae.com/20180314_2125.png)
+```
+属性名:name
+属性值:smyhvae
 
+属性名:age
+属性值:26
+
+属性名:gender
+属性值:男
+
+属性名:address
+属性值:shenzhen
+
+属性名:sayHi
+属性值:function() {
+                    console.log(this.name);
+                }
+```
 
 ## 我的公众号
 

04-JavaScript基础/21-对象的创建&构造函数.md

@@ -1,18 +1,22 @@
 
 
- > 在看本文之前，可以先复习前面的一篇文章：《03-JavaScript基础/07-对象简介和对象的基本操作.md》
+ > 在看本文之前，可以先复习前面的一篇文章：《04-JavaScript基础/09-对象简介和对象的基本操作.md》
 
 ## 创建自定义对象的几种方法
 
 ### 方式一：对象字面量
 
-**对象的字面量**就是一个{}。里面的属性和方法均是**键值对**。
+**对象的字面量**就是一个{}。里面的属性和方法均是**键值对**：
+
+- 键：相当于属性名。
+
+- 值：相当于属性值，可以是任意类型的值（数字类型、字符串类型、布尔类型，函数类型等）。
 
 例如：
 
 ```javascript
 var o = {
-            name: "生命壹号",
+            name: "千古壹号",
             age: 26,
             isBoy: true,
             sayHi: function() {
@@ -32,29 +36,42 @@ console.log(o);
 通过该方法可以大批量的创建对象。
 
 ```javascript
-        /*
+    /*
-         * 使用工厂方法创建对象
+        * 使用工厂方法创建对象
-         *  通过该方法可以大批量的创建对象
+        *  通过该方法可以大批量的创建对象
-         */
+        */
-        function createPerson(name, age, gender) {
+    function createPerson(name, age, gender) {
-            //创建一个新的对象
+        //创建一个新的对象
-            var obj = new Object();
+        var obj = new Object();
-            //向对象中添加属性
+        //向对象中添加属性
-            obj.name = name;
+        obj.name = name;
-            obj.age = age;
+        obj.age = age;
-            obj.gender = gender;
+        obj.gender = gender;
-            obj.sayName = function() {
+        obj.sayName = function() {
-                alert(this.name);
+            alert(this.name);
-            };
+        };
-            //将新的对象返回
+        //将新的对象返回
-            return obj;
+        return obj;
-        }
+    }
 
-        var obj2 = createPerson("猪八戒", 28, "男");
+    var obj2 = createPerson("猪八戒", 28, "男");
-        var obj3 = createPerson("白骨精", 16, "女");
+    var obj3 = createPerson("白骨精", 16, "女");
-        var obj4 = createPerson("蜘蛛精", 18, "女");
+    var obj4 = createPerson("蜘蛛精", 18, "女");
 ```
 
+第一次看到这种工厂模式时，你可能会觉得陌生。如果简化一下，可以写成下面这种形式，更容易理解：（也就是，利用new Object创建对象）
+
+```javascript
+var obj = new Obect();
+obj.name = '猪八戒';
+obj.age = 28;
+obj.gender = '男';
+obj.sayHi = function() {
+    alert('hello world');
+};
+```
+
+
 **弊端：**
 
 使用工厂方法创建的对象，使用的构造函数都是Object。**所以创建的对象都是Object这个类型，就导致我们无法区分出多种不同类型的对象**。
@@ -74,7 +91,7 @@ console.log(o);
 
         // 创建一个构造函数
         function Student(name) {
-            this.name = name;    //this指的是构造函数中的对象实例
+            this.name = name;    //this指的是当前对象实例【重要】
             this.sayHi = function () {
                 console.log(this.name + "厉害了");
             }
@@ -103,20 +120,25 @@ console.log(o);
         };
       }
 
-      // 创建一个构造函数，专门用来创建 Dog 对象
-      function Dog() {}
-
       var per = new Person("孙悟空", 18, "男");
       var per2 = new Person("玉兔精", 16, "女");
       var per3 = new Person("奔波霸", 38, "男");
 
+      // 创建一个构造函数，专门用来创建 Dog 对象
+      function Dog() {}
+
       var dog = new Dog();
 ```
 
+### 构造函数的概念
+
+**构造函数**：是一种特殊的函数，主要用来创建和初始化对象，也就是为对象的成员变量赋初始值。它与 `new` 一起使用才有意义。
+
+我们可以把对象中一些公共的属性和方法抽取出来，然后封装到这个构造函数里面。
 
 ### 构造函数和普通函数的区别
 
-构造函数就是一个普通的函数，创建方式和普通函数没有区别，不同的是构造函数习惯上首字母大写。
+构造函数的创建方式和普通函数没有区别，不同的是构造函数习惯上首字母大写。
 
 构造函数和普通函数的区别就是**调用方式**的不同：普通函数是直接调用，而构造函数需要使用new关键字来调用。
 
@@ -130,13 +152,15 @@ console.log(o);
 
 ### new 一个构造函数的执行流程
 
-（1）开辟内存空间，存储新创建的对象
+new 在执行时，会做下面这四件事：
 
-（2）将新建的对象设置为构造函数中的this，在构造函数中可以使用this来引用 新建的对象
+（1）开辟内存空间，在内存中创建一个新的空对象。
 
-（3）执行函数中的代码（包括设置对象属性和方法等）
+（2）让 this 指向这个新的对象。
 
-（4）将新建的对象作为返回值返回
+（3）执行构造函数里面的代码，给这个新对象添加属性和方法。
+
+（4）返回这个新对象（所以构造函数里面不需要return）。
 
 因为this指的是new一个Object之后的对象实例。于是，下面这段代码：
 
@@ -229,7 +253,6 @@ json举例：
 
 json 采用 `for...in...`进行遍历，和数组的遍历方式不同。如下：
 
-
 ```html
 <script>
     var myJson = {
@@ -251,12 +274,10 @@ json 采用 `for...in...`进行遍历，和数组的遍历方式不同。如下
 
 ![](http://img.smyhvae.com/20180203_1518.png)
 
-
 ## 我的公众号
 
-想学习<font color=#0000ff>**代码之外的技能**</font>？不妨关注我的微信公众号：**千古壹号**（id：`qianguyihao`）。
+想学习<font color=#0000ff>**代码之外的技能**</font>？不妨关注我的微信公众号：**千古壹号**。
 
 扫一扫，你将发现另一个全新的世界，而这将是一场美丽的意外：
 
 ![](http://img.smyhvae.com/2016040102.jpg)
-

18-推荐链接/04-前端文章推荐.md

@@ -0,0 +1 @@
+04-前端文章推荐.md