# 20191120

![js](https://img.shields.io/badge/language-js-orange.svg)

js 高级

怎样用面向对象的思想去编程 ---- 抽象

抽象

特指具体的某一个事物 ----- 对象

特征 ------- 属性

行为 ------- 方法

创建对象 方式 
  * 字面量创建对象
    ```js
    var obj = {
      name: 'yingbo',
      age: 18,
      sex: '女',
      eat: () => {
        console.log('真好吃')
      },
      run: () => {
        console.log('跑的真快')
      }
    }
    ```
  * 调用系统构造函数创建对象
    ```js
    var obj1 = new Object()
    object1.name = 'lisi'
    object1.age = 20
    object1.sex = '男'
    object1.eat = () => {
      console.log('好吃')
    }
    object.run = () => {
      console.log('能跑个鬼')
    }
    ```
  * 自定义构造函数创建对象
    ```js
    function Person(name, age, sex) {
      this.name = name
      this.age = age
      this.sex = sex
      this.eat = () => {
        console.log('是非常好吃')
      }
      this.run = () => {
        console.log('是非常能跑的怪物')
      }
    }
    var per = new Person('yingbo', 20, 'male')

    // 判断对象输入什么类型 instanceof 
    console.log(per instanceof Person) // boolean -> true
    console.log(per instanceof Object) // boolean -> true always
    ```
  * 姓名 年龄 性别 吃 ……
  
创建一个新的系统构造函数
```js
function Person(name, age, sex) {
  this.name = name
  this.age = age
  this.sex = sex
  this.sayHi = () =>{
    console.log('你好')
  }
}
```

实例化  ----- 通过自定义构造函数创建对象 ---> 实例对象
`var per = new Person('yingbo', 20, 'male')`
1. 开辟内存空间
2. 改变 this 的指向为当前对象
3. 设置对象的属性和方法值
4. 返回 this 指向的对象

自定义构造函数的缺点

内存消耗严重 数据不共享
```js
var per = new Person()
var per1 = new Person()
per.sayHi()
per1.sayHi()
console.log(per.sayHi == per1.sayHi)  // -> false
```
```js
sayHi() => {
  console.log('你好')
}

// sayHi = 'yingbo'  -> 和上边的冲突 导致公共命名空间（全局变量）污染 下边定义的时候用的这个会报 not a function 的错误 但是可以解决不共享的问题 慎用

function Person(name, age, sex) {
  this.name = name
  this.age = age
  this.sex = sex
  this.sayHi = sayHi
}

var per = new Person()
var per1 = new Person()
per.sayHi()
per1.sayHi()
console.log(per.sayHi == per1.sayHi)  // -> true
```

工厂模式创建对象
```js
function createObj(name, age) {
  var obj = new Object()
  obj.name = name
  obj.age = age
  obj.sayHi = () =>{
    console.log('你好哇')
  }
  return obj
}
var obj1 = createObj()
obj1.sayHi()
```

工厂模式和自定义构造函数的区别 （面试的时候回答 相同 -> 不同）
* 共同点
  * 都能创建对象
  * 都是函数
  * 都能传参数
* 不同点
  * 函数名称大小写
  * 有无返回值
  * this -> 当前对象 (自定义)  -> obj对象 (工厂)
  * 是否需要new去实例化
  * 函数内是否有new

* 实例对象和构造函数的关系
  * 实例对象是通过构造函数创建的 ---- 实例化一个对象/new一个对象
  * `console.dir()`  显示对象结构
  * 实例对象的构造器(构造函数)
  * `console.log(per.constructor == Person) // true` 实例对象的构造器是指向的是创建他的构造函数
  * `console.log(per.constructor == Person.constructor) // false`
  * `console.log(per.__proto__.constructor == Person.constructor) // false`
  * `console.log(per.__proto__.constructor == Person.prototype.constructor) // true`
  * `console.log(per.constructor == Person.prototype.constructor) // true`
  * `Person.constructor` 指向的自己Person

* 总结
  * 判断一个对象属于什么类型 实例对象 instanceof 构造函数
  * 可以通过构造器去判断