jQuery 执行效率与编程方式

哥哥写代码的习惯： 

JavaScript组成：ECMAScript, DOM, BOM

匈牙利类型标记法：b, i, f, s, a, o, $, fn, v, re

告诉你一个秘密：JavaScript没有块级作用域。（...，什么麻辣鸡块？）

正则不要打死：

RegExp(pat, attr)

　　pat:正则字符串

　　　　[a-Z], [^0-9], |, ?, +, *...这些我懂的

　　　　a{N}: N个a

　　　　a{N1, N2}: N1个a, 或者N2个a

　　　　a{M, }: 至少M个a

　　　　^a: a开头

　　　　$a: a结尾

　　　　?=a, ?!a: 不冻。。

楼下大写都是非，你懂的：

　　　　\w: 单词

　　　　\d: 数字

　　　　\s: 空白字符

　　　　\b: 单词开头或者结尾

　　attr:

　　　　global(g): 全局匹配

　　　　ignoreCase(i): 区分大小写

小面    向对象：

function Ninja(sName, bGender) {
  this.sName= sName;
  this.bGender= bGender;
  
  if (typeof Ninja._initialized == "undefined") {
    Ninja.prototype.fnNinjutsu= function(chakra) {
　　　　if(chakra > 10){
　　　　alert("wow...");
　　　}      
    };
    
    Ninja._initialized = true;
  }
}

 var sasuke = new Ninja("sasuke", true);
sasuke.fnNinjutsu(101);

执行效率改善：

　　1.选择css类，利用id或者tag name来加快筛选 $("#nav .treeview"), $("div.o3d")

　　2.对jQuery对象进行多次操作，缓存变量或者链式添加 var $div = $("div.content")

　　3.DOM操作较慢，先缓存创建字符串，最后一次性添加DOM操作 options += "orz"

　　4.慎用jQuery.live()，其实用起很方便的

　　5.给多个元素添加相同callback时，可以利用冒泡特性，在父节点上监听

高级应用： 

　　1.队列控制，一次执行函数：定义Array<function>时在每个function内添加callback，结束时取消callback

var fnEffect_list = [
    function() {...; $("div").dequeue();},
    function() {...; $("div").dequeue();},
    function() {...;},
];
$("div").queue(fnEffect_list);
$("div").dequeue(); 

　　2.数组操作，转换数组中所有值或部分值，return null表示删除：

$.map([0, 1, 2], function(outer){
    var exist_item_list = $.grep([3, 2, 7], function(inner){
        return outer == inner;
    });
    if（exist_item_list.length == 0) return null;
    else return outer;
});//[2]

　　3.逐级查找DOM节点：

<div class="end sasuke" value="找到了">
    <div class="midway sasuke" value="继续找">
        <div class="begin sasuke" value="开始找">
        </div>
     </div>
 </div>

　　closest：从当前元素开始匹配查找，返回第一个jQuery对象

$(".begin:first").closest(".sasuke").attr("value");//开始找

　　parents：从父元素开始匹配查找，返回所有匹配的jQuery对象集合

$(".begin:first").parents(".sasuke").attr("value");//["开始找", "继续找", "找到了"]

注意：$("div").val()与$("div").attr("value")是有区别滴！

　　4.设置全局ajax默认选项：

$.ajaxSetup({
    async: false,
    cache: false,
    timeout: 1000,
    type: "POST",
    //url
     dataType: "json"
    //data
 });

　　5.代理this对象：将$("div")替换为{name:"sconfield"}，貌似可以用with代替一哈哈

$("div").click($.proxy(function(){
    alert(this.name);//sconfield
 }, {name:"sconfield"}));

Ninja