JQuery里面的工具方法

工具是什么？

在字面意思上面的意思就是：工具原指工作时所需用的器具，后引申为达到、完成或促进某一事物的手段。工具是一个相对概念，因为其概念不是一个具体的物质，所以只要能使物质发生改变的物质，相对于那个能被它改变的物质而言就是工具。

而我这里所说的工具方法是：
jQuery函数库提供了一个jQuery对象（简写为$），这个对象本身是一个构造函数，可以用来生成jQuery对象的实例。有了实例以后，就可以调用许多针对实例的方法，它们定义jQuery.prototype对象上面（简写为$.fn）。除了实例对象的方法以外，jQuery对象本身还提供一些方法（即直接定义jQuery对象上面），不需要生成实例就能使用。由于这些方法类似“通用工具”的性质，所以我们把它们称为“工具方法”。

工具方法

数组和对象操作

1、$.each(object,[callback])（通用遍历方法，可用于遍历对象和数组。）
注意：不同于遍历 jQuery 对象的 $().each() 方法，此方法可用于遍历任何对象。回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false，其它返回值将被忽略。
参数：
object:需要遍历的对象或数组。
callback:每个成员/元素执行的回调函数。
例子：

//第一种用法：
//遍历数组，同时使用元素索引和内容
$.each( [0,1,2], function(i, n){
	  alert( "Item #" + i + ": " + n );
	});

//第二种用法：
//遍历对象，同时使用成员名称和变量内容
$.each( { name: "John", lang: "JS" }, function(i, n){
  alert( "Name: " + i + ", Value: " + n );
});

2、$.extend([d],tgt,obj1,[objN])（用一个或多个其他对象来扩展一个对象，返回被扩展的对象）
注意：如果不指定target，则给jQuery命名空间本身进行扩展。这有助于插件作者为jQuery增加新方法。 如果第一个参数设置为true，则jQuery返回一个深层次的副本，递归地复制找到的任何对象。否则的话，副本会与原对象共享结构。 未定义的属性将不会被复制，然而从对象的原型继承的属性将会被复制。
在JQuery的1.0版本里面的参数：
target:一个对象，如果附加的对象被传递给这个方法将那么它将接收新的属性，如果它是唯一的参数将扩展jQuery的命名空间。
object1:待合并到第一个对象的对象。
objectN:待合并到第一个对象的对象。
在JQuery的1.1.4版本里面的参数：
deep:如果设为true，则递归合并。
target:待修改对象。
object1:待合并到第一个对象的对象。
objectN:待合并到第一个对象的对象。

例子：

//合并 settings 和 options，修改并返回 settings。

//jQuery 代码:
var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
jQuery.extend(settings, options);
//结果:settings == { validate: true, limit: 5, name: "bar" }

3、$.grep(array,fn,[invert])（使用过滤函数过滤数组元素。）
注意：此函数至少传递两个参数：待过滤数组和过滤函数。过滤函数必须返回 true 以保留元素或 false 以删除元素。
参数：
array:待过滤数组。
callback:此函数将处理数组每个元素。第一个参数为当前元素，第二个参数而元素索引值。此函数应返回一个布尔值。另外，此函数可设置为一个字符串，当设置为字符串时，将视为“lambda-form”（缩写形式？），其中 a 代表数组元素，i 代表元素索引值。如“a > 0”代表“function(a){ return a > 0; }”。
invert:如果 “invert” 为 false 或为设置，则函数返回数组中由过滤函数返回 true 的元素，当"invert" 为 true，则返回过滤函数中返回 false 的元素集。
例子：

//第一种用法：
//过滤数组中小于 0 的元素。
$.grep( [0,1,2], function(n,i){
  return n > 0;
});
//结果:[1, 2]

//第二种用法：
//排除数组中大于 0 的元素，使用第三个参数进行排除。
$.grep( [0,1,2], function(n,i){
  return n > 0;
}, true);
//结果:[0]

4、$.when(deferreds)（提供一种方法来执行一个或多个对象的回调函数，延迟对象通常表示异步事件。）
注意：
1、如果单一延迟传递给jQuery.when ，它是通过这个方法和延迟对象附加的其他方法可访问绑定的回调函数返回的，如defered.then 。当延迟得到解决或者拒绝，通常的代码创建了原来的延迟，适当的回调将被调用
例如：

