What does the dot after dollar sign mean in jQuery when declaring variables?
I see variables declared as:
$.root = $("body");and
$root = $("body");What is the difference between the two?
答案
Functions in JavaScript are objects. And like most objects in JavaScript, you can arbitrarily add properties to them. The $ function is just that, a function. So if you want to pop a property onto it and reference a jQuery collection, or reference, you can.
By adding the collection as a property on the $ function, it is one less variable in the current scope. You can examine the keys of the jQuery function before and after if you'd like to see how it affects the function's topography and (enumerable) property list:
Object.keys($);
// ["fn", "extend", "expando"..."parseHTML", "offset", "noConflict"]
$.root = $("body");
// [<body>]
Object.keys($);
// ["fn", "extend", "expando"..."parseHTML", "offset", "noConflict", "root"]实例
https://github.com/tkvw/jQuery-File-Upload/blob/master/js/jquery.fileupload-image-editor.js
$.widget('blueimp.fileupload', $.blueimp.fileupload, {})
这个widget的定义在https://github.com/tkvw/jQuery-File-Upload/blob/master/js/vendor/jquery.ui.widget.js#L57
$.widget = function( name, base, prototype ) {
var fullName, existingConstructor, constructor, basePrototype,
// proxiedPrototype allows the provided prototype to remain unmodified
// so that it can be used as a mixin for multiple widgets (#8876)
proxiedPrototype = {},
namespace = name.split( "." )[ 0 ];
name = name.split( "." )[ 1 ];
fullName = namespace + "-" + name;
if ( !prototype ) {
prototype = base;
base = $.Widget;
}
// create selector for plugin
$.expr[ ":" ][ fullName.toLowerCase() ] = function( elem ) {
return !!$.data( elem, fullName );
};
$[ namespace ] = $[ namespace ] || {};
existingConstructor = $[ namespace ][ name ];
constructor = $[ namespace ][ name ] = function( options, element ) {
// allow instantiation without "new" keyword
if ( !this._createWidget ) {
return new constructor( options, element );
}
// allow instantiation without initializing for simple inheritance
// must use "new" keyword (the code above always passes args)
if ( arguments.length ) {
this._createWidget( options, element );
}
};
// extend with the existing constructor to carry over any static properties
$.extend( constructor, existingConstructor, {
version: prototype.version,
// copy the object used to create the prototype in case we need to
// redefine the widget later
_proto: $.extend( {}, prototype ),
// track widgets that inherit from this widget in case this widget is
// redefined after a widget inherits from it
_childConstructors: []
});
basePrototype = new base();
// we need to make the options hash a property directly on the new instance
// otherwise we'll modify the options hash on the prototype that we're
// inheriting from
basePrototype.options = $.widget.extend( {}, basePrototype.options );
$.each( prototype, function( prop, value ) {
if ( !$.isFunction( value ) ) {
proxiedPrototype[ prop ] = value;
return;
}
proxiedPrototype[ prop ] = (function() {
var _super = function() {
return base.prototype[ prop ].apply( this, arguments );
},
_superApply = function( args ) {
return base.prototype[ prop ].apply( this, args );
};
return function() {
var __super = this._super,
__superApply = this._superApply,
returnValue;
this._super = _super;
this._superApply = _superApply;
returnValue = value.apply( this, arguments );
this._super = __super;
this._superApply = __superApply;
return returnValue;
};
})();
});
constructor.prototype = $.widget.extend( basePrototype, {
// TODO: remove support for widgetEventPrefix
// always use the name + a colon as the prefix, e.g., draggable:start
// don't prefix for widgets that aren't DOM-based
widgetEventPrefix: existingConstructor ? (basePrototype.widgetEventPrefix || name) : name
}, proxiedPrototype, {
constructor: constructor,
namespace: namespace,
widgetName: name,
widgetFullName: fullName
});
// If this widget is being redefined then we need to find all widgets that
// are inheriting from it and redefine all of them so that they inherit from
// the new version of this widget. We're essentially trying to replace one
// level in the prototype chain.
if ( existingConstructor ) {
$.each( existingConstructor._childConstructors, function( i, child ) {
var childPrototype = child.prototype;
// redefine the child widget using the same prototype that was
// originally used, but inherit from the new version of the base
$.widget( childPrototype.namespace + "." + childPrototype.widgetName, constructor, child._proto );
});
// remove the list of existing child constructors from the old constructor
// so the old child constructors can be garbage collected
delete existingConstructor._childConstructors;
} else {
base._childConstructors.push( constructor );
}
$.widget.bridge( name, constructor );
return constructor;
};
What does the dot after dollar sign mean in jQuery when declaring variables?的更多相关文章
- Fedora 24中的日志管理
Introduction Log files are files that contain messages about the system, including the kernel, servi ...
- Markdown使用指南（2）—— 键盘符号说明
符号 中文名 英文名 ! 叹号 exclamation mark/bang ? 问号 question mark , 逗号 comma . 点号 dot/period/point : 冒号 colon ...
- HTML转义字符大全
ISO Latin-1字符集: — 制表符Horizontal tab — 换行Line feed — 回车Carriage Return — Space ! ! — 惊叹号Exclamati ...
- 【转】HTML转义字符大全
ISO Latin-1字符集: — 制表符Horizontal tab — 换行Line feed — 回车Carriage Return — Space ! ! — 惊叹号Exclamati ...
- Linux命令中特殊符号
转自:http://blog.chinaunix.net/uid-16946891-id-5088144.html 在shell中常用的特殊符号罗列如下:# ; ;; . , / \ 'strin ...
- (转载)Bash 中的特殊字符大全
转自:https://linux.cn/article-5657-1.html Linux下无论如何都是要用到shell命令的,在Shell的实际使用中,有编程经验的很容易上手,但稍微有难度的是she ...
- linux特殊符号大全
# ; ;; . , / \ 'string'| ! $ ${} $? $$ $* " ...
- HTML语言特殊字符对照表(ISO Latin-1字符集)
HTML字符实体(Character Entities) 有些字符在HTML里有特别的含义,比如小于号<就表示HTML Tag的开始,这个小于号是不显示在我们最终看到的网页里的.那如果我们希望在 ...
- 爬虫技术 -- 基础学习（一）HTML规范化（附特殊字符编码表）
最近在做网页信息提取这方面的,由于没接触过这系列的知识点,所以逛博客,看文档~~看着finallyly大神的博文和文档,边看边学习边总结~~ 对网站页面进行信息提取,需要进行页面解析,解析的方法有以下 ...
随机推荐
- C#基础篇之C#和 .Net框架的概念和运行原理
一.微软平台的发展史 二..Net框架包含的东西 1.名词解释 BCL:基类库(Base Class Library)系统和底层提供的最基本的类库 CLR:公共语言运行时(Common Languag ...
- 题解 AT2684 【K-City】
此题这么水,竟然发题解的这么少. 本蒟蒻也来发一篇QwQ. 题目中所谓“四条街包围一个街区”其实就是两条街之间夹一个街区而已: n条街有几条两两相邻呢?答案是n-1条: m条街有几条两两相邻呢?答案是 ...
- Scrapy 教程(七)-架构与中间件
Scrapy 使用 Twisted 这个异步框架来处理网络通信,架构清晰,并且包含了各种中间件接口,可以灵活的完成各种需求. Scrapy 架构 其实之前的教程都有涉及,这里再做个系统介绍 Engin ...
- CollectionView刷新问题，以及定时器与控制器的销毁问题
1.CollectionView的刷新必须首先保证CollectionView有高度 注意事项:在cell中嵌套CollectionView,如果使用的是AutoLayout的话,一定要注意保证Col ...
- Linux日常之Ubuntu系统中sendmail的安装、配置、发送邮件
一. 安装 1. sendmail必须先要安装两个包 (1)sudo apt-get install sendmail (2)sudo apt-get install sendmail-cf 2. u ...
- redis 五大类型 、持久化方式以及主从(哨兵模式)
一.redis 五大类型: redis 键 keys * exists key的名字,判断某个key 是否存在 move key db 当前数据库就没有了,被移除了 ttl key 查看还有多少秒过期 ...
- PHP程序员要看的书单
想提升自己,还得多看书!多看书!多看书! 下面是我收集到的一些PHP程序员应该看得书单及在线教程,自己也没有全部看完.共勉吧! Github地址:https://github.com/52fhy/ph ...
- bzoj2802 [Poi2012]Warehouse Store 贪心+堆
题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=2802 题解 我一开始想到了一个比较麻烦的做法. 把每一天按照 \(b_i\) 从小到大排序,\ ...
- BSOJ5467 [CSPX2017#3]整数 莫比乌斯反演+杜教筛
题意简述 给你两个整数\(n\),\(k\),让你求出这个式子 \[ \sum_{a_1=1}^n \sum_{a_2=a_1}^n \sum_{a_3=a_2}^n \cdots \sum_{a_k ...
- Spring快速复习和总结
IOC:管理和启动的java类的权力反转到了Spring容器了: 具体说明:Spring容器将配置好的bean放到容器(通过beanfactory,这是一个接口)中,并开始启动(反射)和调用(反射)和 ...