JS之原型和原型链(一)

JS之原型和原型链(一)

原型

1.在JS中万物皆对象，所有对象都具有__proto__属性，由__proto__属性对应的就是该对象的原型；
2. 若对象为函数对象还会具有prototype属性，当函数对象作为构造函数创建实例时，函数的prototype属性的值将被作为实例对象的原型；

这样解释原型有点抽象，下面用例子来详细解释一下

• 首先创建一个函数对象——Animal

 function Animal(name){
                this.name=name;
                this.eat=function (){
                console.log("eat.food!")
                }
            }

• 将Animal作为构造函数创建“猫”和“狗”两个实例；

  var dog = new Animal("corgi");
  var cat = new Animal("orangCate");
   dog.eat();
   cat.eat();
   // 两个实例中都有eat方法，有个问题是两个实例对象中eat方法都是独立的，所以会占用两份内存
   // 若实例过多，会存在很大的内存消耗；

• 为了解决多个实例的内存消耗问题，这时候可以用到JS中函数对象的prototype属性，将方法放在函数的原型上。
  如下：

    function Animal(name){
                this.name=name;
                // this.eat=function (){
                //     console.log("eat.food!")
                // }
            }
    // 将eat方法存放在Animal原型上，这样就会至占用一份的内存，Animal的其他实例都会共享eat方法。
            Animal.prototype.eat=function(){
                console.log("eat.food!")
            }

• 实例自身的__proto__的属性指向构造函数的prototype

      console.log(dog.__proto__===Animal.prototype)//true

原型链

当实例对象无法在自身找到需要的调用的属性或方法，则会通过 __proto__去构造函数原型上去寻找，若还未找到，则再在构造函数原型的原型上去找，由此而形成的一个链式关系则被称之为原型链。