//jqXHR对象返回jQuery.ajax是一个延期，可以用这种方式：
$.when( $.ajax("test.aspx") ).then(function(ajaxArgs){ 
     alert(ajaxArgs[1]);
});

2、如果一个参数被传递给jQuery.when ，这不是延迟，这将被视为延迟解决，并立即将执行附加任何doneCallbacks。该doneCallbacks传递原始的参数。在这种情况下，任何failCallbacks您可能会设置是永远不会被调用，因为延迟从不拒绝。
例如：

$.when( { testing: 123 } ).done(
   function(x){ alert(x.testing); } /* alerts "123" */
);

3、在案例中有多个延迟对象传递jQuery.when ，该方法返回一个新的“宿主”延迟对象，跟踪所有已通过Deferreds聚集状态。该方法能够解决它的“宿主”延迟尽快解决所有延迟，或拒绝尽快将被拒绝的延迟。如果“宿主”延迟得到解决，它是通过传递给解析值，所有的延迟 jQuery.when 。例如，当延迟是jQuery.ajax()请求，参数将是jqXHR对象的要求，以便他们在名单内的说法。
4、在多延迟情况下，如果延迟一被拒绝，jQuery.when火灾立即掌握其推迟failCallbacks。请注意，延迟一些可能仍然在这一点没有得到解决。如果您需要执行额外的处理对于这种情况，如取消任何未完成的Ajax请求，你可以保持基本jqXHR引用对象在封闭和检查/取消在failCallback他们。
参数：
这个是JQuery的15版本的一个或多个延迟对象，或者普通的JavaScript对象。

例子：

//执行函数myfunc当两个Ajax请求是成功的，如果任一或myFailure有一个错误。

$.when($.ajax("/page1.php"), $.ajax("/page2.php"))
  .then(myFunc, myFailure);

5、$.makeArray(obj)（将类数组对象转换为数组对象。）
注意：类数组对象有 length 属性，其成员索引为 0 至 length - 1。实际中此函数在 jQuery 中将自动使用而无需特意转换。
参数：这个参数是JQuery的1.2版本的上面的，参数是传类数组对象。
例子：

//HTML 代码:
<div>First</div><div>Second</div><div>Third</div><div>Fourth</div>
//描述：过滤数组中小于 0 的元素。
//jQuery 代码:
var arr = jQuery.makeArray(document.getElementsByTagName("div"));
arr.reverse(); // 使用数组翻转函数
//结果:Fourth Third Second First 

6、$.map(arr|obj,callback)（将一个数组中的元素转换到另一个数组中。）
注意：作为参数的转换函数会为每个数组元素调用，而且会给这个转换函数传递一个表示被转换的元素作为参数。转换函数可以返回转换后的值、null（删除数组中的项目）或一个包含值的数组，并扩展至原始数组中。
在JQuery的1.0版本的参数：
array:待转换数组。
callbackArray:为每个数组元素调用，而且会给这个转换函数传递一个表示被转换的元素作为参数。函数可返回任何值。另外，此函数可设置为一个字符串，当设置为字符串时，将视为“lambda-form”（缩写形式？），其中 a 代表数组元素。如“a * a”代表“function(a){ return a * a; }”。
在JQuery的1.6版本的参数：
arrayOrObject:数组或者对象。
在JQuery的1.6版本这个参数要注意的：
为每个数组元素调用，而且会给这个转换函数传递一个表示被转换的元素作为参数。函数可返回任何值。另外，此函数可设置为一个字符串，当设置为字符串时，将视为“lambda-form”（缩写形式？），其中 a 代表数组元素。如“a * a”代表“function(a){ return a * a; }”。

例子：

//原数组中每个元素扩展为一个包含其本身和其值加 1 的数组，并转换为一个新数组
$.map( [0,1,2], function(n){
  return [ n, n + 1 ];
});
//结果:[0, 1, 1, 2, 2, 3]

7、$.inArray(val,arr,[from])（确定第一个参数在数组中的位置，从0开始计数(如果没有找到则返回 -1 )）
参数：
value:用于在数组中查找是否存在
array:待处理数组。
fromIndex:用来搜索数组队列，默认值为0。
例子：

