zoukankan      html  css  js  c++  java
  • shui-_proto_和prototype和原型链

    原作者网址:http://www.cnblogs.com/mikezhu/p/5814791.html

    1,什么是构造函数

      1、首字母大写

      2、任何函数,只要通过 new 操作符来调用,那它就可以作为构造函数 

      那么要讲到构造函数,必须要有一个函数,所以我们建立一个函数
        function Person(){}
      ok,既然是构造函数,那么久要有参数和返回值 

        Person = function(name,age,force){
          this.name = name;
          this.age = age;
          this.force = force;
        }
     一个函数就出来了,接下来我们来看一下这个Person的__proto__和prototype


    Person.prototype //Object {constructor:function(name,age,force),__proto__:Object}

    Person.__proto__ //function(){}
      好的,我们的构造函数完成了,现在我们来通过构造函数创建一个对象


    var mike = new Person('mike',23,'strong');<br>mike //Person {name: "mike", age: 23, force: "strong"}<br>mike.prototpe //undefined<br>mike.__proto__ //Object {constructor:function(name,age,force),__proto__:Object}
      在上面2段代码,我们可以发现很多,仔细观看mike.__proto__和Person.prototype,是不是发现,这两者其实是一个东西,我们待会验证一下,并且发现mike.prototype是undefined


    alert(mike.__proto__ === Person.prototype) //true
      这样我们大概就了解了,构造函数new Person()发生时候的一个过程

      创建mike对象;

      mike.__proto__ = Person.prototype;  

      Person.call(mike,'mike',23,'strong');

    2,__proto__和prototype

      __proto__按照定义来讲,是对象自带的一个属性,这个__proto__它本身又是一个对象,__proto__的属性,可以被mike读取到,但不会显示在mike对象里,当然__proto__对象中的属性读取优先级要低于mike本身

      而prototype呢,则是函数的一个自带属性,其中prototype又有两个元素,1,constructor指向函数本身,2,__proto__同对象中的__proto__

      构造函数在创建对象是最大的特点就是会把自身的prototype按值传递给被构造对象的__proto__,因为prototype可以当做对象来看,所以是按引用传递//纠正上次的一个错误

      暂时我知道的prototype的作用,就是在构造对象时,将自身的prototype(引用)传递给新函数的__proto__

    3,原型链

      这里我可以举个例子

      mike //Person {name: "mike", age: 23, force: "strong"};
      mike.__proto__face = 'handsome';
      mike //Person {name: "mike", age: 23, force: "strong"}
      mike.face //'handsome'
      mike对象中没有face属性,所以往mike.__proto__中找face,找到了,显示出来,找不到的话,往mike.__proto__.__proto__中找face,如此往复,直到某一个__proto__返回null

    4,多次继承

      function One(){
        this.sayOne = function(){
          alert('nameOne');
        }  
      }
      function Two(){};
      Two.prototype = new One();
      Two.prototype.sayTwo = function(){
        alert('nameTwo');
      }
      var say = new Two();
      say.sayOne() //‘nameOne’
      say.sayTwo() //‘nameTwo’
      two.prototype  //one(sayOne:function(){},sayTwo:function(){})
      

      原理很简单 Two.prototype = new One(); 这一步得到 Two.prototype.__proto__ = One.prototype;

      say.__proto__ = Two.prototype;

      所以say.__proto__.__proto__ = One.prototype;

      所以say.sayTwo = say.__proto__.sayTwo = Two.prototype.sayTwo ;

        One.call(Two.prototype);

        say.sayOne = say.__proto__.sayTwo = Two.prototype.sayOne;

      要完成多次继承,只要将上一层的属性实例化到下一层的prototype即可,因为prototype是可以作为对象的__proto__直接使用的!

  • 相关阅读:
    从零入门 Serverless | Knative 带来的极致 Serverless 体验
    SpringCloud 应用在 Kubernetes 上的最佳实践 — 高可用(熔断)
    阿里巴巴成立云原生技术委员会,云原生升级为阿里技术新战略
    解构云原生,从概念到落地:阿里云、声网、微博、好未来、CNCF 的专家们怎么看?
    人工智能训练云燧T10
    云计算应用场景分析
    昇腾全栈解决方案
    自动驾驶解决方案架构
    自动驾驶开发云平台业务分析
    ResNet-50模型图像分类示例
  • 原文地址:https://www.cnblogs.com/xiaoyangtian/p/7929184.html
Copyright © 2011-2022 走看看