面向对象

面向对象

对象是什么？

对象是一个实物的抽象

构造函数

创建构造函数

通过function关键字来创建 ```javascript // 为了区分普通函数和构造函数，我们自己创建的构造函数首字母要大写 function Fn1() { // 生成对象 // this 指向未来要生成的那个对象 this.a = 100; // a 属于谁 }

// 构造函数的实例化对象 const obj = new Fn1();


2. 
通过函数表达式
```javascript
const Fn2 = function(){
    this b = 500;
}

关于构造函数需要注意

创建构造函数时不能使用箭头函数

对于this的理解我们可以借鉴对象的方法

const obj ={
 a=100,
 fn(){
 console.log(this.a)}//此时这个this就指向obj
}

在使用构造函数生成对象时，必须使用new命令（下面有详解）

关于new命令

作用和用法

new命令的作用是执行构造函数，返回一个实例对象
实际上new返回了一个空对象。
new命令本身就可以执行构造函数，所以在使用时，构造函数后面的（）可以省略；但是为了增强代码的可读性，加上（）以表明函数执行。
在使用构造对象生成对象时，必须使用new命令
在不使用new命令时，调用构造函数返回的结果可能是undefined
在加上严格模式后，使用构造函数但是不使用new命令，程序会报错

如果在使用构造函数时，不使用new命令，那么就将构造函数作为普通函数使用了。因为没有使用new来返回一个实例对象，那么this的指向就不再是实例对象，而是全局对象。

严格模式：use strict;

new命令执行的原理

创建一个空对象，作为返回的对象实例
这个空对象的原型指向的是构造函数的prototype属性
将这个空对象赋值给构造函数里的this关键字
执行构造函数内的代码

总结：

构造函数中的this语句，其实都是在操作new生成的这个空的对象实例
如果构造函数有返回值，且返回值为一个对象，那么new生成的这个对象实例会被覆盖掉。返回的是return的对象

Object.create()创建实例对象

可以以一个现有对象为模板来创建新的实例对象

对象的继承

原型对象概述

在使用构造函数创建对象时，会频繁地创建对象方法，严重造成内存资源的占用。于是我们想要让构造函数创建的实例对象中共同的属性和方法能够共享，而在JavaScript中，prototype对象可以解决该问题

prototype属性的作用

在原型对象上所有的属性和方法都可以被实例对象共享并使用；
每个函数都有一个prototype属性，指向一个原型对象；
所以，在原型对象上的属性和方法可以被实例对象共享，换句话说也就是，当实例对象上没有某个属性或方法时，会去它的原型对象中找，如果找不到那么继续向原型对象的原型对象去找，最终在对象的原型对象（NULL）找，报错
这种一个对象上面有原型，原型上面还有原型，就形成了原型链
在原型对象上面还包括一个constructor属性，记录的是构造函数

利用原型链机制实现继承

ES5：
子类的构造函数.prototype = Object.create(父类的构造函数.prototype);
子类的构造函数.prototype.constructor = 子类的构造函数
子类的原型链上的方法写在设置构造函数的代码后面
子类的构造函数中要通过call方法改变父类的this指向
父类.call(this, 如果需要传值，就直接在这传就好了) ```javascript // 有一个动物类 function Animal(color,name) {
```
this.color = color; 
this.name = name;
```
} // 为什么要把方法加载原型上？ Animal.prototype.eat = function() {
```
console.log('吃东西');
```
}

// 创建小猫类 继承自动物类
function Cat(pz, color, name) {
  Animal.call(this,color,name); // 改变Animal的this指向，原本的动物类this指向Animal的实例化对象，现在变成了cat的实例化对象
  this.pz = pz;
}
Cat.prototype = Object.create(Animal.prototype);
Cat.prototype.miao = function() {
  console.log('喵....');
}
Cat.prototype.constructor = Cat;
const c1 = new Cat('橘猫', '黄色', '旺财');
// console.log(c1);
console.log(c1.name,c1.color, c1.pz);
c1.eat()
c1.miao()


- 
**ES6**
```javascript
// 写个动物类
        class Animal {
            constructor(color, name) {
                    this.color = color;
                    this.name = name;
                }
                // 都相当于是设置在了实例化对象的原型上
            eat() {
                console.log('吃东西');
            }
        }
        // const a1 = new Animal('黄色', '橘猫');
        // console.log(a1)
        class Cat extends Animal {
            constructor(pz, color, name) {
                // super就表示父类 值
                super(color, name);
                this.pz = pz;
            }
            miao() {
                console.log('喵....');
            }
        }
        const c1 = new Cat('橘猫', '黄色', '旺财');
        console.log(c1)