JavaScript中的this详解
来源:互联网 发布:杭州时时彩源码出售 编辑:程序博客网 时间:2024/04/20 00:44
this属于JS的底层知识,了解this之后,能够实现一些基本的功能,但是感觉最重要的是,this是面向对象必不可少的组成部分,如果希望能够逐渐的掌握面向对象,this必然是不可少的。查看this指向的一句话法则:<span style="color:#FF0000;">永远指向其所在函数的所有者如果没有所有者时,指向window。</span>理解this的要点:关键在于将函数与函数名分开看待。同一个函数,在不同的执行方法下,会有不同的效果。如何来进行理解呢,来看几个实例1)全局函数中的this指向 function test(){ alert(this);//test这个函数没有所有者,因此此时this指向的是window } 2)对象方法中的this指向 h5course.test = function(){ alert(this==h5course);//输出true,h5course.test表示的是test这个函数的所有者是对象h5course,因此this应当是指向h5course的 }3)绑定函数时的this如下代码,test1和test2中this并不相同 var test2 = h5course.test1;//test2这个函数并没有所有者,在此,test2虽然调用了test1这个函数,但是this仍然指向window,而不是指向test1的拥有者:对象h5course test2(); h5course.test1 = function(){ alert(this===h5course); }这便是上面所说的,要将函数与函数名分开看待4)绑定函数时的this此时如果我们对3)中的代码进行一些修改: function test () { alert(this === h5course); } test();//this指向window var h5course = {}; h5course.test2 = test; h5course.test2();//此时test2的所有者为h5course,而test没有所有者,this在此时指向的是h5course alert(h5course.test2);欢迎沟通交流~HTML5学堂5)鼠标单击事件等进行函数的绑定时,this的指向 document.onclick=function(){ alert(this===document);//输出为true,onclick事件的拥有者是document。因此,此处this指向document。我们可以将document.onclick理解为一个对象方法,如同例4中的o.test2一样。 }6)setTimeout等传参形式的this指向不要去看传的参数中函数的所有者,看执行函数的所有var obj = {}; obj.x = 1; obj.y = 2; window.x = 100; window.y = 200; obj.add = function () { alert(this.x + this.y); } setTimeout(obj.add,1000);//this指向window,输出为300 setTimeout(function(){//this指向obj,输出为3 obj.add(); },1000);7)改变this的方法:call,applycall和apply(两者用于改变函数的作用域) var oo = {}; oo.test3 = function(){ alert(this == oo);//返回false } var h5course = {}; oo.test3.call(h5course);//this指向的是()内的第一个参数,此处为h5course window.x = 100; var oo = {}; oo.test3 = function(y,z,k){//函数的参数与apply、call中第二个以及之后的参数相对应 alert(this.x+y+z+k); } var arr=[2,3,4] oo.test3.call(window,2,3,4);//this指向window,输出为109 oo.test3.apply(window,[2,3,4]);//同上,使用apply进行元素罗列时需要使用中括号[]将所有参数包裹起来 oo.test3.apply(window,arr);//同上,使用apply对于一个数组的访问很简单,使用数组名称
1 0
- JavaScript中的this详解
- 详解 JavaScript 中的 this
- 详解 JavaScript 中的 this
- 详解 JavaScript 中的 this
- 详解 JavaScript 中的 this
- 详解 JavaScript 中的 this
- 详解 JavaScript 中的 this
- 详解JavaScript中的this
- 详解 JavaScript 中的 this
- 详解 JavaScript 中的 this
- 详解 JavaScript 中的 this
- 详解JavaScript中的this
- JavaScript中的this详解
- JavaScript中的this详解
- JavaScript中的This详解
- 详解JavaScript中的this
- JavaScript中的this详解
- this详解:JAVASCRIPT中的this到底是谁?
- iOS中TCP和UDP的区别
- 控制动画播放及其获取精灵的长宽数据
- 滤镜相关知识
- Android仿Win8界面的按钮点击
- Pods安装使用
- JavaScript中的this详解
- unity3d中awake和start函数的理解。
- 华为oj 称砝码
- R语言并行计算(1)
- RDS和ROS使用小结
- 12306图形验证码
- H.264 RTP PAYLOAD 格式
- win7下VS2008 使用ODBC读写EXCEL,找不到EXCEL驱动,安装驱动的办法。。。
- C库函数 - puts()