首先看一下在jQuery1.7.1中定义的原型属性和方法有哪些？

init方法作为实际的构造函数已经详细分析过了，需要了解可以参考http://www.cnblogs.com/yy-hh/p/4492887.html  除此方法之外还有扩展方法extend也已经分析过了有兴趣可以看下http://www.cnblogs.com/yy-hh/p/4546301.html

首先是constructor属性  

相信熟悉js面向对象部分的开发人员都熟悉，就是用来返回对象属性创建的函数，举个简单的例子：

function Person(){};

        var person=new Person();

        alert(person.constructor);  //function Person(){}

我们写继承的时候喜欢把所有的原型属性和方法放在一个单独的对象字面量中，这样就会导致constructor属性与“实际”指向不符合例如：

   function Person(){

        }

        Person.prototype={

            say:function(msg){

                alert(msg);

            }

        }

        var person=new Person();

        person.say('hello');

        alert(person.constructor);  //function Object(){[native code]}

这个时候的指向就会变化因为字面量对象是Object的一个实例自然constructor属性就会执行Object为了纠正这个“错误”通常需要手动修改回来这就是源码，源码中constructor:jQuery的解释

selector属性

selector属性对于使用jquey作为js库来说没有用处它主要是用于开发基于jquery的插件或者改造使用，该属性会返回获取当前的jquery对象的选择器字符串，例如：

var obj=$('div a');

console.log(obj.selector);//'div a'

jquery属性

该属性返回当前使用的jQuery版本

console.log($('body').jquery);  //1.7.1

length属性

该属性返回jquery对象包含的元素个数例如：

console.log ( $('body') .length);  //

这4个属性源码如下：

    constructor: jQuery,

    // Start with an empty selector

    selector: "",

    // The current version of jQuery being used

    jquery: "1.7.1",

    // The default length of a jQuery object is 0

    length: 0,

size方法

// The number of elements contained in the matched element set

    size: function() {

        return this.length;

    },

该方法就是返回jquery对象的length属性两者而言推荐使用length属性，可以减少不必要的函数调用开销

toArray方法

toArray: function() {

        return slice.call( this, 0 );

    },

把jQuery集合中所有DOM元素恢复成一个数组。

alert($('li').toArray());
[<li id="foo">, <li id="bar">]

首先这里的slice方法在jQuery的构造函数里面已经被保留下来，就是Array的原型方法

// Save a reference to some core methods

87 toString = Object.prototype.toString,

88 hasOwn = Object.prototype.hasOwnProperty,

89 push = Array.prototype.push,

90 slice = Array.prototype.slice,

91 trim = String.prototype.trim,

92 indexOf = Array.prototype.indexOf,

通过call方法实现对象冒充，传入参数0表示不进行截取，由于此方法会返回一个 clean array 也就是纯数组这样就实现了从jquery对象到纯数组的转变，在以后遇到其他类数组形式时也可以采用此方法进行转换例如：

<!doctype html>

<html>

    <head>

        <meta charset='utf-8'/>

        <title>jQuery源码分析-原型属性和方法</title>

    </head>

    <body>

       <div>

       </div>

       <div></div>

    </body>

    <script src='jquery-1.7.1.js'></script>

    <script>

    var divs=document.getElementsByTagName('div');

    console.log(divs);  //[div, div]

    alert(divs instanceof Array);  //fasle

    alert(Array.prototype.slice.call(divs,0) instanceof Array); //true

    </script>

</html>

所以学习jqeury源码除了对使用jquery有帮助之外还能学到很多js的使用技巧

get方法

// Get the Nth element in the matched element set OR

// Get the whole matched element set as a clean array

    get: function( num ) {

        return num == null ?

            // Return a 'clean' array

            this.toArray() :

            // Return just the object

            ( num < 0 ? this[ this.length + num ] : this[ num ] );

    },

此方法的作品是从jquery对象的元素数组中找到其中的某一个并且返回js原声node元素对象而不是jquery对象，这是跟eq方法不同的地方 ，此方法接受一个参数如果参数不存则调用toArray方法返回包涵所有元素的数组，如果是大于0的数直接通过下下标的方式获取即可如果是负数则通过与长度相加获得我们写某些方法需要支持正负数下标的一个很好的方法。如果写的不是数字，或者超过当前对象所包含的元素长度会返回undefined.

