详谈jQuery中的this和$(this)_jquery

网上有很多关于jQuery的this和$(this)的介绍，大多数只是理清了this和$(this)的指向，其实它是有应用场所的，不能一概而论在jQuery调用成员函数时，this就是指向dom对象。

$(this)指向jQuery对象是无可厚非的，但this就是指向dom对象，这个是因为jQuery做了特殊的处理。　

在创建dom的jQuery对象时，jQuery不仅仅为dom创建一个jQuery对象，而且还将dom存储在所创建对象的数组中。

复制代码 代码如下:

elem = document.getElementById(match[2]); 
if (elem && elem.parentNode) { 
  this.length = 1; 
  this[0] = elem; 
} 
 
this.context = document; 
this.selector = selector; 
return this; 

 this[0] = elem这条语句就是实现对象数组。所以javascript是很有意思的语言，使用this访问时，可以访问它所指向的对象的成员函数，而其实this又是一个对象数组。其存放的是dom对象。

先看看 $("p").each() -- 循环

复制代码 代码如下:

each: function( callback, args ) { 
        return jQuery.each( this, callback, args ); 
    } 

 看了each函数的调用大家应该明白，jQuery.each( this, callback, args );调用的是对象数组，而对象的数组存储的是dom对象，因此在callback函数中的this自然是dom对象了

再看看$("p").hide()　--　成员函数

复制代码 代码如下:

隐藏：函数（）{ 
        返回显示隐藏（此）； 
    }, 
 函数 showHide( elements, show ) {var elem, display, 
        值= []，
        索引 = 0，
        长度=元素.长度； 
    for ( ; 索引         elem = 元素[ 索引 ]; 
        if ( !elem.style ) { 
            继续; 
        } 
        值[索引] = jQuery._data( elem, "olddisplay" ); 
        如果（显示）{ 
            // 重置此元素的内联显示以了解它是否为
            // 是否被级联规则隐藏
            if ( !values[ index ] && elem.style.display === "none" ) { 
                elem.style.display = ""; 
            } 
            // 设置已被 display: none 覆盖的元素
            // 在样式表中设置为默认浏览器样式
            // 对于这样的元素
            if ( elem.style.display === "" && isHidden( elem ) ) { 
                值[索引] = jQuery._data( elem, "olddisplay", css_defaultDisplay(elem.nodeName) ); 
            } 
        } 其他 { 
            显示 = curCSS( elem, "显示" ); 
            if ( !values[ 索引 ] && 显示 !== "none" ) { 
                jQuery._data( elem, "olddisplay", 显示 ); 
            } 
        } 
    } 
    // 设置第二个循环中大部分元素的显示
    // 避免持续回流
    for ( 索引 = 0; 索引         elem = 元素[ 索引 ]; 
        if ( !elem.style ) { 
            继续; 
        } 
        if ( !show || elem.style.display === "none" || elem.style.display === "" ) { 
            elem.style.display = 显示？值[索引]|| ““ ： “没有任何”; 
        } 
    } 
    返回元素； 
} 

从上面的代码可以看出hide行数其实调用的是showHide，而确定的第一个参数this，不是dom对象，而是jQuery对象数组，showHide函数通过循环这个对象数组获取每个一个 dom 对象。

最后看看$("p").bind()

复制代码代码如下：

绑定：函数（类型，数据，fn）{ 
        返回 this.on( 类型, null, 数据, fn ); 
    }, 

复制代码代码如下：

on: function( types, selector, data, fn, /*INTERNAL*/ one ) { 
        // 此部分代码省略 
        return this.each( function() { 
            jQuery.event.add( this, types, fn, data, selector ); 
        }); 
    }, 

bind函数调用的是 on函数，而on函数又是通过 each函数实现了jQuery.event.add。因此　jQuery.event.add( this中的this也就是dom对象了。所以事件中的this也就是dom对象了。

以上就是个人对于jQuery中this与$(this)的理解了，如有什么纰漏，请联系我或者给我留言