modify
This commit is contained in:
		
							parent
							
								
									67f1ca5387
								
							
						
					
					
						commit
						207f7b7465
					
				@ -91,7 +91,139 @@
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 方式三:工厂模式
 | 
			
		||||
 | 
			
		||||
- 方式:通过工厂函数动态创建对象并返回。
 | 
			
		||||
 | 
			
		||||
返回一个对象的函数,就是**工厂函数**。
 | 
			
		||||
 | 
			
		||||
- 适用场景: 需要创建多个对象。
 | 
			
		||||
 | 
			
		||||
- 问题: 对象没有一个具体的类型,都是Object类型。
 | 
			
		||||
 | 
			
		||||
由于这个问题的存在,工厂模式用得不多。
 | 
			
		||||
 | 
			
		||||
```html
 | 
			
		||||
<!DOCTYPE html>
 | 
			
		||||
<html lang="en">
 | 
			
		||||
<head>
 | 
			
		||||
    <meta charset="UTF-8">
 | 
			
		||||
    <title>03_工厂模式</title>
 | 
			
		||||
</head>
 | 
			
		||||
<body>
 | 
			
		||||
<!--
 | 
			
		||||
方式三: 工厂模式
 | 
			
		||||
  * 套路: 通过工厂函数动态创建对象并返回
 | 
			
		||||
  * 适用场景: 需要创建多个对象
 | 
			
		||||
  * 问题: 对象没有一个具体的类型, 都是Object类型
 | 
			
		||||
-->
 | 
			
		||||
<script type="text/javascript">
 | 
			
		||||
    function createPerson(name, age) { //返回一个对象的函数===>工厂函数
 | 
			
		||||
        var obj = {
 | 
			
		||||
            name: name,
 | 
			
		||||
            age: age,
 | 
			
		||||
            setName: function (name) {
 | 
			
		||||
                this.name = name
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        return obj
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    // 创建2个人
 | 
			
		||||
    var p1 = createPerson('Tom', 12)
 | 
			
		||||
    var p2 = createPerson('Bob', 13)
 | 
			
		||||
 | 
			
		||||
    // p1/p2是Object类型
 | 
			
		||||
 | 
			
		||||
    function createStudent(name, price) {
 | 
			
		||||
        var obj = {
 | 
			
		||||
            name: name,
 | 
			
		||||
            price: price
 | 
			
		||||
        }
 | 
			
		||||
        return obj
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    var s = createStudent('张三', 12000)
 | 
			
		||||
    // s也是Object
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
</script>
 | 
			
		||||
</body>
 | 
			
		||||
</html>
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 方式四:自定义构造函数
 | 
			
		||||
 | 
			
		||||
```html
 | 
			
		||||
<!DOCTYPE html>
 | 
			
		||||
<html lang="en">
 | 
			
		||||
<head>
 | 
			
		||||
    <meta charset="UTF-8">
 | 
			
		||||
    <title>04_自定义构造函数模式</title>
 | 
			
		||||
</head>
 | 
			
		||||
 | 
			
		||||
<body>
 | 
			
		||||
<!--
 | 
			
		||||
方式四: 自定义构造函数模式
 | 
			
		||||
  * 套路: 自定义构造函数, 通过new创建对象
 | 
			
		||||
  * 适用场景: 需要创建多个类型确定的对象
 | 
			
		||||
  * 问题: 每个对象都有相同的数据, 浪费内存
 | 
			
		||||
-->
 | 
			
		||||
