跟我学习javascript的call(),apply(),bind()与回调(2)

在前面例子的第一个版本中,我们是先将sayColor()函数放到了对象o 中,然后再通过o 来调用它的;而在这里重写的例子中,就不需要先前那个多余的步骤了。

5、bind()方法

最后再来说 bind() 函数,上面讲的无论是 call() 也好, apply() 也好,都是立马就调用了对应的函数,而 bind() 不会, bind() 会生成一个新的函数,bind() 函数的参数跟 call() 一致,第一个参数也是绑定 this 的值,后面接受传递给函数的不定参数。 bind() 生成的新函数返回后,你想什么时候调就什么时候调,

window.color = "red"; var o = { color: "blue" }; function sayColor(){ alert(this.color); } var objectSayColor = sayColor.bind(o); objectSayColor(); //blue

在这里,sayColor()调用bind()并传入对象o,创建了objectSayColor()函数。object-SayColor()函数的this 值等于o,因此即使是在全局作用域中调用这个函数,也会看到”blue”。

支持bind()方法的浏览器有IE9+、Firefox 4+、Safari 5.1+、Opera 12+和Chrome。

二、call(),apply()的继承和回调

类的继承

先来看这个例子:

function Person(name,age){ this.name = name; this.age=age; this.alertName = function(){ alert(this.name); } this.alertAge = function(){ alert(this.age); } } function webDever(name,age,sex){ Person.call(this,name,age); this.sex=sex; this.alertSex = function(){ alert(this.sex); } } var test= new webDever(“愚人码头”,28,”男”); test.alertName();//愚人码头 test.alertAge();//28 test.alertSex();//男

这样 webDever类就继承Person类,Person.call(this,name,age) 的 意思就是使用 Person构造函数(也是函数)在this对象下执行,那么 webDever就有了Person的所有属性和方法,test对象就能够直接调用Person的方法以及属性了

用于回调
call 和 apply在回调行数中也非常有用,很多时候我们在开发过程中需要对改变回调函数的执行上下文,最常用的比如ajax或者定时什么的,一般情况下,Ajax都是全局的,也就是window对象下的,来看这个例子:

function Album(id, title, owner_id) { this.id = id; this.name = title; this.owner_id = owner_id; }; Album.prototype.get_owner = function (callback) { var self = this; $.get(‘/owners/' + this.owner_id, function (data) { callback && callback.call(self, data.name); }); }; var album = new Album(1, ‘生活', 2); album.get_owner(function (owner) { alert(‘The album' + this.name + ‘ belongs to ‘ + owner); });

这里

album.get_owner(function (owner) { alert(‘The album' + this.name + ‘ belongs to ‘ + owner); });

中的 this.name就能直接取到album对象中的name属性了。

三 、回调函数

说起回调函数,好多人虽然知道意思,但是还是一知半解。至于怎么用,还是有点糊涂。网上的一些相关的也没有详细的说一下是怎么回事,说的比较片面。下面我只是说说个人的一点理解,大牛勿喷。

定义
回调是什么?
看维基的 Callback_(computer_programming) 条目:

In computer programming, a callback is a reference to a piece of executable code that is passed as an argument to other code.

在JavaScript中,回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A。我们就说函数A叫做回调函数。如果没有名称(函数表达式),就叫做匿名回调函数。

举个例子:

你有事去隔壁寝室找同学,发现人不在,你怎么办呢?
    方法1,每隔几分钟再去趟隔壁寝室,看人在不
    方法2,拜托与他同寝室的人,看到他回来时叫一下你
前者是轮询,后者是回调。
那你说,我直接在隔壁寝室等到同学回来可以吗?
可以啊,只不过这样原本你可以省下时间做其他事,现在必须浪费在等待上了。
把原来的非阻塞的异步调用变成了阻塞的同步调用。
JavaScript的回调是在异步调用场景下使用的,使用回调性能好于轮询。
因此callback 不一定用于异步,一般同步(阻塞)的场景下也经常用到回调,比如要求执行某些操作后执行回调函数。

一个同步(阻塞)中使用回调的例子,目的是在func1代码执行完成后执行func2。

var func1=function(callback){ //do something. (callback && typeof(callback) === "function") && callback(); } func1(func2); var func2=function(){ }

异步回调的例子:

$(document).ready(callback); $.ajax({ url: "test.html", context: document.body }).done(function() { $(this).addClass("done"); }).fail(function() { alert("error"); }).always(function() { alert("complete"); });

回调什么时候执行

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgzfsd.html