javascript.basics icon indicating copy to clipboard operation
javascript.basics copied to clipboard

箭头函数this指向demo

Open Kelichao opened this issue 4 years ago • 0 comments

	window.aaa = {
		  name:"window",
		  b :() => {
		    console.log(this.name,11111)
		  },
		  c: {
		    name:"c",
		    d: () => {
		      console.log(this.name,222222)
		    }
		  },
		  cc: {
		    name:"cc",
		    dd: () => {
		      console.log(this.name,444)
		    }
		  },
		  e: {
		    name:"e",
		    f ()  {
		      console.log(this.name,333)
		    }
		  }
		}
		
		aaa.b(); // window 11111
		aaa.c.d();// window 222222
		aaa.cc.dd()
		aaa.e.f();// e 333
		
		
		
		(function() {
		
			var aaa = {
			  name:"aaa",
			  b :() => {
			    console.log(this.name,11111)
			  },
			  c: {
			    name:"c",
			    d: () => {
			      console.log(this.name,222222)
			    }
			  },
			  cc: {
			    name:"cc",
			    dd: () => {
			      console.log(this.name,444)
			    }
			  },
			  e: {
			    name:"e",
			    f ()  {
			      console.log(this.name,333)
			    }
			  }
			}
			
			aaa.b.call(aaa); // window 11111
			
			aaa.c.d();// window 222222
			aaa.cc.dd()
			aaa.e.f();// e 333
			
			
			console.log(aaa.name)
			
			
		})()
		
		
		
		
		class BBB{
			constructor(){
				this.name = "BBB"
			}
			
			
		}
		Object.assign(BBB.prototype, {
		    ddd:() => {
		    	console.log(this.name)
		    }
		})
		var bbb = new BBB()
		bbb.ddd();
		
		
		
		
		 var x = ()=> {
					// ccc
					var s = {
						a:() => {
							console.log(this)
						}
					}
					
					s.a();
				}
				
				
		// 剪头函数父级的正确指向。
		var ccc = {
			a:function() {
				// ccc
				var s = {
					a:() => {
						console.log(this)
					}
				}
				
				s.a();
			},
			b:x
		}
		
		ccc.a();/// ccc
		ccc.b();// window  函数放在对象里面跟放在对象外面完全不同

Kelichao avatar Feb 24 '21 06:02 Kelichao