<script type="text/javascript">
 | 
			
		||||
    //定义类型
 | 
			
		||||
    function Person(name, age) {
 | 
			
		||||
        this.name = name
 | 
			
		||||
        this.age = age
 | 
			
		||||
        this.setName = function (name) {
 | 
			
		||||
            this.name = name
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    var p1 = new Person('Tom', 12)
 | 
			
		||||
    p1.setName('Jack')
 | 
			
		||||
    console.log(p1.name, p1.age)
 | 
			
		||||
    console.log(p1 instanceof Person)
 | 
			
		||||
 | 
			
		||||
    function Student(name, price) {
 | 
			
		||||
        this.name = name
 | 
			
		||||
        this.price = price
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    var s = new Student('Bob', 13000)
 | 
			
		||||
    console.log(s instanceof Student)
 | 
			
		||||
 | 
			
		||||
    var p2 = new Person('JACK', 23)
 | 
			
		||||
    console.log(p1, p2)
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
</script>
 | 
			
		||||
</body>
 | 
			
		||||
</html>
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
方式四引入了继承。
 | 
			
		||||
 | 
			
		||||
## 继承的几种方式
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 通过构造函数继承
 | 
			
		||||
 | 
			
		||||
在子类型构造函数中通用call()调用父类型构造函数
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 原型链继承
 | 
			
		||||
 | 
			
		||||
子类型的原型为父类型的一个实例对象
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 组合继承
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 方式三:
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										83
									
								
								10-ES6/02-ES6的常用语法.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										83
									
								
								10-ES6/02-ES6的常用语法.md
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,83 @@
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
## Symbol
 | 
			
		||||
 | 
			
		||||
### 概述
 | 
			
		||||
 | 
			
		||||
背景:ES5中对象的属性名都是字符串,容易造成重名,污染环境。
 | 
			
		||||
 | 
			
		||||
**概念**:ES6 引入了一种新的原始数据类型Symbol,表示独一无二的值。它是 JavaScript 语言的第七种数据类型,前六种是:undefined、null、布尔值(Boolean)、字符串(String)、数值(Number)、对象(Object)。
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
**特点:**
 | 
			
		||||
 | 
			
		||||
- Symbol属性对应的值是唯一的,解决**命名冲突问题**
 | 
			
		||||
 | 
			
		||||
- Symbol值不能与其他数据进行计算,包括同字符串拼串
 | 
			
		||||
 | 
			
		||||
- for in、for of 遍历时不会遍历Symbol属性。
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 创建Symbol属性值
 | 
			
		||||
 | 
			
		||||
Symbol是函数,但并不是构造函数。创建一个Symbol数据类型:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    let mySymbol = Symbol();
 | 
			
		||||
 | 
			
		||||
    console.log(typeof mySymbol);  //打印结果:symbol
 | 
			
		||||
    console.log(mySymbol);         //打印结果:Symbol()
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
打印结果:
 | 
			
		||||
 | 
			
		||||
20180317_1134.png
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
如果我通过 Symbol()函数创建了两个值,这两个值是不一样的:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    let mySymbol = Symbol();
 | 
			
		||||
    let mySymbol2 = Symbol();
 | 
			
		||||
 | 
			
		||||
    console.log(mySymbol == mySymbol2); //打印结果:false
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
上面代码的打印结果研究音声了,
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
下面来讲一下Symbol的使用。
 | 
			
		||||
 | 
			
		||||
### 1、将Symbol作为对象的属性值
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    let mySymbol = Symbol();
 | 
			
		||||
 | 
			
		||||
    let obj = {
 | 
			
		||||
        name: 'smyhvae',
 | 
			
		||||
        age: 26
 | 
			
		||||
    };
 | 
			
		||||
 | 
			
		||||
    //obj.mySymbol = 'male'; //错误:不能用 . 这个符号给对象添加 Symbol 属性。
 | 
			
		||||
    obj[mySymbol] = 'hello';    //正确:通过**属性选择器**给对象添加 Symbol 属性。后面的属性值随便写。
 | 
			
		||||
 | 
			
		||||
    console.log(obj);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
上面的代码中,我们尝试给obj添加一个Symbol类型的属性值,但是添加的时候,不能采用`.`这个符号,而是应该用`属性选择器`的方式。打印结果:
 | 
			
		||||
 | 
			
		||||
20180317_1145.png
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user