zoukankan      html  css  js  c++  java
  • JavaScript基础知识十三(原型链模式基础)

     function CreateJsPerson(name,age){
               this.name = name;
               this.age = age;
              /* this.writeJss = function(){
                   console.log("my name is "+this.name+",i  can write " );
               }*/
           }
           var p1 = new CreateJsPerson("鲁尼",30);
           var p2 = new CreateJsPerson("范尼",39);
           CreateJsPerson.prototype.writeJss = function(){
                console.log("my name is "+this.name+",i  can write " );
            }
            console.log(p2.writeJss ===p1.writeJss);//false

    //构造函数模式中拥有了类和实例的概念,并且实例和实例之间是互相独立开的->实例识别

    //基于构造函数模式的原型模式解决了方法或者属性公有的问题->把实例之间相同的属性和方法提取成公有的属性

    和方法->想让谁公有就把它放在CreateJsPerson.prototype上即可

    //给一个类添加公有方法
    CreateJsPerson.prototype.writeJss = function(){
                console.log("my name is "+this.name+",i  can write " );
            }

    1.每一个函数数据类型(普通函数、类)都有一个天生自带的属性:prototype(原型),并且这个属性是一个对象数据类型的值

    2.并且在prototype上浏览器天生给它加了一个属性constructor(构造函数),属性值是当前函数(类)本身

    3.每一个对象数据类型(普通的对象、实例、prototype...)也天生自带一个属性: _proto_,属性值是当前实例所属类的原型(prototype)

     function Fn(){
              this.x =100;
          }
          Fn.prototype.getX =function(){
              console.log(this.x);
          }
          var f1 = new Fn;
          var f2  = new Fn;
          console.log(Fn.prototype.constructor);//Fn(){
                                                 //this.x =100;
                                                 // }
          console.log(Fn.prototype.constructor===Fn);//true

    1.f1 instanceof object -> true 因为f1通过_proto_可以向上级查找,不管有多少级,最后总能找到Object

    2.在Object.prototype上没有_proto_这个属性

    f1.hasOwnProperty("x");//hasOwnProperty是f1的一个属性

    但是我们发现在f1的私有属性上并没有这个方法,那如何处理的呢?

    1.通过对象名.属性名 的方式获取属性值的时候,首先在对象的私有的属性上进行查找,如果私有中存在这个属性,则获取的是私有的属性值;

    //如果私有的没有,则通过_proto_找到所属类的原型(类的原型上定义的属性和方法都是当前实例的公有的属性和方法),原型上存在的话,获取的是公有的属性值;

    如果原型上也没有,则继续通过原型上的_proto_继续向上查找,一直找到Object.prototype为止...

    这种查找的机制就是我们的"原型链机制"

    f1.getX===f2.getX//true  私有方法找不到会去找公有方法
    f1.__proto__.getX===f2.getX//true
    f1.getX()===Fn.prototype.getX//true

    当公有私有方法名一样

    f1.sum === f2.__proto__.sum// false  当公有私有方法名一样
    f1.sum === Fn.prototype.sum;// false  对比结果为false

    f1.hasOwnProperty ->f1._proto_._proto_.hasOwnProperty 

    在IE浏览器中,我们原型模式也是同样的原理,但是IE浏览器怕你通过_proto_把公有的修改.禁止我们使用_proto_

  • 相关阅读:
    JVM(7) Java内存模型与线程
    JVM(6) 字节码执行引擎
    JVM(5) 类加载机制
    JVM(4) 类文件结构
    JVM(3) 垃圾收集器与内存分配策略
    python的with
    python http server handle json
    c++文件读写
    python字符串处理
    python decorator
  • 原文地址:https://www.cnblogs.com/zzzzzzzsy/p/6694605.html
Copyright © 2011-2022 走看看