JS中的构造函数和原型链

一、构造函数

1、什么是构造函数？构造函数和工厂函数是一样的，都是专门用来创建对象的

构造函数本质上来说是工厂函数的简写

2、构造函数和工厂函数的区别？

构造函数的函数名称必须首字母大写

构造函数只能通过new关键字来调用

注意点：如果直接去调用函数，那么其实就是把构造函数当成普通函数调用了

//构造函数
function Person(name, age){
    this.name = name;
    this.age = age;
    this.say = function(){
    console.log("hello");
	}
}
//实例化
var p1 = new Person("小明", 18);
var p2 = new Person("熊大", 20);
console.log(p1, p2);

3、使用构造函数系统自动帮我们做了什么？

当我们new Person(“小明”, 18)，系统帮我们做了什么事？

​ 会在构造函数中自动创建一个对象
​ 将自动创建的对象赋值给this
​ 会在构造函数的最后自动添加return this

function Person(name, age){
    //var obj = new Object(); 系统自动添加
    //this = obj;  系统自动添加
    this.name = name;
    this.age = age;
    this.say = function(){
        console.log("hello");
    }
    //return this; 系统自动添加
}
var p1 = new Person("小明", 18);
var p2 = new Person("熊大", 20);
console.log(p1, p2);

构造函数优化

内存优化 — new出的对象都是使用的构造函数中的方法，但是存储不一样，所以会有性能问题

prototype属性 是函数默认规定。存储在prototype中的方法和属性可以被对应的构造函数创建出来的所有对象共享

查找规则：先查找自己构造函数中，再去找prototype中的

二、prototype属性

• 同一个方法给不同的实例化对象调用，存储空间是不一样的，需要做优化。使用了全局函数，但是会造成变量命名污染问题

• 为了解决上述的问题 JavaScript 规定，每一个构造函数都有一个 prototype 属性，指向另一个对象(原型对象）。

• 这个对象的所有属性和方法，都会被构造函数的所拥有（可以实现共享）

• 也就意味着，我们可以把所有对象实例需要共享的属性和方法直接定义在 prototype 对象上

function Person(name, age){
    this.name = name;
    this.age = age;
    // this.say = function(){
    // 	console.log("hello");
    // }
}
//通过原型添加 最专业写法
Person.prototype = {
    say : function(){
        console.log("hello");
    }
}
var p1 = new Person("小明", 18);
var p2 = new Person("小刚", 20);
console.log(p1.say === p2.say); //true

三、原型对象和构造函数和实例对象的关系

• 每个构造函数中都有一个默认的属性，叫做prototype。prototype属性保存(指向)着一个对象，这个对象我们称之为“原型对象”
• 每个"原型对象"中都有一个默认的属性，叫做constructor。这个constructor指向当前原型对象对应的构造函数
• 通过构造函数创建出来的对象我们称之为“实例对象”。每个实例对象都有一个默认的属性，叫做_proto_
• __proto__指向创建它的那个构造函数的原型对象

四、函数和对象

• JavaScript中的函数是引用类型（对象类型），既然是对象，所以也是通过构造函数创建出来的， “所有函数”都是通过Function构造函数创建出来的对象

• JavaScript中只要是"函数"，就有prototype属性。Function函数的prototype属性指向Function原型对象

• JavaScript中只要有原型对象就有constructor属性。Function原型对象的constructor指向它对应的构造函数

• JavaScript中万物皆对象，只要是对象就有__proto__属性

注意点：由于Function构造函数比较特殊（因为它是所以构造函数的祖先），因此它的原型对象还是一个函数的形式呈现

五、原型链

概念：

• 就是实例对象与原型之间的链接，每一个对象都有原型，而原型本身又是对象，原型又有原型，依次类推形成的一种链式结构，称之为原型链

查找规则

• 先查找当前对象, 当前对象有就使用当前对象的方法
• 当前对象没有再逐层在原型链上查找, 最先找到那个就使用哪个
• 如果找到null都没找到就报错

六、ES6定义类

从ES6开始系统提供了一个名称叫做class的关键字，这个关键字就是专门用于定义类的

概念
语法糖（Syntactic Sugar），也称糖衣语法。指的是在计算机语言中添加的某种语法，这种语法对语言的编译结果和功能并没有实际影响， 但是却能更方便程序员使用该语言。

作用：
通常来说使用语法糖能够减少代码量、增加程序的可读性，从而减少程序代码出错的机会。

class Person{
    //当我们通过new创建对象的时候,系统会自动调用constructor
    constructor(name, age) {
        this.name = name;
        this.age = age;
	}
    say(){
    console.log("hello");
	}
}
var p1 = new Person("小明", 18);
var p2 = new Person("小红", 22);
console.log(p1, p2);
console.log(p1.say());
console.log(p1.say === p2.say);//true