javascript中this值的引用

严格模式下

1.全局做用域指向当前Window闭包

2.函数内部的this,运行在全局做用域下,this值为undefinedapp

3.当即执行函数的 this值为undefineddom

"use strict"
 			var sb='sb';
 			
 			//全局做用下的this
 			console.log(this);//Window
 			
 			function sayHello(){
 					console.log('function');
 					//console.log(this);//undefined
 				}
 				
 				//运行在全局做用域下的函数
 				sayHello();
 				
 				
 				//匿名当即执行函数
 				(function(){
 					console.log('anonymous');
 					console.log(this);//undefined
 					})();

在非严格模式下

在该模式下**this** 引用老是指向一个值,该值老是指向持有**this**的 **Funtion或者Object **所运行的做用域函数

var firstName="Peter",
 	  lastName='Ally';
 	  
 	  function showFullName(){
 	  		//持有this的Funtion showFullName运行在全局做用域下,因此this指向Window
 	  		//输出PeterAlly
 	  		console.log(this.firstName+""+this.lastName);
 	  	}	
 	  	
 	  	showFullName();	
 	  	
 	  	var person={
 	  				firstName:"Penelope",
 	  				lastName:'Barrymore',
 	  				showFullName:function(){
 	  					//持有this的Funtion showFullName运行在person做用域下,因此this指向person
 	  					//输出PenelopeBarrymore
 	  					console.log(this.firstName+""+this.lastName);
 	  					}
 	  		}
 	  		
 	  		person.showFullName();

一些特殊状况

1.咱们能够利用**Bind ()**, Apply (), **Call ()从新指定this**引用this

var person={
 	  				firstName:"Penelope",
 	  				lastName:'Barrymore',
 	  				showFullName:function(){
 	  					//持有this的Funtion showFullName运行在person做用域下,因此this指向person
 	  					//输出PenelopeBarrymore
 	  					console.log(this.firstName+""+this.lastName);
 	  					}
 	  		}
 	  		
 	  		//person.showFullName();
 	  		
 	  		var anotherPerson={
 	  				firstName:'Rohit',
 	  				lastName:'Khan'
 	  			}
 	  			
 	  			//从新指定this为anotherPerson
 	  			//输出为RohitKhan
 	  			person.showFullName.apply(anotherPerson);

2.回调函数中的**this**code

var user={
 	  				data:[{
 	  					name:"T.Woods",
 	  					age:37
 	  				},{
 	  					name:"P. Mickelson",
 	  					age:43
 	  					}],
 	  				clickHandler:function(event){
 	  						 var randomNum = ((Math.random () * 2 | 0) + 1) - 1; // random number between 0 and 1​
 	  						 console.log (this.data[randomNum].name + " " + this.data[randomNum].age);
 	  					}
 	  				}
 	  				
 	  				 $ ("button").click (user.clickHandler);

**buttonclick事件击发的时候this并不能访问到 user的属性data,由于此时的this**引用的是 **$ ("button")**对象对象

修正以下:事件

$("button").click (user.clickHandler.bind (user));

3.闭包ip

var user={
 	  				tournament:"The Masters",
 	  				data:[{
 	  					name:"T.Woods",
 	  					age:37
 	  				},{
 	  					name:"P. Mickelson",
 	  					age:43
 	  					}],
 	  				clickHandler:function(event){
 	  						this.data.forEach(function(person){
 	  							//这是一个内部函数this再也不指向user
 	  							//this只能被Function,Object自身访问
 	  								console.log ("What is This referring to? " + this); //[objectWindow]
 	  								console.log (person.name + " is playing at " + this.tournament);
 	  								 // T. Woods is playing at undefined​
 	  								 // P. Mickelson is playing at undefined​​
 	  							})
 	  					}
 	  				}
 	  				  user.clickHandler();

修正以下:作用域

clickHandler:function(event){
 	  					var theUserObj = this;
 	  						this.data.forEach(function(person){
 	  							//这是一个内部函数this再也不指向user
 	  							//this只能被Function,Object自身访问
 	  								console.log ("What is This referring to? " + this); //[objectWindow]
 	  								console.log (person.name + " is playing at " + theUserObj.tournament);
 	  								 // T. Woods is playing at undefined​
 	  								 // P. Mickelson is playing at undefined​​
 	  							})
 	  					}

在外部函数中定义一个变量保存**this,在闭包中经过访问这个变量访问外部的this**

4.将方法赋值给变量

var data=[{
 	  						name:"Samantha",
 	  						age:12
 	  					},{
 	  						name:"Alexis",
 	  						age:14
 	  						}];
 	  				
 	  			var user={
 	  				tournament:"The Masters",
 	  				data:[{
 	  					name:"T.Woods",
 	  					age:37
 	  				},{
 	  					name:"P. Mickelson",
 	  					age:43
 	  					}],
						showData:function(event){
								var randomNum = ((Math.random () * 2 | 0) + 1) - 1;
                                                         // random number between 0 and 1
								
                        console.log (this.data[randomNum].name + " " + this.data[randomNum].age);
							}
 	  				}
 	  				
 	  				var showUserData = user.showData;
 	  				showUserData (); // Samantha 12 (from the global data array)​

最终输出的数据为全局变量中**data**的数据

修正以下:

var showUserData = user.showData.bind (user);
相关文章
相关标签/搜索