jquery插件开发学习

#8.1在插件中使用$别名 在编写jquery插件时，必须假设jQuery库已经加载到了页面中。但是咱们不能假设$别名必定可用。由于别的插件也有可能使用$别名，juqery中的$.noConfilct()方法就是用来让渡这个快捷方式的使用权的。在编写插件时若是咱们依然想使用$别名，解决方案以下

(function($){
    //在这里添加代码
})(jQuery);

代码说明:这里建立了一个匿名的当即执行函数，该函数一经建立，便会当即执行，执行的时候咱们传入实参jQuery，用形参$接收，这样，咱们就能够在函数内部继续使用$别名了。 #8.2添加新的全局函数 ##8.2.1 jQuery内置的某些功能是经过全局函数提供的。所谓 全局函数，实际上就是jQuery对象的方法。但从实践的角度上看，它们是位于jQuery命名空间内部的函数。

要向jQuery的命名空间中添加一个函数，只需将这个新函数指定为jQuery对象的一个属性，在此咱们添加一个求和函数(代码以下):

(function ($) {
  $.sum = function (array) {
    var total=0;
    $.each(array,function(index,value){
      value=$.trim(value);
      value=parseFloat(value)||0;
      total+=value
    })
    return total;
  };
}) (jQuery);

咱们添加了一个$.sum()函数，它接受一个数组，返回求和结果。运行结果以下：

$.sum([1,2,3]);
/*
6
*/

代码完整截图 ##8.2.2添加多个函数 咱们能够增长插件功能，再次添加一个求平均值的函数，代码以下：

$.average = function (array) {
    if ($.isArray(array)) {
      return $.sum(array) / array.length;
    }
    return ' ';
  }

代码完整截图

##8.2.2扩展全局jQuery对象 事实上，$.extend()函数，咱们能够经过另外一种方法来定义全局函数，参见代码以下:

(function ($) {
  $.extend({
    sum: function (array) {
      var total = 0;
      $.each(array, function (index, value) {
        value = $.trim(value);
        value = parseFloat(value) || 0;
        total += value
      })
      return total;
    },
    average: function (array) {
      if ($.isArray(array)) {
        return $.sum(array) / array.length;
      }
      return '';
    }
  })
}) (jQuery);

这样调用$.extend(),就能够给全局jQuery对象添加属性（若是有原来有相同的属性，就会替换原来的属性），这样也定义相同的$.sum()和$.avrage()方法。 ##8.2.3 使用命名空间隔离函数 咱们的插件在jQuery命名空间中定义了两个独立的全局函数。但这样写有可能污染命名空间。换句话说，其它jQuery插件也可能定义相同的函数名。为了不冲突，为了不冲突，最好的方法就是把属于一个插件的全局函数都封装到一个对象中，代码以下:

(function ($) {
  $.mathUtils={
    sum: function (array) {
      var total = 0;
      $.each(array, function (index, value) {
        value = $.trim(value);
        value = parseFloat(value) || 0;
        total += value
      })
      return total;
    },
    average: function (array) {
      if ($.isArray(array)) {
        return $.mathUtils.sum(array) / array.length;
      }
      return '';
    }
  }
}) (jQuery);