jQuery原型属性constructor,selector,length,jquery和原型方法size,get,toArray源码分析的更多相关文章

  1. jQuery使用（）：Callbacks回调函数列表之异步编程(含源码分析)

    Callbacks的基本功能回调函数缓存与调用 特定需求模式的Callbacks Callbacks的模拟源码 一.Callbacks的基本功能回调函数缓存与调用 Callbacks即回调函数集合,在 ...

  2. jQuery使用（）：Deferred有状态的回调列表（含源码）

    deferred的功能及其使用 deferred的实现原理及模拟源码 一.deferred的功能及其使用 deferred的底层是基于callbacks实现的,建议再熟悉callbacks的内部机制前 ...

  3. jQuery原型方法first,last,eq,slice源码分析

    这4个方法中前3个方法很常用大家都见过,但是slice方法可能会以为是数组方法,其实slice也是jQuery的一个原型方法,只不过是底层方法是为其他方法服务的(更具体点是为eq方法服务的),首先还是 ...

  4. jQuery原型方法.pushStack源码分析

    这次分析的方法跟前面不同,虽然pushStack也是原型方法之一,但是我们几乎从不用在页面调用,在参考手册里面也没有这个方法的使用说明,但是这个方法还是非常重要的,在使用很多jQuery的其他方式都会 ...

  5. jQuery 源码分析(十三) 数据操作模块 DOM属性 详解

    jQuery的属性操作模块总共有4个部分,本篇说一下第2个部分:DOM属性部分,用于修改DOM元素的属性的(属性和特性是不一样的,一般将property翻译为属性,attribute翻译为特性) DO ...

  6. jQuery 2.0.3 源码分析core - 整体架构

    拜读一个开源框架,最想学到的就是设计的思想和实现的技巧. 废话不多说,jquery这么多年了分析都写烂了,老早以前就拜读过, 不过这几年都是做移动端,一直御用zepto, 最近抽出点时间把jquery ...

  7. jQuery.extend()方法和jQuery.fn.extend()方法源码分析

    这两个方法用的是相同的代码,一个用于给jQuery对象或者普通对象合并属性和方法一个是针对jQuery对象的实例,对于基本用法举几个例子: html代码如下: <!doctype html> ...

  8. jQuery源码分析系列 : 整体架构

    query这么多年了分析都写烂了,老早以前就拜读过, 不过这几年都是做移动端,一直御用zepto, 最近抽出点时间把jquery又给扫一遍 我也不会照本宣科的翻译源码,结合自己的实际经验一起拜读吧! ...

  9. jQuery-1.9.1源码分析系列（二）jQuery选择器

    1.选择器结构 jQuery的选择器根据源码可以分为几块 init: function( selector, context, rootjQuery ) { ... // HANDLE: $(&quo ...

随机推荐

  1. office 2010 安装教程

    Microsoft Office 2010,是微软推出的新一代办公软件,提供了一些更丰富和强大的新功能,开发代号为Office 14,实际是第12个发行版.该软件共有6个版本,分别是初级版.家庭及学生 ...

  2. Spring MVC 学习总结（七）——FreeMarker模板引擎与动态页面静态化

    模板引擎可以让程序实现界面与数据分离,业务代码与逻辑代码的分离,这就提升了开发效率,良好的设计也使得代码复用变得更加容易.一般的模板引擎都包含一个模板解析器和一套标记语言,好的模板引擎有简洁的语法规则 ...

  3. Java学习笔记之使用反射+泛型构建通用DAO

    PS:最近简单的学了学后台Servlet+JSP.也就只能学到这里了.没那么多精力去学SSH了,毕竟Android还有很多东西都没学完.. 学习内容: 1.如何使用反射+泛型构建通用DAO. 1.使用 ...

  4. Android上滑手势触发和不增加布局层级扩大点击区域

    最近项目中需要实现手势上滑或者点击滑出界面的效果,实现上是利用GestureDetector,然后在onFling中判断,但遇到一个问题:手势上滑是针对整个布局的,但如果有对单独的View设置点击监听 ...

  5. SQL Server安全（4/11）：许可（Permissions）

    在保密你的服务器和数据,防备当前复杂的攻击,SQL Server有你需要的一切.但在你能有效使用这些安全功能前,你需要理解你面对的威胁和一些基本的安全概念.这篇文章提供了基础,因此你可以对SQL Se ...

  6. 小meta的大作用

    meta是用来在HTML文档中模拟HTTP协议的响应头报文.meta 标签用于网页的<head>与</head>中,meta 标签的用处很多.meta 的属性有两种:name和 ...

  7. 实现jquery.ajax及原生的XMLHttpRequest跨域调用WCF服务的方法

    关于ajax跨域调用WCF服务的方法很多,经过我反复的代码测试,认为如下方法是最为简便的,当然也不能说别人的方法是错误的,下面就来上代码,WCF服务定义还是延用上次的,如: namespace Wcf ...

  8. 语义化HTML：ul、ol和dl

    一.语义化元素   1. ul标签 W3C草案: The ul element represents an unordered list of items; that is, a list in wh ...

  9. C#--参数数组

  10. C#基础02

    学习"传智播客视频基础"做的课堂笔记,您有幸读到,若其中有错误部分,请您务必指明.另外请给出您的宝贵建议,谢谢. **************基础知识************ 1: ...