心里一直有个疑问.

jquery是如何做到一个jQuery即可以当方法用比如$();又可以当对象用$.extend();

现在总结一下吧

function method(){}
var m=new method();
m.version="123";
console.log(m.version) // 打印出123

这段代码表示申明一个对象后,还可以继续为该对象添加属性或方法.

继续往下看:

var m=function(){};
m.version="123";

这个地方仍然可以打印出123;

可是这个地方并没有申明对象,只不过是定义了一个变量方法名而已.

核心一:其实变量方法名也是一个对象

比如上面的代码本质上是这样的

var m=new Function();
m.version="123";

这个就是jQuery为什么可以直接作为对象使用的原理.

接着看为什么jQuery可以直接做方法用.

核心二:如果构造函数有返回值,运算符new所创建的对象会被丢弃,返回值作为new表达式的值.

function Method(name,age){
var obj={
name:name,
age:age
};
  this.name="我来自本身";
return obj;
}
var objM=new Method("思思博士",26);
console.log(objM);//打印出obj对象,而没有打印"我来自本身"

有了上面的两个核心理论.就可以构建jQuery了.

(function(window,undefined){
var jQuery=(function(){
    //核心理论二
var jQuery=function(name,age){
return new jQuery.prototype.init(name,age);
};
jQuery.prototype={
init:function(name,age){
return [name,age];
}
};
jQuery.prototype.init.prototype=jQuery.prototype;
    //核心理论一.
jQuery.version="1.7.2";
return jQuery;
})();
window.$=window.jQuery=jQuery;
})(window); console.log(jQuery.version);
console.log(jQuery("思思博士",25))

上面的代码模仿的就是jQuery即做方法用,又当对象用的基本理论.

jquery是如何架构的.的更多相关文章

  1. Jquery的基本架构

    引入  以前学习原生JS然后切换到用JQ的时候总觉得很不习惯,甚至有点排斥用JQ.后来自己写项目一直到公司实习用JQ的这段时间,才深深感受到JQ的强大~JQ不仅做到兼容很多浏览器,还能很方便地使用JS ...

  2. 深入了解jQuery之整体架构

    本文是在阅读了Aaron艾伦的jQuery源码解析(地址:http://www.imooc.com/learn/172)后的个人体会以及笔记.在这里感谢艾伦老师深入浅出的讲解!! 先来看看如何生成一个 ...

  3. jQuery 源码解析一:jQuery 类库整体架构设计解析

    如果是做 web 的话,相信都要对 Dom 进行增删查改,那大家都或多或少接触到过 jQuery 类库,其最大特色就是强大的选择器,让开发者脱离原生 JS 一大堆 getElementById.get ...

  4. 浅谈 jQuery 核心架构设计

    jQuery对于大家而言并不陌生,因此关于它是什么以及它的作用,在这里我就不多言了,而本篇文章的目的是想通过对源码简单的分析来讨论 jQuery 的核心架构设计,以及jQuery 是如何利用javas ...

  5. 【深入浅出jQuery】源码浅析--整体架构

    最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...

  6. jQuery架构剖析

    对于jQuery的整体架构,经典之处有三: 1.jQuery的无new构建 2.jQuery的链式调用 3.jQuery的插件接口 想必兄弟姐妹们也觉得这架构不错哈,但有时又畏惧去拜读大量的jQuer ...

  7. jQuery整体架构源码解析(转载)

    jQuery整体架构源码解析 最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性, ...

  8. jQuery整体架构源码解析

    最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...

  9. 【深入浅出jQuery】源码浅析--整体架构(转)

    最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...

随机推荐

  1. C#将字符串中间部分替换为*号

    在做商城评价的时候,为了显示评价的真实性同时保护客户的隐私,我们将用户昵称中间部分替换为*(如果是单字则替换为* 两个字符串第二位字符串替换为*)如下图 方法如下: /// <summary&g ...

  2. 【仿真】【modelsim】:verilog功能仿真流程

    一.编写verilog源文件,在diamond中编译.编写testbench文件.在diamond设置中将仿真工具设置为modelsim,运行仿真向导 二.自动进入modelsim, 编译全部 运行仿 ...

  3. Rhel6-pacemaker+drbd配置文档

    系统环境: rhel6 x86_64 iptables and selinux disabled 主机: 192.168.122.119 server19.example.com 192.168.12 ...

  4. Jmeter—5 关联 响应数据传递-正则表达式提取器

    在测试过程中,遇到一个问题:用户登录成功后服务器会返回一个登录凭证,之后所有的操作都需要带上此凭证.我们怎么获取登录凭证并传递给后续的操作? Jmeter提供了正则表达式提取器,用变量提取参数,后续通 ...

  5. sql整型字段模糊查询

    select count(*) cnt from vhuiy where CAST(id as text) like'%12%'--id为int类型 更详细的链接:http://www.studyof ...

  6. Allegro建立引脚封装概念名词梳理

    首先感谢于博士的60讲的Cadence教学视频,老师讲的还是很有耐心,很细致,谢谢! 目前还只是看到建立PCB封装这一块,正好手头上有个案子在做,边做边学的进度还是要好很多.以前的工作对原理图这一块的 ...

  7. Java网络应用编程

    1,网络连接 (1)用户向服务器发送请求(Socket); (2)服务器向用户发送信息(ServerSocket),一直监听的话用.accept(); 2,信息发送与接收 (1)客户向服务器端发送信息 ...

  8. 在Mac OSX 10.10 上安装opencv

    http://blog.csdn.net/wdkirchhoff/article/details/41910553 在Mac OSX上如果想使用OpenCV,可以通过自己手动编译源码的方式,但比较繁琐 ...

  9. linux命令:less

    1.命令介绍: less用来逐页输出文件内容,less相比more功能更加强大,less可以前后翻页,前后搜索. 2.命令格式: less [选项] 文件 3.命令参数: -b <缓冲区大小&g ...

  10. watir学习系列--Watir API介绍

    文本框:          <INPUT id="email" name="_fmu.u._0.e" value="" />   ...