jQuery源代码学习笔记_工具函数_noop/error/now/trim

jquery提供了一系列的工具函数,用于支持其运行,今天主要分析noop/error/now/trim这4个函数:

1.noop

//返回一个空函数
function noop() {
}

noop这个函数的功能就是什么也不做,方便在全局使用一个空函数,减少内存开销。


2.error

function error(msg) {
throw new Error(msg);
}

用于统一抛出异常,可以减少代码中使用throw/new,降低使用要求。

JS的异常处理

TODO


3.now

function now() {
return +(new Date());
}

用于返回当前的时间戳。注意返回结果使用"+"转换成数字(Number)

JS基础类型的优雅类型转换

在JS中基本的值类型Boolean、Number和String可以通过调用其构造函数的方式来进行相互转换。eg: var num = Number(str);但是这样的写法无疑不够优雅,对于这三者之间的类型转换,我们可以如下处理。

Boolean、String和Date转换成数字:

不能使用parseInt 和parseFloat两个函数来进行转换,这两个函数会转换字符串开头的有效数字。优雅的写法应当是使用"+"号,同时在数学运算中"-"、"*"、"/"和"%"都可以用于进行数字转换,如果原对象不能转换成数字,返回NaN。

Number和Boolean转换成String:

优雅的写法应当是写成'' + 变量。

Number和String转换成Boolean:

优雅的写法是!!变量,如果本来就取反义,那就写一个!。

前几日在看fex-team的源代码,函数里面用到的类型转换写法不太优雅,下面是其中截取的代码片段:

分析:

  1. count>=max(红色框)用到两次,是不是应该变量缓存
  2. 最后一句return(红色下划线)有点复杂化了,因为count>=max的结果就是boolean类型,而采用三元运算符方法和count>=max的结果是相反的,那么直接可以用!(非)即可。

针对上面延伸理解JS优雅的类型转换规则第3点:我觉得比较优雅的写法应该是:

var a = count >= max;
if (a && flag) {
flag = false;
this.trigger('error', 'Q_EXCEED_NUM_LIMIT', max, file);
setTimeout(function () {
flag = true;
},
1);
} return !a;
});

再看文中的下面一段代码,相比之前已经很好了(蓝色框是相对上面改善的改变体现)



至少这里已经把变量缓存了,同样道理,我觉得比较优雅的写法应该是:!invalid代替原来的三元运算符

uploader.on('beforeFileQueued', function (file) {
var invalid = count + file.size > max; if (invalid && flag) {
flag = false;
this.trigger('error', 'Q_EXCEED_SIZE_LIMIT', max, file);
setTimeout(function () {
flag = true;
},
1);
} return !invalid;
});

4.trim

var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g; //正则表达式要理解,BOM就是字节FEFF。
function trim(text) {
return text == null ? "" : (text + "").replace(rtrim, "");
}

用于去除字符串两边的空白字符和BOM

UTF-8 BOM是什么?

我们看到百度百科里面关于BOM的介绍如下:

如果您在修改任何PHP文件後发生:

  • 不能登入或者不能登出;
  • 页顶出现一条空白;
  • 页顶出现错误警告;
  • 其它不正常的情况。

则多半是编辑器的问题,本程序采用UTF-8编码。现在几乎所有的文本编辑软件都可以显示并编辑UTF-8编码的文件。类似WINDOWS自带的记事本等软件,在保存一个以UTF-8编码的文件时,会在文件开始的地方插入三个不可见的字符(0xEF 0xBB 0xBF,即BOM,转换成Unicode为FEFF)。它是一串隐藏的字符,用于让记事本等编辑器识别这个文件是否以UTF-8编码。对于一般的文件,这样并不会产生什么麻烦。但对于 PHP来说,BOM是个大麻烦。

PHP并不会忽略BOM,所以在读取、包含或者引用这些文件时,会把BOM作为该文件开头正文的一部分。根据嵌入式语言的特点,这串字符将被直接执行(显示)出来。由此造成即使页面的 top padding 设置为0,也无法让整个网页紧贴浏览器顶部,因为在html一开头有这3个字符呢!

总结起来就是:linux的UTF-8是没有前缀的,而Windows默认使用ASCII码,所以UTF-8文件前面会有一个前缀FEFF,三个字节来标注自己是UTF-8文件,而浏览器大多不会对Windows特殊优化,所以会认为这三个字节是有效内容,浏览器很多时候会使用GBK或者Unicode这样的双字节编码,在前面加上奇数个字节会造成全文不可读,所以很多时候,我们要求网页不能有BOM。

一言以蔽之:BOM只有Windows系统认识,浏览器不认识。