//查看对应元素的位置

var arr = [ 4, "Pete", 8, "John" ];
jQuery.inArray("John", arr);  //3
jQuery.inArray(4, arr);  //0
jQuery.inArray("David", arr);  //-1
jQuery.inArray("Pete", arr, 2);  //-1

8、$.toArray()（把jQuery集合中所有DOM元素恢复成一个数组）
例子：

//得到所有li的元素数组
alert($('li').toArray());
//结果:[<li id="foo">, <li id="bar">]

9、$.parseJSON(json)（接受一个JSON字符串，返回解析后的对象）
注意：在jQuery 3.0 及以后版本中，该方法已被删除，请使用原生方法 JSON.parse(str)
传入一个畸形的JSON字符串会抛出一个异常。比如下面的都是畸形的JSON字符串：
{test: 1} （ test 没有包围双引号）
{‘test’: 1} （使用了单引号而不是双引号）
另外，如果你什么都不传入，或者一个空字符串、null或undefined，parseJSON都会返回 null 。
参数：在JQuery的1.4.1的版本的上面的参数是要解析的JSON字符串

例子：

//解析一个JSON字符串
var obj = jQuery.parseJSON('{"name":"John"}');
alert( obj.name === "John" );

函数操作

1、$.noop（一个空函数）
当你仅仅想要传递一个空函数的时候，就用他吧。这对一些插件作者很有用，当插件提供了一个可选的回调函数接口，那么如果调用的时候没有传递这个回调函数，就用jQuery.noop来代替执行。

2、$.proxy(function,context)（返回一个新函数，并且这个函数始终保持了特定的作用域）
注意:这个是JQuery的1.4版本上新增的
当有事件处理函数要附加到元素上，但他们的作用域实际是指向另一个对象时，这个方法最有用了。此外，最妙的是，jQuery能够确保即便你绑定的函数是经过jQuery.proxy()处理过的函数，你依然可以传递原先的函数来准确无误地取消绑定。请参考下面的例子。
这个函数还有另一种用法，jQuery.proxy( scope, name )。第一个参数是要设定的作用域对象。第二个参数是将要设置作用域的函数名（必须是第一个作用域对象的一个属性）。

在JQuery的1.4版本的上面的参数：
function:将要被改变作用域的函数
context:一个object，那个函数的作用域会被设置到这个object上来。
在JQuery的1.4版本的上面的参数：
context:一个object，那个函数的作用域会被设置到这个object上来。
name：改变上下文中的函数名(这个函数必须是前一个参数 ‘context’ 对象的属性)

例子：

//HTML 代码:
<div id="test">Click Here!</div>
//jQuery 代码:
//强制设置函数的作用域，让this指向obj而不是#test对象。
var obj = {
  name: "John",
  test: function() {
    alert( this.name );
    $("#test").unbind("click", obj.test);
  }
};

$("#test").click( jQuery.proxy( obj, "test" ) );

// 以下代码跟上面那句是等价的:
// $("#test").click( jQuery.proxy( obj.test, obj ) );

// 可以与单独执行下面这句做个比较。
// $("#test").click( obj.test );

测试操作

1、$.contains(c,c)（一个DOM节点是否包含另一个DOM节点）
在JQuery的1.4版本的上面的参数：
container:DOM元素作为容器，可以包含其他元素
contained:DOM节点，可能被其他元素所包含
例子：

//检测一个元素是否包含另一个元素
jQuery.contains(document.documentElement, document.body); // true
jQuery.contains(document.body, document.documentElement); // false

2、$.type(obj)（检测obj的数据类型）
参数是在JQuery的1.4.3的版本的上面的：用于测试类型的对象

例子：

//以下obj的类型如下：    
jQuery.type(true) === "boolean"  
jQuery.type(3) === "number"       
jQuery.type("test") === "string"      
jQuery.type(function(){}) === "function"     
jQuery.type([]) === "array"
jQuery.type(new Date()) === "date"
jQuery.type(/test/) === "regexp

