jQuery源码学习一： 建立一个jquery实例

前言：

jquery是每一个前端都会的基础技能，众所周知，jquery返回的是jquery实例方法，可是咱们彷佛是直接使用$就能够获取到jquery的方法啦，能够在浏览器中判断一下 window.$ 和window.jQuery,jQuery 之间的关系，就会发现他们之间是全等的；

不使用new方法调用

咱们通常调用实例大部分是经过new方法，可是jquery却不是，而是直接调用，这是为何呢
1. 建立实例方法：

(function(root){
    var jQuery = function(){
      console.log('建立实例啦')
    }
    root.jQuery = jQuery //这样赋值就能够调用啦
  })(window)

2.返回时操做

可是如今页面上调用jQuery仍然不能使用$调用，因而简单修改代码

(function(root){
    var jQuery = function(){
      return new jQuery()
    }
    root.$ = root.jQuery = jQuery 
  })(this)

这样咱们就能够不在外部调用new方法，由于jQuery在返回的时候就已经调用了new

原型共享

在以前的操做下，咱们已经将new jQuery返回了出去，可是这样是有问题的。咱们在jquery原型中定义一个init方法，并将init返回出去
1. 定义一个init

var jQuery = function(){
    return new jQuery.prototype.init();
  }
  jQuery.prototype = {
    init: function(){
    }
  }

可是这样咱们虽然解决了报错问题，可是咱们如今没法获取到jQuery中的原型方法，也就没法调用到jQuery的方法。
2. 原型共享
jQuery中有很重要的一行代码：

jQuery.prototype.init.prototype = jQuery.prototype

这就是原型共享，简单从代码来看，就是将jquery的原型赋值给jquery.prototype.init方法原型；
这样咱们调用jquery时，虽然获取的是init方法，可是依然能够调用jquery中的原型方法。
3. 例子
咱们在jquery上简单扩展方法，并打印jquery验证

jQuery.prototype = {
    init: function(){
    },
    css: function(){},
  }

结果：