jquery源码中有很多精妙的实现,对于我们每天都在使用的东西,一定要知其原理,如果遇到不能使用jquery环境,也能自己封装原生的代码实现。

1.检测类型

众所周知typeof 不能用来检测数据,会返回object,而instanceof和constructor在使用跨页面调用时(iframe子页面调用父页面),两个页面的构造器函数引用不相等会判断不准确。

而Object对象原型中的toString方法隐藏了这个实现,把它挖掘出来:

Object.prototype.toString.call(obj).replace(/^\[object (.+)\]$/, '$1').toLowerCase();

2.extend扩展对象

最简单的是用for..in遍历一下A对象,赋值给B对象,不过jquery的extend可以传无限多个参数进行合并,自然是用到了arguments对象

var extend = function(out) {

out = out || {};

for (var i = 1; i < arguments.length; i++) {
if (!arguments[i])
continue;

for (var key in arguments[i]) {
if (arguments[i].hasOwnProperty(key))
out[key] = arguments[i][key];
}
}

return out;
};

extend({}, objA, objB);

3.数组的一些工具方法

1)makeArray :可以用Array.prototype.concat.call(obj);

2) each:可以用es5的forEach,兼容低IE就自己for循环了

3) grep:用es5的filter实现

4) inArray:用es5的indexOf实现

jQuery原理系列-工具函数的更多相关文章

  1. JQuery中的工具函数总结

    前提引入 前提当然也是要引入Jquery啦... <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" typ ...

  2. jQuery基础(工具函数,浏览器信息,检测节点,字符串,$.extend())

    1.获取浏览器的名称与版本信息   在jQuery中,通过$.browser对象可以获取浏览器的名称和版本信息 如$.browser.chrome为true,表示当前为Chrome浏览器, $.bro ...

  3. JQuery实践--实用工具函数

    实用工具函数,$命名空间的一系列函数,但不操作包装集.它要么操作除DOM元素以外的Javascript对象,要么执行一些非对象相关的操作. JQuery的浏览器检测标志可在任何就绪处理程序执行之前使用 ...

  4. jQuery原理系列-常用Dom操作

    1. 事件绑定$(el).bind ie使用attachEvent,其它浏览器使用addEventListener,不同的是ie多了个on前缀,this绑定在window上,需要用call和apply ...

  5. jquery中的工具函数 Utilities

    noConflict(deep) 释放$和Jquery的控制权 isFunction(obj) isArray(obj) isWindow(obj) isNumeric(obj) type(obj) ...

  6. jQuery原理系列-css选择器实现

    jQuery最强大的功能在于它可以通过css选择器查找元素,它的源码中有一半是sizzle css选择器引擎的代码,在html5规范出来之后,增加了document.querySelector和doc ...

  7. jQuery原理系列-Dom Ready

    ready事件是jquery的一个很重要的功能,在很久很久以前,我们是使用window.onload监听页面加载成功的,onload事件的好处是你不用考虑浏览器兼容性,也不需要依赖任何框架就可以写,但 ...

  8. jQuery实用工具函数

    1. 什么是工具函数 在jQuery中,工具函数是指直接依附于jQuery对象.针对jquery对象本身定义的说法,即全局性的函数,我们统称为工具函数,或Utilities函数.它们有一个明显的特征, ...

  9. 从零开始学习jQuery (九) jQuery工具函数

    一.摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案,  即使你会使用jQuery也能在阅读中发现些许秘籍. 我们经常要使用脚本处理各种业务逻辑, 最常见的就 ...

随机推荐

  1. 洛谷 P3320 [SDOI2015]寻宝游戏

    因为寻宝路径是一个环,所以寻宝花费的最小时间与起点无关.宝应当按照所有宝藏所在位置的 dfs 序进行才能够使得花费的时间最短.设 \(dist_i\) 表示 \(i\) 到树根的最短距离,那么树上任意 ...

  2. python deepcopy的替代方案

    from copy import deepcopy import marshal import timeit from multidict import CIMultiDict def test_de ...

  3. activity添加切换动画之后出现的黑色背景问题

    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">     & ...

  4. VUE框架下安装自带http协议

    在控制台CMD 中输入 npm install vue-resource --save-dev

  5. 6专题总结-动态规划dynamic programming

    专题6--动态规划 1.动态规划基础知识 什么情况下可能是动态规划?满足下面三个条件之一:1. Maximum/Minimum -- 最大最小,最长,最短:写程序一般有max/min.2. Yes/N ...

  6. luogu P2762 太空飞行计划问题

    好像是最大权闭合图,也就是最大流最小割啦,找出最大流的路径输出,这题如何建模呢,一样的先设源点和汇点,源点向每个计划连capacity为赞助数的边,每个计划连相应装置capacity为无穷的边,每个装 ...

  7. 「SCOI2005」栅栏

    传送门 Luogu 解题思路 我们有很显然的这样一条贪心思路: 首先满足长度短的木板,因为如果可以满足长的也肯定可以满足短的,而且可能满足更多. 那么我们就会有这样的思路:枚举一条木板由哪条木板切割而 ...

  8. 性能测试中TPS上不去的几种原因

    性能测试中TPS上不去的几种原因 什么叫TPS: TPS(Transaction Per Second):每秒事务数,指服务器在单位时间内(秒)可以处理的事务数量,一般以request/second为 ...

  9. GoJS、AngularJS自定义组件JS SDK注解参考

    通常一个SDK包含一个或多个API 下面是一个SDK的实例: if (typeof(wlNgApp) === "undefined") wlNgApp = angular.modu ...

  10. uboot源码分析1-启动第一阶段

    1.不简单的头文件包含 #include <config.h>:这个文件的内容其实是包含了一个头文件:#include <configs/x210_sd.h>". # ...