3、$.isArray(obj)（测试对象是否为数组）
注意：这个工具方法是在JQuery的1.3的版本上面新增的，但是在JQuery的3.2的版本上面已经废弃了
参数是在JQuery的1.3上面的意思是：用于测试是否为数组的对象

例子：

//检测是否为数组
$("b").append( " + $.isArray([]) );
//结果:<b>true</b>

4、$.isFunction(obj)（测试对象是否为函数）
注意：jQuery 1.3以后，在IE浏览器里，浏览器提供的函数比如’alert’还有 DOM 元素的方法比如 ‘getAttribute’ 将不认为是函数。但是在jQuery 3.3中已废弃。
参数在JQuery1.2的版本上面的意思就是：用于测试是否为函数的对象

例子：

//检测是否为函数
function stub() {}
var objs = [
      function () {},
      { x:15, y:20 },
      null,
      stub,
      "function"
];
   jQuery.each(objs, function (i) {
     var isFunc = jQuery.isFunction(objs[i]);
      $("span:eq( " + i + ")").text(isFunc);
    });
//结果:[ true,false,false,true,false ]

5、$.isWindow(obj)（测试对象是否是窗口（有可能是Frame））
注意：这个工具方法在jQuery 3.3中已废弃。
参数在JQuery1.4.3的上面的意思：用于测试是否为窗口的对象

例子：

//测试是否为窗口

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.5.2.js"></script>
</head>
<body>
  Is 'window' a window? <b></b>
<script>$("b").append( "" + $.isWindow(window) );</script>
</body>
</html>

字符串操作

1、$.trim(str)（去掉字符串起始和结尾的空格）
参数在JQuery1.0的上面的意思：需要处理的字符串
例子：

//去掉字符串起始和结尾的空格。
$.trim("  hello, how are you?  ");
//结果:"hello, how are you?"

2、$.param(obj,[traditional])（将表单元素数组或者对象序列化。是.serialize()的核心方法）
注意：
1、在jQuery 1.3中，如果传递的参数是一个函数，那么用.param()会得到这个函数的返回值，而不是把这个函数作为一个字符串来返回。
2、在jQuery 1.4中，.param()会深度递归一个对象来满足现在脚本语言和框架，比如PHP， Ruby on Rails等。你可以通过jQuery.ajaxSettings.traditional = true; 来全局得禁用这个功能。
3、因为有些框架在解析序列化数字的时候能力有限，所以当传递一些含有嵌套对象、数组的对象作为参数时，请务必小心！
4、在jQuery 1.4中，HTML5的input元素也会被序列化。

参数在JQuery1.2的上面的意思：
obj：数组或jQuery对象会按照name/value对进行序列化，普通对象按照key/value对进行序列化。
参数的JQuery1.4的上面的意思：
obj:数组或jQuery对象会按照name/value对进行序列化，普通对象按照key/value对进行序列化。
traditional:是否使用传统的方式浅层序列化。

例子：

//按照key/value对序列化普通对象。
var params = { width:1680, height:1050 };
var str = jQuery.param(params);
$("#results").text(str);
//结果:width=1680 & height=1050

插件编写

1、$.error(message)（接受一个字符串，并且直接抛出一个包含这个字符串的异常）
注意：这个方法的主要目的是提供给插件开发人员，让他们可以重载这个方法，并以更好的方式显示错误，或者提供更多信息。
参数在JQuery1.4.1的上面的意思：要抛出的消息

例子：

//重载jQuery.error，以便可以在Firebug里显示

$.error = console.error;

2、$.fn.jquery（代表 jQuery 版本号的字符串）
注意：.jquery 属性是通过 jQuery 原型赋值的，通过使用它的别名 $.fn 进行引用。它是一个含有 jQuery 版本号的字符串，例如 “1.5.0” 或 “1.4.4”

例子：

//判断一个对象是否是 jQuery 对象。
var a = { what: "A regular JS object" },
      b = $('body');
         if ( a.jquery ) { // falsy, since it's undefined
      alert(' a is a jQuery object! ');
      }    if ( b.jquery ) { // truthy, since it's a string
      alert(' b is a jQuery object! ');
  }

还可以获得页面上的当前使用的JQuery的版本号：
例子：

alert( 'You are running jQuery version: ' + $.fn.jquery );