一.$.proxy()
1圈纺,this的作用域
$('#abc').click(function(){ //f1
console.log($(this).html()); //作用范圍f1,console.log有值
$.ajax({
url: '1.php',
type: "get",
success:function() //f2
{
console.log($(this).html()); //作用范圍f2,console.log為null
}//f2
})
}); //f1
第二個(gè)console.log沒值的原因是兰伤,this被重新定義了了讨。如果要使用第二個(gè)console.log有值捻激,可以這樣,也是最常用的方法:
$('#abc').click(function(){ //f1
console.log($(this).html()); //作用范圍f1,console.log有值
var that=this;
$.ajax({
url: '1.php',
type: "get",
success:function() //f2
{
console.log($(that).html()); //作用范圍f2,console.log有值
}//f2
})
}); //f1
2前计,$.proxy傳值
function test(){
this.msg='this is test';
this.onclick = function(){
$('#abc').click(function(){
this.getData(); //報(bào)錯(cuò)铺罢,getData沒有定義
})
}
this.onclick1 = function(){
$('#abc').click($.proxy(this.getData,this)); //$.proxy的二個(gè)參數(shù),第一個(gè)方法残炮,第二個(gè)對(duì)像
}
this.onclick2 = function(){
$('#abc').click($.proxy(this,"getData")); //$.proxy二個(gè)參數(shù),第一個(gè)對(duì)像缩滨,第二個(gè)方法名 }
this.getData=function(){
console.log(this.msg);
} }
//調(diào)用方法如下
new test().onclick();
new test().onclick1();
new test().onclick2();
onclick:報(bào)錯(cuò)是因?yàn)閠his作用域的問題势就,this作用域內(nèi),沒有g(shù)etData方法脉漏,所以報(bào)錯(cuò)苞冯。
onclick1和onclick2是一樣的,只不過是寫法不一樣侧巨,傳的參數(shù)不一樣而已舅锄。
2.$extend()
連接合并
//將hello方法合并到j(luò)query全局對(duì)象中去
$.extend({
hello:function(){console.log('hello');}
});
//將hello方法合并到j(luò)query實(shí)例化對(duì)象中
$.fn.extend({
hello:function(){console.log('hello');}
});
//另外方法
$.fn.hello=function(){console.log('hello');}
//也就是將"{}"作為dest參數(shù)。
var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:"Boy"});
//合并后結(jié)果
result={name:"Jerry",age:21,sex:"Boy"}
//深度合并
var obj1={name:'wz',love:'game', son:{name:'p1',love:'game2'}};
var obj2={name:'zcy',age:22,son:{name:'p2',age:1}};
var finalObj=$.extend(false,{},obj1,obj2);//設(shè)置 false或者無(wú)
//var finalObj=$.extend({},obj1,obj2);
console.log(JSON.stringify(finalObj));//
{"name":"zcy","love":"game","son":{"name":"p2","age":1},"age":22}
//為true 深度合并:
{"name":"zcy","love":"game","son":{"name":"p2","love":"game2","age":1},"age":22}
//如果有多個(gè)對(duì)象司忱?
var obj1={name:'wz',love:'game', son:{name:'s1',love:'game2'}};
var obj2={name:'zcy',age:22,son:{name:'s2',age:1}};
var obj3={name:'zzz',son:{name:'s3',hight:180},gril:{name:'g3',age:0,love:'KKK'}}
var finalObj=$.extend(false,{},obj1,obj2,obj3);//設(shè)置 false或者無(wú)
console.log(JSON.stringify(finalObj));
{"name":"zzz","love":"game","son":{"name":"s3","hight":180},"age":22,"gril":{"name":"g3","age":0,"love":"KKK"}}
//true 深度合并:
{"name":"zzz","love":"game","son":{"name":"s3","love":"game2","age":1,"hight":180},"age":22,"gril":{"name":"g3","age":0,"love":"KKK"}}
//總結(jié):就是依次往后合并
3.arguments
在js中 不需要明確指出參數(shù)名皇忿,就能訪問它們,例如:
function test() {
var s = "";
for (var i = 0; i < arguments.length; i++) {
alert(arguments[i]);
s += arguments[i] + ",";
}
return s;
}
test("name", "age")
輸出結(jié)果:
name,age
arguments里包含了callee屬性,callee 屬性的初始值就是正被執(zhí)行的 Function 對(duì)象坦仍,這允許匿名的遞歸函數(shù)鳍烁。
var factorial = function (n) {
if (1 == n) {
return 1;
} else {
return n * arguments.callee(n - 1);
}
}
console.log(factorial(5));//5的階乘120
//做一個(gè)比較有意思的實(shí)驗(yàn):
var stop=0;
function test(){
jsonLog(arguments);
if(stop>0)return;
stop++;
arguments.callee('p2',{name:'wz',age:23});
jsonLog(arguments);
}
test("p1",{name:'zcy'});
//輸出:
{"0":"p1","1":{"name":"zcy"}}
{"0":"p2","1":{"name":"wz","age":23}}//遞歸輸出
{"0":"p1","1":{"name":"zcy"}}
4.trigger()、$.Event()
觸發(fā) input 元素的 select 事件:
$("button").click(function(){
$("input").trigger("select");
});
高級(jí)用法配合$.Event();
//監(jiān)聽事件
$("#testButton").on('fly',function(event,params){
console.log("fly 回調(diào)");
console.log(event);
//r.Event...
console.log(JSON.stringify(params));
//{"name":"wz","option":{"programing":"js"}}
});
var e=$.Event("fly");//定義事件
$("#testButton").trigger(e,{name:'wz',option:{programing:'js'}});//觸發(fā)事件