jQuery源代码学习笔记_工具函数_noop/error/now/trim的更多相关文章

  1. jQuery源代码学习笔记_01

    如何获取jQuery源代码 1.可以从GitHub上下载到没有合并和压缩的源代码 2.如果要查看兼容IE6-8的版本,请选择1.x-master分支 3.可以使用git clone也可以使用downl ...

  2. jQuery源代码学习笔记:jQuery.fn.init(selector,context,rootjQuery)代码具体解释

    3.1 源代码 init: function( selector, context, rootjQuery ) { var match, elem, ret, doc; // Handle $(&qu ...

  3. jQuery源代码学习笔记:构造jQuery对象

    2.1源代码结构: (function( window, undefined ) { var jQuery = (function() { // 构建jQuery对象 var jQuery = fun ...

  4. jQuery源代码学习笔记_bind

    一般想到JS的兼容性问题的时候,首先会想到addEventListener与attachEvent这一对冤家,那么我们先来看看它们有什么兼容性问题 addEventListener与attachEve ...

  5. jQuery源代码学习_工具函数_type

    jquery源代码学习_工具函数_type jquery里面有一个很重要的工具函数,$.type函数用来判断类型,今天写这篇文章,是来回顾type函数的设计思想,深入理解. 首先来看一下最终结果: 上 ...

  6. OpenCV 学习笔记03 findContours函数

    opencv-python   4.0.1 1 函数释义 词义:发现轮廓! 从二进制图像中查找轮廓(Finds contours in a binary image):轮廓是形状分析和物体检测和识别的 ...

  7. canvas学习笔记、小函数整理

    http://bbs.csdn.net/topics/391493648 canvas实例分享 2016-3-16 http://bbs.csdn.net/topics/390582151 html5 ...

  8. [Java] LinkedList / Queue - 源代码学习笔记

    简单地画了下 LinkedList 的继承关系,如下图.只是画了关注的部分,并不是完整的关系图.本博文涉及的是 Queue, Deque, LinkedList 的源代码阅读笔记.关于 List 接口 ...

  9. IOS学习笔记07---C语言函数-printf函数

    IOS学习笔记07---C语言函数-printf函数 0 7.C语言5-printf函数 ------------------------- ----------------------------- ...

随机推荐

  1. Linux下管理员强行踢出用户的命令使用方法

    Linux强制踢出用户命令: 一.输入w命令查看已登录用户信息 [root@KW_S01_192.168.1.106_A ~]# w 19:22:31 up  2:11,  3 users,  loa ...

  2. java java 内部类

    java 内部类 一.java内部类: java内部类分为: 成员内部类.静态嵌套类.方法内部类.匿名内部类 . 内部类的共性: (1).内部类仍然是一个独立的类,在编译之后内部类会被编译成独立的.c ...

  3. java 学习第二篇关系运算符和布尔值

    关系运算符,顾名思义.用来看什么关系.(也就是用来比较) 看下表 JAVA 关系运算符 a=6,b=5 关系运算符 举例 值 解释 > a>b true a大于b < a<b ...

  4. Oracle SQL判断字符串是否在目标字符串中的函数

    转自:http://dacoolbaby.iteye.com/blog/1772156 根据需求,写了一段方法. 用于识别以下的情况: 判断 字符串A  在用逗号分隔的字符串B中是否存在 如: v_s ...

  5. uint8_t / uint16_t / uint32_t /uint64_t 是什么数据类型

    在nesc的代码中,你会看到很多你不认识的数据类型,比如uint8_t等.咋一看,好像是个新的数据类型,不过C语言(nesc是C的扩展)里面好像没有这种数据类型啊!怎么又是u又是_t的?很多人有这样的 ...

  6. vue_cli下开发一个简单的模块权限系统之展现数据

    这个页面是用户列表:userList就是第二张截图中的data里面的userList vue中只要改变存放数据的载体就会实现页面改变,mounted的意思是页面加载时执行这里面的函数,我们需要在页面加 ...

  7. dedecms图片绝对路径(附件绑定域名)的设置方法

    dedecms默认的附件路径使用的是相对路径,但是在实际应用,我们可能会需要让文章的图片附件显示绝对地址,解决方案如下: 1.打开include目录下的文件extend.func.php,添加函数re ...

  8. Oracle恢复表数据

    Oracle恢复数据 在oracle 10g以及之后的版本,提供了回收站的机制,为了防止误操作将表数据清空而有回收机制. 换句话说,我们删除的表不会立马消失,而是进入回收站.下面我们可以查看回收站 查 ...

  9. Python利用百度地图api批量获取地址经纬度

    1.pip安装xlrd,xlwt,requests模块. 2.在工程目录处放置地点Excel文件. python2.7.13代码: #coding:utf-8 import xlrd import x ...

  10. 移动app整合个推进行消息推送

    首先前端代码写好之后进行发行打包: 然后再进行发行打包: 然后登录个推官网: 测试: 点击推送,在手机端就可以获取到信息了. java代码测试: package com.cxy.bean; impor ...