jquery是如何架构的.
心里一直有个疑问.
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是如何架构的.的更多相关文章
- Jquery的基本架构
引入 以前学习原生JS然后切换到用JQ的时候总觉得很不习惯,甚至有点排斥用JQ.后来自己写项目一直到公司实习用JQ的这段时间,才深深感受到JQ的强大~JQ不仅做到兼容很多浏览器,还能很方便地使用JS ...
- 深入了解jQuery之整体架构
本文是在阅读了Aaron艾伦的jQuery源码解析(地址:http://www.imooc.com/learn/172)后的个人体会以及笔记.在这里感谢艾伦老师深入浅出的讲解!! 先来看看如何生成一个 ...
- jQuery 源码解析一:jQuery 类库整体架构设计解析
如果是做 web 的话,相信都要对 Dom 进行增删查改,那大家都或多或少接触到过 jQuery 类库,其最大特色就是强大的选择器,让开发者脱离原生 JS 一大堆 getElementById.get ...
- 浅谈 jQuery 核心架构设计
jQuery对于大家而言并不陌生,因此关于它是什么以及它的作用,在这里我就不多言了,而本篇文章的目的是想通过对源码简单的分析来讨论 jQuery 的核心架构设计,以及jQuery 是如何利用javas ...
- 【深入浅出jQuery】源码浅析--整体架构
最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...
- jQuery架构剖析
对于jQuery的整体架构,经典之处有三: 1.jQuery的无new构建 2.jQuery的链式调用 3.jQuery的插件接口 想必兄弟姐妹们也觉得这架构不错哈,但有时又畏惧去拜读大量的jQuer ...
- jQuery整体架构源码解析(转载)
jQuery整体架构源码解析 最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性, ...
- jQuery整体架构源码解析
最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...
- 【深入浅出jQuery】源码浅析--整体架构(转)
最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...
随机推荐
- 支持GPS的核心API
Android为GPS功能支持专门提供了一个LocationManager类,它的作用于TelephonyManager.AudioManager等服务类的作用相似,所有GPS定位相关的服务.对象都将 ...
- realestate.cei.gov.cn
using AnfleCrawler.Common; using System; using System.Collections.Concurrent; using System.Collectio ...
- 探索javascript----获得节点计算后样式
节点计算后样式是一个属性与属性值的值对对象: IE: node.currentStyle; 非IE: window.getComputedStyle(node,null); 兼容方式: func ...
- Hadoop 如何查看是否32位
1.从哪些地方可以识别hadoop是32位还是64位?2.hadoop本地库在什么位置? hadoop在安装的时候,我们需要知道hadoop版本是32位还是64位. hadoop官网本来提供的都是32 ...
- phonegap 框架详解
首先, 来看一下phonegap 初始化流程以及Native 与 JS 交互流程图. 说明:socket server模式下, phonegap.js 源码实现的采用1 毫秒执行一次XHR请求, 当 ...
- Request.Form()的使用
在CS文件中获得对应页面中的下拉框DropDownList_sitebranch值可以有以下几种方法获得: siteInfo.FZJGID = DropDownList_sitebra ...
- linux系统下php安装mbstring扩展的二种方法
.执行 复制代码代码如下: yum install php-mbstring 2. 修改php.ini (这一步非常重要, 部分lxadmin版本无法自动修改) 复制代码代码如下: echo ‘ext ...
- 在Mac OSX 10.10 上安装opencv
http://blog.csdn.net/wdkirchhoff/article/details/41910553 在Mac OSX上如果想使用OpenCV,可以通过自己手动编译源码的方式,但比较繁琐 ...
- chrome49 新特性 chrome.org转载
Transitioning from SPDY to HTTP/2 Thursday, February 11, 2016 Last year we announced our intent to e ...
- UVA 10173 (几何凸包)
判断矩形能包围点集的最小面积:凸包 #include <iostream> #include <cmath> #include <cstdio> #include ...