发布于 2017-06-01 01:14:06 | 131 次阅读 | 评论: 0 | 来源: 网友投递
这里有新鲜出炉的Javascript教程，程序狗速度看过来！
JavaScript客户端脚本语言
Javascript 是一种由Netscape的LiveScript发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言，主要目的是为了解决服务器端语言，比如Perl，遗留的速度问题，为客户提供更流畅的浏览效果。
前言
Js是一个单线程语言，可以通过setTimeout()和setInterval()来设置代码在指定时刻运行，前者是在指定时间后执行，后者是指每隔一段时间执行。两者的使用方法类似。
最近在练习写一个小例子的时候用到了定时器，发现在setInterval和setTimeout中传入函数时，函数中的this会指向window对象，详细的介绍通过一个示例展开，一起来看看吧。
如下例：
var num = 0;
function Obj (){
this.num = 1,
this.getNum = function(){
console.log(this.num);
},
this.getNumLater = function(){
setTimeout(function(){
console.log(this.num);
}, 1000)
}
}
var obj = new Obj;
obj.getNum();//1 打印的为obj.num，值为1
obj.getNumLater()//0 打印的为window.num，值为0从上述例子中可以看到setTimeout中函数内的this是指向了window对象，这是由于setTimeout()调用的代码运行在与所在函数完全分离的执行环境上. 这会导致这些代码中包含的 this 关键字会指向 window (或全局)对象。详细可参考MDN setTimeout
但是在setTimeout中传入的不是函数时，this则指向当前对象，如下例：
var num = 0;
function Obj (){
this.num = 1,
this.getNum = function(){
console.log(this.num);
},
this.getNumLater = function(){
setTimeout(console.log(this.num), 1000)
}
}
var obj = new Obj;
obj.getNum();//1 打印的为obj.num，值为1
obj.getNumLater()//1 打印的为obj.num，值为1从以上两个例子可以看出，当在setTimeout中传入的参数为函数时，函数内部的this才会指向window对象。
当在setTimeout中传入了一个函数，若想要让this指向正确的值，可以使用以下两种比较常用的方法来使this指向正确的值：
1.将当前对象的this存为一个变量，定时器内的函数利用闭包来访问这个变量
如下：
var num = 0;
function Obj (){
var that = this; //将this存为一个变量，此时的this指向obj
this.num = 1,
this.getNum = function(){
console.log(this.num);
},
this.getNumLater = function(){
setTimeout(function(){
console.log(that.num); //利用闭包访问that，that是一个指向obj的指针
}, 1000)
}
}
var obj = new Obj;
obj.getNum();//1 打印的为obj.num，值为1
obj.getNumLater()//1 打印的为obj.num，值为1这种方法是将当前对象的引用放在一个变量里，定时器内部的函数来访问到这个变量，自然就可以得到当前的对象。
2.利用bind()方法
var num = 0;
function Obj (){
this.num = 1,
this.getNum = function(){
console.log(this.num);
},
this.getNumLater = function(){
setTimeout(function(){
console.log(this.num);
}.bind(this), 1000) //利用bind()将this绑定到这个函数上
}
}
var obj = new Obj;
obj.getNum();//1 打印的为obj.num，值为1
obj.getNumLater()//1 打印的为obj.num，值为1bind()方法是在Function.prototype上的一个方法，当被绑定函数执行时，bind方法会创建一个新函数，并将第一个参数作为新函数运行时的this。在这个例子中，在调用setTimeout中的函数时，bind方法创建了一个新的函数，并将this传进新的函数，执行的结果也就是正确的了。关于bind方法可参考 MDN bind
以上两种方法都是比较常用的，当然如果使用call或apply方法来代替bind方法，得到的结果也是正确的，但是call方法会在调用之后立即执行，那样也就没有了延时的效果，定时器也就没有用了，所以推荐使用上述两种方法来将this传进setTimeout和setInterval中。
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对phperz的支持。