jQuery静态方法noop,camelCase,nodeName,trim使用和源码分析
noop方法
jQuery.noop()函数是一个空函数,它什么也不做。
当某些时候你需要传入函数参数,而且希望它什么也不做的时候,你可以使用该函数,也无需再新建一个空的函数。
示例:
// 传入一个空函数作为参数,返回一个空数组
// 空函数的返回值为undefined,而null或undefined值会被$.map()忽略掉。
var result = $.map( [1, 2, 3], $.noop );
document.writeln( result.length ); //
源码分析:
noop: function() {},
camelCase方法
jQuery.camelCase函数的功能就是将形如background-color转化为驼峰表示法:backgroundColor。
此函数在jQuery的data函数,以及涉及到css的诸多函数中都有用到。
示例:
var cssStr='background-color';
alert($.camelCase(cssStr)); //backgroundColor
源码分析:
// Convert dashed to camelCase; used by the css and data modules
// Microsoft forgot to hump their vendor prefix (#9572)
camelCase: function( string ) {
return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase );
},
该方法的使用主要依赖以下3个正则表达式
// Matches dashed string for camelizing
rdashAlpha = /-([a-z]|[0-9])/ig,
rmsPrefix = /^-ms-/, // Used by jQuery.camelCase as callback to replace()
fcamelCase = function( all, letter ) {
return ( letter + "" ).toUpperCase();
},
正则 rdashAlpha 用于匹配字符串中连字符“ -”和其后的第一个字母或数字。如果连字符“ -”后是字母,则匹配部分会被替换为对应的大写字母;如果连字符“ -”后是数字,则会删掉连字符“-” ,保留数字
正则 rmsPrefix 用于匹配字符串中前缀“-ms-” ,匹配部分会被替换为“ms-” 。这么做是因为在 IE 中,连字符式的样式名前缀“-ms-”对应小写的“ms” ,而不是驼峰式的“ Ms” 。例如, “ -ms-transform”对应“ msTransform”而不是“ MsTransform” 。在 IE 以外的浏览器中,连字符式的样式名则可以正确地转换为驼峰式,例如, “ -moz-transform”对应“MozTransform”。
函数 fcamelCase() 负责把连字符后的字母转换为大写并返回
在方法 jQuery.camelCase() 中,先用正则 rmsPrefix 匹配前缀“ -ms-” ,如果有则修正为“ms-” ;
然后用正则 rdashAlpha 匹配连字符“-”和其后的第一个字母或数字,并用字符串方法 replace() 和函数 fcamelCase() 把匹配部分替换为对应的大写字母或数字
nodeName方法
jQuery.nodeName( elem, name ) 用于检查 DOM 元素的节点名称(即属性 nodeName)与指定的值是否相等,检查时忽略大小写
示例:
alert($.nodeName(document.getElementsByTagName('div')[0],'div'));//true
源码分析:
nodeName: function( elem, name ) {
return elem.nodeName && elem.nodeName.toUpperCase() === name.toUpperCase();
},
接收两个参数,一个是dom元素,一个是待检测的节点名称,直接返回这两个参数转化为大写之后作全等比较的结果,当然在比较之前首先要保证elem必须是dom节点
trim方法
jQuery.trim( str ) 用于移除字符串开头和结尾的空白符如果传入的参数是 null 或undefined,则返回空字符串;如果传入的参数是对象,则先获取对象的字符串表示,然后移除开头和结尾的空白符,并返回
示例:
var str=' abcdefg ';
alert(str.indexOf(' ')); //
alert($.trim(str).indexOf(' ')); //-1
源码分析:
// Use native String.trim function wherever possible
trim: trim ?
function( text ) {
return text == null ?
"" :
trim.call( text );
} : // Otherwise use our own trimming functionality
function( text ) {
return text == null ?
"" :
text.toString().replace( trimLeft, "" ).replace( trimRight, "" );
},
trim方法是ECMA5新增的方法,对于支持此方法的浏览器而言可以直接调用,如果传入的是null会返回一个空字符串,对于不支持此trim方法的浏览器来说使用正则匹配
// IE doesn't match non-breaking spaces with \s
if ( rnotwhite.test( "\xA0" ) ) {
trimLeft = /^[\s\xA0]+/;
trimRight = /[\s\xA0]+$/;
}
在 IE 9 以下的浏览器中,\s 不匹配不间断空格 \xA0,需要为正则trimLeft 和 trimRight 加上“\xA0”
先调用toString方法说明是可以传入对象或者数组的,如果是对象或者数组就用他们的字符串形式来操作,分别匹配到左右空格之后替换为空字符串(不是含有空格的字符串)
jQuery静态方法noop,camelCase,nodeName,trim使用和源码分析的更多相关文章
- jQuery静态方法isFunction,isArray,isWindow,isNumeric使用和源码分析
上一篇随笔中总结了js数据类型检测的几个方法和jQuery的工具方法type方法,本篇要分析几个方法都依赖type方法,所以不了解type方法的请先参看http://www.cnblogs.com/y ...
- Quartz学习--二 Hello Quartz! 和源码分析
Quartz学习--二 Hello Quartz! 和源码分析 三. Hello Quartz! 我会跟着 第一章 6.2 的图来 进行同步代码编写 简单入门示例: 创建一个新的java普通工程 ...
- Android Debuggerd 简要介绍和源码分析(转载)
转载: http://dylangao.com/2014/05/16/android-debuggerd-%E7%AE%80%E8%A6%81%E4%BB%8B%E7%BB%8D%E5%92%8C%E ...
- Java并发编程(七)ConcurrentLinkedQueue的实现原理和源码分析
相关文章 Java并发编程(一)线程定义.状态和属性 Java并发编程(二)同步 Java并发编程(三)volatile域 Java并发编程(四)Java内存模型 Java并发编程(五)Concurr ...
- Kubernetes Job Controller 原理和源码分析(一)
概述什么是 JobJob 入门示例Job 的 specPod Template并发问题其他属性 概述 Job 是主要的 Kubernetes 原生 Workload 资源之一,是在 Kubernete ...
- Kubernetes Job Controller 原理和源码分析(二)
概述程序入口Job controller 的创建Controller 对象NewController()podControlEventHandlerJob AddFunc DeleteFuncJob ...
- Kubernetes Job Controller 原理和源码分析(三)
概述Job controller 的启动processNextWorkItem()核心调谐逻辑入口 - syncJob()Pod 数量管理 - manageJob()小结 概述 源码版本:kubern ...
- jQuery静态方法inArray,grep,merge,makeArray方法使用和源码分析
inArray方法 确定第一个参数在数组中的位置,从0开始计数(如果没有找到则返回 -1 ). 示例: var arr = [ 4, "Pete", 8, "John&q ...
- jQuery静态方法globalEval使用和源码分析
Eval函数大家都很熟悉,但是globalEval方法却很少使用,大多数参考手册也没有相关api,下面就对其用法和源码相应介绍: jQuery.globalEval()函数用于全局性地执行一段Java ...
随机推荐
- 【深入浅出Linux网络编程】 "开篇 -- 知其然,知其所以然"
[深入浅出Linux网络编程]是一个连载博客,内容源于本人的工作经验,旨在给读者提供靠谱高效的学习途径,不必在零散的互联网资源中浪费精力,快速的掌握Linux网络编程. 连载包含4篇,会陆续编写发出, ...
- bootstrap-modal 学习笔记 源码分析
Bootstrap是Twitter推出的一个开源的用于前端开发的工具包,怎么用直接官网 http://twitter.github.io/bootstrap/ 我博客的定位就是把这些年看过的源码给慢慢 ...
- 编译opengl编程指南第八版示例代码通过
最近在编译opengl编程指南第八版的示例代码,如下 #include <iostream> #include "vgl.h" #include "LoadS ...
- MVVM框架下,WPF实现Datagrid里的全选和选择
最近的一个项目是用MVVM实现,在实现功能的时候,就会有一些东西,和以前有很大的区别,项目中就用到了常用的序号,就是在Datagrid里的一个字段,用checkbox来实现. 既然是MVVM,就要用到 ...
- 斐讯Fir302b救砖教程
首先本人是路由器小白,不算是硬件改装高手,昨天收到了微信活动中的斐讯Fir302b,大概当时得奖的有300人,所以最近肯定很大一批朋友手里有这样的一款路由. 上网查了一下,此款路由可以刷基于tomat ...
- Vim 快速上手
1.vi的基本概念 基本上vi可以分为三种状态,分别是 命令模式(command mode) 插入模式(Insert mode) 底行模式(last line mode) 1) 命令行模式comman ...
- 部署Icinga-php4
关于Icinga-php4的文档信息及下载地址,可参考:http://icinga-cn.sourceforge.net/ 我这里使用的是icinga-pnp4-cn-1.12.2.tar.xz. 因 ...
- 如何部署Icinga服务端
Icinga是Nagios的一个变种,配置,使用方式几乎一样,而且完全兼容Nagios的插件.所以下面的部署方案对Nagios同样使用. 它还推出了两个中文版本,icinga-cn原版和icinga- ...
- CSS3的flex布局
flex的一些属性 CSS3中引入了另一种框--flexbox,flexbox有一些block和inline不同的性质,比如: 自适应子元素(flex item,又称伸缩项目)的宽度 伸缩项目的flo ...
- Linux process vs thread
Linux process vs thread Question I have a query related to the implementation of threads in Linux. L ...