构造函数和原型

构造函数的相关知识

  给大家整理了一些关于构造函数和原型的知识点，希望可以帮助到有需要的同学。

一、什么是构造函数

  构造函数，是一种特殊的方法。主要用来在创建对象时初始化对象，即为对象成员变量附初始值，总与new运算符一起使用。
  下面给大家写一个简单的构造函数例子：

function Fn(name,age,sex){
this.name=name,
this.sge=age,
this.sex=sex
}
const obj = new Fn('张三',20,'男')

二、构造函数的应用场景

  我们函数的特点是可以把大量重复的代码封装起来重复使用，也就是我们经常说的函数的复用。那么我们的构造函数也是很好的延续了这一特性，并且发扬光大。当你创建多个相同的实例的时候，就可以使用到我们的构造函数。
  下面我给大家写一个很简单的例子：

var person1 = {name:'张三',age:20,gender:'男'}
var person2 = {name:'李四',age:23,gender:'女'}
var person3 = {name:'王五',age:30,gender:'男'}
var person4 = {name:'林刘',age:26,gender:'女'}
var person4 = {name:'宋宝',age:30,gender:'女'}
//使用构造函数定义：
function Person(name,age,gender){
this.anme=name,
this.age=age,
this.gender=gender
}
var person1 = new Person('张三',20,'男')
var person2 = new Person('李四',20,'男')
var person3 = new Person('王五',20,'男')
var person4 = new Person('刘林',20,'男')
var person5 = new Person('宋宝',20,'男')

  我们把共同的代码提取出来，虽然说现在看起来比较繁琐，但是如果应用到大量的复用的时候会很简便，会让我们的代码看起来更加简洁和优雅。
但是构造函数也有缺点，缺点就是大量的去使用构造函数会占用大量的内存，这个问题我们使用构造函数原型来解决。

三、构造函数原型prototype

  构造函数通过原型分配的函数是所有对象所共享的
  javaScript规定，每一个构造函数都有一个prototype属性指向另一个对象。但是我们要注意prototype就是一个对象，这个对象所有属性和方法，都会被构造函数所拥有。因此，我们可以把那些不变的方法，直接定义在prototype对象上，这样所有对象的实例就可以共享这些方法。

四、对象原型

  对象都会有一个属性 proto 指向构造函数的 prototype 原型对象，之所以我们对象可以使用构造函数 prototype 原型对象的属性和方法，就是因为对象有 proto 原型的存在。
  下面写一段代码举例：

    function fn(name, age, sex) {
            this.name = name,
                this.age = age,
                this.sex = sex
        }
        const obj = new fn('zhangsan', 20, 'nan')
        console.dir(obj);
        //输出结果：fn
		//age: 20
		//name: "zhangsan"
		//sex: "nan"
		//__proto__:
		//constructor: ƒ fn(name, age, sex)
		//arguments: null
		//caller: null
		//length: 3
		//name: "fn"
		//prototype:
		//constructor: ƒ fn(name, age, sex)
		//__proto__: Object
		//__proto__: ƒ ()
		//[[FunctionLocation]]: index.html:16
		//[[Scopes]]: Scopes[2]
		//__proto__: Object
		//根据输出的结果可以看出 __proto__ 指向构造函数的 prototype 原型对象

  __proto__对象原型和原型对象 prototype 是等价的
  __proto__对象原型的意义就在于为对象的查找机制提供一个方向，或者说一条路线，但是它是一个非标准属性，因此实际开发中，不可以使用这个属性，它只是内部指向原型对象 prototype
  下面写一段代码举例：

 function Star(name, age) {
            this.name = name,
                this.age = age
        }
        Star.prototype.sing = function () {
            console.log('我会唱歌');
        }
        const ls = new Star('李四', 18)
        const zs = new Star('张三', 20)
        zs.sing()
        console.log(zs);
        console.log(zs.__proto__ === Star.prototype);
        //输出结果：我会唱歌
		//Star {name: "张三", age: 20}
		//true

五、constructor构造函数

  对象原型（ proto）和构造函数（prototype）原型对象里面都有一个属性 constructor 属性 ，constructor 我们称为构造函数，因为它指回构造函数本身。
  constructor 主要用于记录该对象引用于哪个构造函数，它可以让原型对象重新指向原来的构造函数。
  一般情况下，对象的方法都在构造函数的原型对象中设置。如果有多个对象的方法，我们可以给原型对象采取对象形式赋值，但是这样就会覆盖构造函数原型对象原来的内容，这样修改后的原型对象 constructor 就不再指向当前构造函数了。此时，我们可以在修改后的原型对象中，添加一个 constructor 指向原来的构造函数。
  如果我们修改了原来的原型对象,给原型对象赋值的是一个对象,则必须手动的利用constructor指回原来的构造函数。
  下面我用一段代码举例：

   function Star(uname, age) {
            this.uname = uname;
            this.age = age;
        }
        // 很多情况下,我们需要手动的利用constructor 这个属性指回 原来的构造函数
        Star.prototype = {
            // 如果我们修改了原来的原型对象,给原型对象赋值的是一个对象,则必须手动的利用constructor指回原来的构造函数
            constructor: Star, // 手动设置指回原来的构造函数
            sing: function () {
                console.log('我会唱歌');
            },
            movie: function () {
                console.log('我会演电影');
            }
        }
        var zxy = new Star('张学友', 19);

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

  1.构造函数的prototype属性指向了构造函数原型对象
  2.实例对象是由构造函数创建的,实例对象的__proto__属性指向了构造函数的原型对象
  3.构造函数的原型对象的constructor属性指向了构造函数,实例对象的原型的constructor属性也指向了构造函数

七、原型链和成员的查找机制

  任何对象都有原型对象,也就是prototype属性,任何原型对象也是一个对象,该对象就有proto属性,这样一层一层往上找,就形成了一条链,我们称此为原型链。
  当访问一个对象的属性（包括方法）时，首先查找这个对象自身有没有该属性。如果没有就查找它的原型（也就是 __proto__指向的 prototype 原型对象）。如果还没有就查找原型对象的原型（Object的原型对象）。
依此类推一直找到 Object 为止（null）。
  __proto__对象原型的意义就在于为对象成员查找机制提供一个方向，或者说一条路线。