JS——this案例

48 阅读1分钟

1.问题:

  <script type="text/javascript">
		var name="karen";
		var obj={
			name:"jack",
                            prop:{
				name:"ivan",
			        getname:function(){
				   return this.name;
                                    }
			}
		};
		console.log(obj.prop.getname());//this为obj.prop==>ivan
		var test=obj.prop.getname;
		console.log(test());//this为window==>karen
		
	</script>

答案:

image.png

2.问题:

  <script type="text/javascript">
		function fn(){
                    //因为这里的getName没有在这个函数作用域内声明,所以去全局里面找
			getName=function(){
				console.log(1)
			};
			return this;
		}
		var getName=function(){console.log(4)};//function(){console.log(1)}
		fn().getName();
                    //上面的fn.getName()可以换成下面的代码
		//var re=fn()==>this:window
		//re.getName()==>window.getName()==>1
	</script>

答案:

image.png

image.png

3.问题:

     <script type="text/javascript">
		function a(xx){
			this.x=xx;
			return this;
		};
		var x=a(5);
		//var window.x=window.a(5)
		//var xx=5
		//window.x=xx=5
		//this=window
		var y=a(6);
		//var window.y=window.a(6)
		//var xx=6;
		//window.x=xx=6这一步非常重要,可以得到x=6
		//this=window
		console.log(x.x);//6.x==>undefined
		console.log(y.x)//window.x=x=6
		
	</script>

答案:

image.png

4.问题:

   <script type="text/javascript">
		var obj={
			name:"karen",
			say:function(){
				console.log(this)//this==>obj
				function fn(a){
					console.log(a,this)//a=obj,this=window
				}
				fn(this)//fn(obj)
			}
		}
		obj.say()
	</script>

答案:

image.png

5.问题:

<script type="text/javascript">
		var obj={
			name:"karen",
			fn:function(){
				console.log(this.name)//this==>window
			}
		}
		var a=obj.fn
		a()
		//结果:为"",因为window有name属性
	</script>

答案:

image.png