prototype和__proto__直观区别

真正的prototype与__proto__的区别，在于prototype原始类设计者，也就是说，原始类设计人员须要对prototype进行一系列操做，而__proto__则是二次开发人员，好比我var app = new Vue(),我想要为Vue实例添加一个方法，就要用app.__proto__，而app.prototype只有尤雨溪才有权限去修改。

显式原型：prototype

隐式原型：__proto__

能够形象地抽象成2类人：

prototype：小白，个性张扬，飞扬跋扈，大张旗鼓，作事生怕天下人都不知道。

__proto__：老鸟，个性沉稳，深藏功名，暗度陈仓，作事最亲近的人都不告诉。
至于为何，看了下文就能略知一二！

其实从字面意思就能够看出二者区别。

显式： 明显的，表现出来的，显示出来的，当前文件中肉眼能够看见的
隐式： 隐藏的，没有表现出来的，隐藏起来的，当前文件中肉眼看不到的
原型：原型是Javascript继承中的核心，经过对原型链从最上层向最下层进行查找，来实现方法的调用。
写一个我最近遇到的例子来直观的理解：

html文件中的script:

var myProgressOne = new mProgress();
        var myClickCallback = function(params){
            console.log(params);
        }

建立新mProgress类须要的script:

var mProgress = function(){
        
        };
        mProgress.prototype = $.extend( new MCBASE(), {
                version:'0.0.1',
                template :'<div class="pg-group">' +
        
                        '</div>',
                defaultOption : {
                    'colors':[],
                    'data': [],
                },
              setDom: function( dom ){
                    this.wrap = this._setDom( dom );
                    if( !this.wrap ){
                        console.log('配置项缺失');
                        return false;
                    }
                },
              ...
         }

定义mProgress类时继承的类的script:

var MCBASE = function(){
           this.version = '0.0.1';
       };
       
       MCBASE.prototype = {
           _getMod : function( ){
               return this;
           },
           _setDom : function(  dom ){
               if( !dom || !dom.length ){
                   console.log('配置项缺失');
                   return null;
               }
           },
           _formateLargeData : function( largeData, fixed ){
           
           }
           ...
        };

此时的对象数据结构见下图，能够直观观察出prototype和__proto__的区别：
小白和老鸟，或者叫孙子和爷爷也能够。

期待和你们交流，共同进步，欢迎你们加入我建立的与前端开发密切相关的技术讨论小组：

• SegmentFault技术圈:ES新规范语法糖
• SegmentFault专栏：趁你还年轻，作个优秀的前端工程师
• 知乎专栏：趁你还年轻，作个优秀的前端工程师
• Github博客: 趁你还年轻233的我的博客
• 前端开发QQ群：660634678
• 微信公众号： 人兽鬼 / excellent_developers

努力成为优秀前端工程师！