心里一直有个疑问.

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. PHP投票系统

    1.投票页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  2. cocos2d-x 中的坐标系

    cocos2d-x 中的坐标系是笛卡尔坐标系,向右为 x 轴正方向,向上为 y 轴正方向,以像素为单位 原点在屏幕左下角的坐标系叫世界坐标系,是整个游戏中的根基,直接添加到场景中的节点,设置的位置都是 ...

  3. JVM-程序编译与代码晚期(运行期)优化

    晚期(运行期)优化 1.为了提高热点代码的执行效率,在运行时,虚拟机将会把这些代码编译成与本地平台相关的机器码,并进行各种层次的优化,完成这个任务的编译器称为即时编译器(Just In Time,JI ...

  4. C# List和String互相转换

    List转字符串,用逗号隔开 List<string> list = new List<string>();list.Add("a");list.Add(& ...

  5. linux后台运行和关闭、查看后台任务(转)

    转自:http://www.cnblogs.com/kaituorensheng/p/3980334.html fg.bg.jobs.&.nohup.ctrl+z.ctrl+c 命令 一.&a ...

  6. SAP web 开发 (第二篇 bsp 开发 mvc模式 Part1 )

    Model-View-Controller 简称MVC. 简单的说就是把数据处理,显示,页面事件及处理过程分离开来,企业应用多数都采用这种方式,多层架构的优缺点不再多言,google一下啥都知道. 在 ...

  7. docker 源码分析 二(基于1.8.2版本),docker client与daemon交互

    (2) 那我们通过docker客户端发送一个命令,docker是怎样接收到并处理的呢,我们就举个例子来看一下,比如docker pull 命令: 我们回到 docker/docker.go 中,在上一 ...

  8. UML学习笔记1

    UML概述:是一种为面向对象软件设计提供的建模语言. 构成:事物things关系relationshs图diagrams UML事物:构件事物 行为事物 分组事物 注释事物 UML关系:依赖depen ...

  9. HDU 4352 XHXJ's LIS

    奇妙的题. 你先得会另外一个nlogn的LIS算法.(我一直只会BIT.....) 然后维护下每个数码作为结尾出现过没有就完了. #include<iostream> #include&l ...

  10. 如何把TOMCAT 添加到服务中自动启动

    1.配置系统参数: JAVA_HOME:C:\Program Files\Java\jdk1.8.0_51   //本机Jdk的安装路径,已配置相关Java应用的无需再配置. CATALINA_HOM ...