add: Object.freeze()

2020-05-30 23:24:59 +08:00
parent cc41ddb71a
commit ada7d784c0
7 changed files with 204 additions and 104 deletions
--- a/04-JavaScript基础/02-变量.md
+++ b/04-JavaScript基础/02-变量.md
@@ -55,15 +55,29 @@ if (true) {

 ## 变量的声明和赋值

-### 变量的声明（变量的定义）
+### 变量的声明/变量的定义

 在ES6语法之前，统一使用`var`关键字来声明一个变量。比如：

 ```javascript
-var name; // 生命一个名为 name 的变量
+var name; // 声明一个名为 name 的变量
 ```

-补充：在ES6语法及之后，统一使用 `const`、`let`关键字来声明一个变量。这个以后再讲。
+
+PS：**在JavaScript中，永远都是用var来定义变量**（在ES6 之前），这和C、Java等语言不同。
+
+
+### 变量的声明/定义（ES6）
+
+在ES6语法及之后，可以使用 `const`、`let`关键字来声明一个变量
+
+```js
+const name; // 定义一个常量
+
+let age;
+```
+
+如果你想定义一个常量，就用 const；如果你想定义一个变量，就用 let。

 ### 变量的赋值

@@ -73,7 +87,7 @@ var name; // 生命一个名为 name 的变量
 name= '千古壹号'
 ```

-变量的声明和赋值，举例如下：
+变量的声明和赋值，写在一起，举例如下：

 ```javascript
 var a = 100; // ES5语法
@@ -94,7 +108,6 @@ var是英语“variant”变量的缩写。后面要加一个空格，空格后

 - 变量名：我们可以给变量任意的取名字。

-PS：**在JavaScript中，永远都是用var来定义变量**（在ES6 之前），这和C、Java等语言不同。

 ### 变量的初始化

@@ -212,7 +225,7 @@ console.log(a); // 会报错

 ### 关键字

-**关键字**：是指 JS 本身已经使用了的单词，不能再用它们充当变量、函数名等标识符。
+**关键字**：是指 JS 本身已经使用了的单词，我们不能再用它们充当变量、函数名等标识符。

 JS 中的关键字如下：

@@ -269,6 +282,8 @@ a2 = temp;
 ```


+
+
 ## 我的公众号

 想学习**代码之外的技能**？不妨关注我的微信公众号：**千古壹号**（id：`qianguyihao`）。
--- a/04-JavaScript基础/09-对象简介.md
+++ b/04-JavaScript基础/09-对象简介.md
@@ -110,33 +110,52 @@ person.height = '180';

 **如果两个变量保存的是同一个对象引用，当一个通过一个变量修改属性时，另一个也会受到影响**。

-上面这句话很重要，我们来看个例子。
+上面这句话很重要，我们来看看下面的例子。

-### 一个经典的例子
+## 传值和传址的区别

-```javascript
-	var obj = new Object();
-	obj.name = "孙悟空";

-	var obj2 = obj;
+### 传值

-	//修改obj2的name属性
-	obj2.name = "猪八戒";
+代码举例：
+
+```js
+let a = 1;
+
+let b = a;// 将 b 赋值给 a
+
+b = 2; // 修改 b 的值
 ```

-上面的代码中，当我修改 obj2 的name属性后，会发现，obj 的 name 属性也会被修改。因为obj和obj2指向的是堆内存中的同一个地址。
+上方代码中，当我修改 b 的值之后，a 的值并不会发生改变。这个大家都知道。我们继续往下看。
+
+### 传址（一个经典的例子）
+
+代码举例：
+
+```javascript
+var obj1 = new Object();
+obj1.name = "孙悟空";
+
+var obj2 = obj1; // 将 obj1 的地址赋值给 obj2。从此， obj1 和 obj2 指向了同一个堆内存空间
+
+//修改obj2的name属性
+obj2.name = "猪八戒";
+```
+
+上面的代码中，当我修改 obj2 的name属性后，会发现，obj1 的 name 属性也会被修改。因为obj1和obj2指向的是堆内存中的同一个地址。

 这个例子要尤其注意，实战开发中，很容易忽略。

-对于引用类型的数据，赋值相当于地址拷贝，a、b占用了同一段地址。所以改了b，a也会变；本质上a、b就是一个东西。
+对于引用类型的数据，赋值相当于地址拷贝，a、b指向了同一个堆内存地址。所以改了b，a也会变；本质上a、b就是一个东西。

 如果你打算把引用类型 A 的值赋值给 B，让A和B相互不受影响的话，可以通过 Object.assign() 来复制对象。效果如下：

 ```js
-var obj = {name: '孙悟空'};
+var obj1 = {name: '孙悟空'};

-// 复制对象：把 obj 赋值给 obj3。两者之间互不影响
-var obj3 = Object.assign({}, obj);
+// 复制对象：把 obj1 赋值给 obj3。两者之间互不影响
+var obj3 = Object.assign({}, obj1);
 ```

 ## 对象的分类
--- a/04-JavaScript基础/23-对象的基本操作.md
+++ b/04-JavaScript基础/23-对象的基本操作.md
@@ -1,14 +1,13 @@
-
 ## 对象的基本操作

 ### 创建对象

-使用new关键字调用的函数，是构造函数constructor。**构造函数是专门用来创建对象的函数**。
+使用 new 关键字调用的函数，是构造函数 constructor。**构造函数是专门用来创建对象的函数**。

 例如：

 ```javascript
-	var obj = new Object();
+var obj = new Object();
 ```

 记住，使用`typeof`检查一个对象时，会返回`object`。
@@ -22,27 +21,26 @@
 向对象添加属性的语法：

 ```javascript
-	对象.属性名 = 属性值;
+对象.属性名 = 属性值;
 ```

 举例：

 ```javascript
-    var obj = new Object();
+var obj = new Object();

-    //向obj中添加一个name属性
-    obj.name = "孙悟空";
+//向obj中添加一个name属性
+obj.name = '孙悟空';

-    //向obj中添加一个gender属性
-    obj.gender = "男";
+//向obj中添加一个gender属性
+obj.gender = '男';

-    //向obj中添加一个age属性
-    obj.age = 18;
+//向obj中添加一个age属性
+obj.age = 18;

-    console.log(JSON.stringify(obj)); // 将 obj 以字符串的形式打印出来
+console.log(JSON.stringify(obj)); // 将 obj 以字符串的形式打印出来
 ```

-
 打印结果：

 ```
@@ -55,12 +53,12 @@

 ### 获取对象中的属性

-**方式1**：
+**方式 1**：

 语法：

 ```javascript
-	对象.属性名
+对象.属性名;
 ```

 如果获取对象中没有的属性，不会报错而是返回`undefined`。
@@ -68,24 +66,23 @@
 举例：

 ```javascript
-    var obj = new Object();
+var obj = new Object();

-    //向obj中添加一个name属性
-    obj.name = "孙悟空";
+//向obj中添加一个name属性
+obj.name = '孙悟空';

-    //向obj中添加一个gender属性
-    obj.gender = "男";
+//向obj中添加一个gender属性
+obj.gender = '男';

-    //向obj中添加一个age属性
-    obj.age = 18;
+//向obj中添加一个age属性
+obj.age = 18;

-    // 获取对象中的属性，并打印出来
-    console.log(obj.gender); // 打印结果：男
-    console.log(obj.color);  // 打印结果：undefined
+// 获取对象中的属性，并打印出来
+console.log(obj.gender); // 打印结果：男
+console.log(obj.color); // 打印结果：undefined
 ```

-
-**方式2**：可以使用`[]`这种形式去操作属性
+**方式 2**：可以使用`[]`这种形式去操作属性

 对象的属性名不强制要求遵守标识符的规范，不过我们尽量要按照标识符的规范去做。

@@ -95,62 +92,63 @@

 ```javascript
 // 注意，括号里的属性名，必须要加引号
-对象['属性名'] = 属性值
-
+对象['属性名'] = 属性值;
 ```

 上面这种语法格式，举例如下：

 ```javascript
- obj['123'] = 789;
+obj['123'] = 789;
 ```

-
 **重要**：使用`[]`这种形式去操作属性，更加的灵活，因为，我们可以在`[]`中直接传递一个**变量**。

-
 ### 修改对象的属性值

 语法：

 ```javascript
-	对象.属性名 = 新值
+对象.属性名 = 新值;
 ```

-
 ```javascript
-	obj.name = "tom";
+obj.name = 'tom';
 ```

-
 ### 删除对象的属性

 语法：

 ```javascript
-	delete obj.name;
+delete obj.name;
 ```

-
 ### in 运算符

-通过该运算符可以检查一个对象中是否含有指定的属性。如果有则返回true，没有则返回false。
+通过该运算符可以检查一个对象中是否含有指定的属性。如果有则返回 true，没有则返回 false。

 语法：

 ```javascript
-	"属性名" in 对象
+'属性名' in 对象;
 ```

 举例：

 ```javascript
-	//检查obj中是否含有name属性
-	console.log("name" in obj);
+//检查对象 obj 中是否含有name属性
+console.log('name' in obj);
 ```

+我们平时使用的对象不一定是自己创建的，可能是从接口获取的，这个时候，in 运算符可以派上用场。

-我们平时使用的对象不一定是自己创建的，可能是别人提供的，这个时候，in 运算符可以派上用场。
+当然，还有一种写法可以达到上述目的：
+
+```js
+if (obj.name) {
+    // 如果对象 obj 中有name属性，我就继续做某某事情。
+}
+```

 ## 遍历对象：for in

@@ -168,8 +166,8 @@ for (var 变量 in 对象名) {

 ```javascript
 for (var key in obj) {
-	console.log(key); // 这里的 key 是：对象属性的键（也就是属性名）
-	console.log(obj[key]); // 这里的 obj[key] 是：对象属性的值（也就是属性值）
+    console.log(key); // 这里的 key 是：对象属性的键（也就是属性名）
+    console.log(obj[key]); // 这里的 obj[key] 是：对象属性的值（也就是属性值）
 }
 ```

@@ -178,34 +176,30 @@ for (var key in obj) {
 ```html
 <!DOCTYPE html>
 <html>
+    <head>
+        <meta charset="UTF-8" />
+        <title></title>
+        <script type="text/javascript">
+            var obj = {
+                name: 'smyhvae',
+                age: 26,
+                gender: '男',
+                address: 'shenzhen',
+                sayHi: function () {
+                    console.log(this.name);
+                },
+            };

-<head>
-	<meta charset="UTF-8">
-	<title></title>
-	<script type="text/javascript">
-		var obj = {
-			name: "smyhvae",
-			age: 26,
-			gender: "男",
-			address: "shenzhen",
-            sayHi: function() {
-                console.log(this.name);
+            // 遍历对象中的属性
+            for (var key in obj) {
+                console.log('属性名:' + key);
+                console.log('属性值:' + obj[key]); // 注意，因为这里的属性名 keu 是变量，所以，如果想获取属性值，不能写成 obj.key，而是要写成 obj[key]
            }
-		};
-
-		// 遍历对象中的属性
-		for (var key in obj) {
-			console.log("属性名:" + key);
-			console.log("属性值:" + obj[key]); // 注意，因为这里的属性名 keu 是变量，所以，如果想获取属性值，不能写成 obj.key，而是要写成 obj[key]
-		}
-	</script>
-</head>
-
-<body>
-</body>
+        </script>
+    </head>

+    <body></body>
 </html>
-
 ```

 打印结果：
@@ -228,3 +222,4 @@ for (var key in obj) {
                    console.log(this.name);
                }
 ```
+
--- a/04-JavaScript基础/24-对象的高级操作：Object.assign().md
+++ b/04-JavaScript基础/24-对象的高级操作：Object.assign().md
@@ -0,0 +1,34 @@
+
+## Object.assgin()
+
+### 把 对象 obj1 复制给 obj2（两者之间互不影响）
+
+代码举例：
+
+```js
+// 复制对象：把 obj1 赋值给 obj1。两者之间互不影响
+var obj2 = Object.assign({}, obj1);
+```
+
+## Object.freeze() 冻结对象
+
+Object.freeze() 方法可以冻结一个对象。一个被冻结的对象再也不能被修改；冻结了一个对象则不能向这个对象添加新的属性，不能删除已有属性，不能修改该对象已有属性的可枚举性、可配置性、可写性，以及不能修改已有属性的值。此外，冻结一个对象后该对象的原型也不能被修改。freeze() 返回和传入的参数相同的对象。
+
+代码举例：
+
+```js
+const params = {
+    name: 'qianguyihao';
+    port: '8899';
+}
+
+Object.freeze(params); // 冻结对象 params
+
+params.port = '8080';// 修改无效
+
+```
+
+上方代码中，把 params 对象冻结后，如果想再改变 params 里面的属性值，是无效的。
+
+
+