1. 程式人生 > >js中bind、call、apply區別和簡單應用

js中bind、call、apply區別和簡單應用

1,js函式應用的時候都包含著隱式傳遞this的效果--而bind、call、apply是顯式傳遞boj的效果;

2,顯式是為了和別的obj(上下文)發生關係,bind是指定關係,然後再某個時刻運用這種關係,call、apply是指定這種關係並且立即運用;

以下是例子:

var simpleForm1 = {name:"yangzai",age:10,submit:function(){alert("name:"+this.name+",age:"+this.age);}};
document.getElementById("simpleForm1").onclick = simpleForm1.submit;//1-name:,age:undefined
document.getElementById("simpleForm1").onclick = function(){//2-name:yangzai,age:10
	simpleForm1.submit();
};
document.getElementById("simpleForm1").onclick = simpleForm1.submit.bind(simpleForm1);//3-name:yangzai,age:10
第一種:submit的引用指向已經便更,所以this.name不會再呼叫simpleForm1裡面的屬性;

第二種:建立匿名函式是一種方法,也很常用;

第三種:用bind改變引用關係,使this作用域回到simpleForm1物件中;

下面是call、apply的呼叫例子:

//call、apply呼叫時,可以顯式改變js作用域--call、apply其實也是函式呼叫的一種方式,下面我們指定了作用域為simpleForm2
var simpleForm1 = {name:"yangzai",age:10,submit:function(){alert("name:"+this.name+",age:"+this.age);}};
var simpleForm2 = {name:"datou",age:20};
document.getElementById("simpleForm1").onclick = simpleForm1.submit.call(simpleForm2);//name:datou,age:20
document.getElementById("simpleForm1").onclick = simpleForm1.submit.apply(simpleForm2);//name:datou,age:20