Fork me on GitHub

Javascript进阶(3)---原型链1

  • Javascript是一种 prototype based programming 语言,而与我们经常接触的calss based programming有很大区别。
  1.  函数是 first class object,即函数与对象具有相同的语言地位。
  2.  没有类,只有对象
  3. 函数也是一种对象,没有所谓的函数对象
  4. 对象是按引用来传递的
    function Person(name,sex){
      this.name = name;
      this.sex = sex;
      this.say = function(){
          var words = "i am " + this.name;
          return words;
          };
       }
    
      Person.prototype.age = 24;
      Person.prototype.getAge = function(){
        return this.age;
       }
      
      var James = new Person("James","Male");
      console.log(James.name);  //"James"
      //若在Person中没有找到的属性,会继续沿着原型链向上查找
      console.log(James.age);   //24
      console.log(James.getAge()); //24

  每一个对象的实例都有一个constructor属性,用于指向创建其的函数对象。

  

  (例子中的James.constructor指向的是Peson方法)

  •  函数中自身声明的方法与属性,与在prototype中声明的有何不同?
  1. 自身声明的方法与属性是静态的,也就是使用该对象创建一个实例,再去修改对象中的属性和方法,实例中的属性与方法不会随之改变
  2. 而prototype可以动态地更新自己所拥有的修改的方法,从而使动态地,一旦函数对象声明了了相关的prototype的属性,由其创建的对象也会自动地继承这些对象。
      //(接着前面的例子)
      console.log(James.testPro);  //undefined, 因为根本就不存在这个属性
      console.log(James.name);     //James
      Person.name = "Jenny";       //改变对象的name属性
      Person.testPro = "123";
      console.log(James.testPro);  //Person的prototype中属性的变化,所以实例中属性也跟着变
      console.log(James.name);     //James声明并且实例化后对象变化,实例中的属性并不会跟着改变
  • 属性搜索的过程
  1. 先搜索自身的,若有则立即访问执行
  2. 若自身未找到,则去搜索上一层,直至prototype chain的结尾,结尾一般是object对象
  3. 若实例中定义了和prototype同名的属性或者函数,则会覆盖prototype中的属性或函数

 

  • 一个例子(不带继承)
    function Person(name){  this.name =name;
     }
    Person.prototype.printName = function (){
            console.log(this.name);
       }
    var person1 = new Person('Byron');
    var person2 = new Person('Frank');
  1. Person声明之后,会自动获得一个prototype属性,而prototype也是一个对象,prototype内部会有一个constructor属性,该属性正是指向Person对象
  2. 当调用构造函数创建一个实例的时候,实例的内部将会包含一个内部指针(即__proto__)指向构造函数的prototype,这个链接存在于实例和构造它的函数的prototype之间,而不是在实例和它创建出来的实例之间。(貌似有点绕哈:-D
  3. 对于Person的一个实例person1来说
      1. 实例的constructor属性指向创造它的函数
      2. 实例的__proto__属性,指向他的构造器的prototype,在这里就是指向Person的prototype
      3. 对象的实例是没有prototype属性的
  4. 对与Person对象本身来说
    1. Person的prototype属性,指向一个对象(初始时为空对象),这个对象上有一个printName方法,是我们手动添加的
    2. Person作为一个函数对象,他的constructor指向Function()构造器
    3. Person的__proto__属性,同样是指向的是其构造器的prototype,也就是Function()构造器的prototype
  5. 对于Person.prototype来说
    1. Person.prototype的constructor属性,指向函数对象本身
    2. Person.prototype的__proto__属性指向的是原型链的末端Object对象
    3. 函数本身才会有prototype属性,所以这里返回undefined
    4. 总结如下图
    5. 图中Person的实例Person1与Person2包含了name属性,同时生成了__proto__属性,该属性指向Person的prototype,可以访问到prototype内定义的方法printName

 

posted @ 2016-10-06 16:06  XW_Wong  阅读(258)  评论(0编辑  收藏  举报