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 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...
随机推荐
- 反向Ajax,实现服务器向客户端推送消息
反向Ajax的基本概念是客户端不必从服务器获取信息,服务器会把相关信息直接推送到客户端.这样做的目的是解决Ajax传统Web模型所带来的一个限制:实时信息很难从技术上解决.原因是,客户端必须联系服务器 ...
- C++ explicit关键字应用方法详解
C++编程语言中有很多比较重要的关键字在实际编程中起着非常重要的作用.我们今天为大家介绍的C++ explicit关键字就是其中一个应用比较频繁的关键字.下面就让我们一起来看看这方面的知识吧. C++ ...
- 记录一次fat32格式U盘不识别问题
升级了4.1.15内核发现U盘不识别了,考虑到内核编译前的配置是通过localmodconfig完成的,所以大略是缺模块导致. 于是开始查配置,USB控制器,EHCI,mass storeage de ...
- asp.net生成缩略图
/// <summary> /// 生成缩略图 /// </summary> /// <param name="orginalImagePat"> ...
- RSA IOS和Java
整了三天 终于可以相互加密解密了,今天我给大家讲讲我遇到的大坑. 这篇文章只是做一个整理,帮大家理清一下步骤的而已 在ios端做证书 来实现我们和java的交流 需要4个文件. 一.首先,打开Term ...
- get到的新技能
1.重拾选择器 (一)类选择器与id选择器的区别 W3C标准这样规定的,在同一个页面内,不允许有相同名字的id对象出现,但是允许相同名字的class. 这样,一般网站分为头,体,脚部分,因为考虑到它们 ...
- JS运动基础(三) 弹性运动
加减速运动速度不断增加或减少速度减小到负值,会向反方向运动 弹性运动在目标点左边,加速:在目标点右边,减速根据距离,计算加速度 带摩擦力的弹性运动弹性运动+摩擦力 弹性:速度 += (目标点 - 当前 ...
- Hadoop ecosystem notes Outline - TODO
Motivation Sometimes I fell like giving up, then I remember I have a lot of motherfuckers to prove w ...
- 通俗理解隐马尔科夫模型HMM(转载)
作者:Yang Eninala 链接:https://www.zhihu.com/question/20962240/answer/33438846 来源:知乎 著作权归作者所有,转载请联系作者获得授 ...
- 移动平台对 meta 标签的定义
一.meta 标签分两大部分:HTTP 标题信息(http-equiv)和页面描述信息(name). 1.http-equiv 属性的 Content-Type 值(显示字符集的设定) 说明:设定页面 ...