zoukankan      html  css  js  c++  java
  • jquery源码学习

    近期在学习jquery的一些基础功能的源码,如数据缓存(.data,回调函数).callbacks,异步队列$.deferred;虽然只选取了其中比较基础功能模块,但也算是迈开了js源码研究的第一步,也为后续职业选择加一个方向~ full stack咯

    过程中很神奇的发现,研究js的过程中居然加深对后端语言的一些面向对象的思想和设计模式的理解,由此更加确信什么全栈的可行性(嘎嘎), 与此同时也学习到js的一些小技巧:

    1. 自调用匿名函数

     	(function(window,undefined){
      		 var jQuery = ...
      		// ...
    	  	window.jQuery = window.$ = jQuery;
     	})(window)
    
    • 通过创建一个自调用匿名函数,创建出特殊的函数作用域,这样就不会和已有的同名函数、方法和变量以及第三方库冲突了。 类似C#里的命名空间
    • 将window作为参数传入自调函数中
    • 方便直接访问window对象
    • 作为参数传入,有利于压缩代码的时候进行优化

    2. 用字符串split生成数组

     	 var events = "bind-change live-change onX-change".split(" ") ;
     	 var events=["bind-change","live-change","live-change","onX-change"] ;
    

    结果同样都是数组,但是用split 省去多个属性的双引号, 当属性越多效果越好,jquery就大量采用这技巧。而且也好看、输入的时候键盘敲的快、易于管理

    3. 可变参数

    C#中函数的可选参数只能放在末尾, 而js的灵活性使得其可以通过判断相应位置参数的类型来做更复杂的可选参数调度

    4.jQuery.data 实现原理

    $.cache:{
    	1:{
    		"data":{
    			"key":"value"
    		},
    		"key":"value"
    	}
    	...
    }
    
    obj:{
    	jQuery.expendo:1
    }
    

    数据都存在全局缓存对象$.cache中,并且通过对象jQuery.expendo属性来进行关联,对缓存数据集中管理,给其他模块功能提供基础支持。

    5.jQuery类数组对象

    jquery对象$("div")可以像数组一样用数字索引 $('div')[0] ,而返回的值是原生DOM对象;原因是用div去匹配的时候把dom对象作为jquery对象的数字属性值;

  • 相关阅读:
    Django(app的概念、ORM介绍及编码错误问题)
    Django(完整的登录示例、render字符串替换和redirect跳转)
    Construct Binary Tree from Preorder and Inorder Traversal
    Single Number II
    Single Number
    Binary Tree Level Order Traversal II
    Binary Tree Level Order Traversal
    Binary Tree Zigzag Level Order Traversal
    Recover Binary Search Tree
    Add Binary
  • 原文地址:https://www.cnblogs.com/mushishi/p/5767005.html
Copyright © 2011-2022 走看看