jQuery无new构建实例

  1.  var jQuery = function () {
  2.      return new jQuery.prototype.init();
  3.  }
  4.  jQuery.fn = jQuery.prototype = {
  5.    jquery: version,
  6.    // 共享原型
  7.    init: function () {
  8.      // 与jQuery共享一个原型对象
  9.    },
  10.    css: function () {
  12.    }
  13.  }

共享原型设计

  1. // init共享jQuery原型对象，
  2. jQuery.fn.init.prototype = jQuery.fn;

extend源码设计

  1.  /**
  2.      * @description 实现对于jQuery或者jQuery实例的扩展，或者对于任意对象的扩展
  3.      * @params 第一个参数为{},并且只有一个参数则为jQuery或者jQuery实例的扩展
  4.      *         第一参数为Boolean，并且为true，则为深拷贝，
  5.      * @type {function(): any}
  6.      */
  7.     jQuery.extend = jQuery.fn.extend = function () {
  8.         var target = arguments[0] || {};
  9.         var isDeep; // 是否是一个深拷贝
  10.         var i = 1; // 因为对象扩展的时候第一个参数是不需要动的，所以从1开始
  11.         var length = arguments.length;
  13.         // 如果是第一个参数是Boolean，为true是深拷贝
  14.         if (typeof target === 'boolean') {
  15.             isDeep = target;
  16.             target = arguments[1];
  17.             i = 2;
  18.         }
  20.         // 第一个参数必须为Object
  21.         if (typeof target !== 'object') {
  22.             target = {};
  23.         }
  25.         // 判断当前参数的个数
  26.         if (i === length) {
  27.             // 只有1个参数用于对jQuery或jQuery实例扩展静态属性及方法，
  28.             // 1个参数以上用于给任意对象的扩展
  29.             target = this;
  31.             // 从0开始，用于扩展每个属性和方法
  32.             i--;
  33.         }
  35.         for (; i < length; i++) {
  36.             var options, name, copy, src, clone, copyIsArray;
  37.             if ((options = arguments[i]) !== null) {
  38.                 for (name in options) {
  39.                     copy = options[name];
  40.                     src = target[name];
  41.                     // 如果是深拷贝，并且为数组或者对象
  42.                     if (isDeep && (jQuery.isObject(copy) || (copyIsArray = jQuery.isArray(copy)))) {
  43.                         if (copyIsArray) {
  44.                             copyIsArray = false;
  45.                             clone = src && jQuery.isArray(src) ? src : [];
  46.                         } else {
  47.                             clone = src && jQuery.isObject(src) ? src : {};
  48.                         }
  49.                         target[name] = jQuery.extend(isDeep, clone, copy);
  50.                     } else {
  51.                         target[name] = copy; // 浅拷贝
  52.                     }
  53.                 }
  54.             }
  55.         }
  56.         return target;
  57.     };

实现一个mini-jQuery

源码