Super Tricky Javascript quiz, need to figure out about the answer - Stack Overflow

admin管理员组

文章数量:1026373

   //1st question
   var x = 4,
     obj = {
       x: 3,
       bar: function() {
         var x = 2;
         setTimeout(function() {
           var x = 1;
           alert(this.x);
         }, 1000);
       }
     };
   obj.bar();

   //2nd question
   function foo(a) {
     arguments[0] = 2;
     alert(a);
   }
   foo(1);

1.why it returns 4 instead of 1? i thought this.x refer to 1, but it seems wrong....i just dont understand why it returns 4

2.why it return alert 2 instead of 1, i thought i pass a to function a, and as far as i know, i pass 1 to function foo, and 1 should be alerted because of a(which is 1 when i pass)....i just don't understand why it alert 2

   //1st question
   var x = 4,
     obj = {
       x: 3,
       bar: function() {
         var x = 2;
         setTimeout(function() {
           var x = 1;
           alert(this.x);
         }, 1000);
       }
     };
   obj.bar();

   //2nd question
   function foo(a) {
     arguments[0] = 2;
     alert(a);
   }
   foo(1);

1.why it returns 4 instead of 1? i thought this.x refer to 1, but it seems wrong....i just dont understand why it returns 4

2.why it return alert 2 instead of 1, i thought i pass a to function a, and as far as i know, i pass 1 to function foo, and 1 should be alerted because of a(which is 1 when i pass)....i just don't understand why it alert 2

• javascript

Share Improve this question Follow edited May 2, 2016 at 19:02 Mike Cluck 32.5k1313 gold badges8383 silver badges9494 bronze badges asked May 2, 2016 at 19:02 Kevin MogiKevin Mogi 11711 silver badge77 bronze badges 1

• console.log this and you will see that it is referring to the window. on that level x has been defined as 4. This is all about scoping. check out this article, especially the part about this inside of closures ;) javascriptissexy./… – HolyMoly Commented May 2, 2016 at 19:37

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

1. The runtime (in non-strict mode) invokes the setTimeout() callback with this bound to window (the global context), so this.x refers to the outer x.

2. The arguments object serves as a way to alias the formal parameters of a function. Setting the value of arguments[0] also sets the value of the first declared parameter to the function.

1. why it returns 4 instead of 1?

Notice the first initialization: var x = 4, which in non-strict mode attaches a property x to global object: window.x = 4.

setTimeout(function() {
 var x = 1;
 alert(this.x);
}, 1000);

setTimout() callback has this context as the global object. And actually calling alert(this.x) -> alert(window.x) -> alert(4).

2.why it return alert 2 instead of 1

arguments object represents the list of function arguments. When modifying it, you actually modify the arguments values: arguments[0] = 2 modifies first argument a = 2.

   //1st question
   var x = 4,
     obj = {
       x: 3,
       bar: function() {
         var x = 2;
         setTimeout(function() {
           var x = 1;
           alert(this.x);
         }, 1000);
       }
     };
   obj.bar();

   //2nd question
   function foo(a) {
     arguments[0] = 2;
     alert(a);
   }
   foo(1);

1.why it returns 4 instead of 1? i thought this.x refer to 1, but it seems wrong....i just dont understand why it returns 4

2.why it return alert 2 instead of 1, i thought i pass a to function a, and as far as i know, i pass 1 to function foo, and 1 should be alerted because of a(which is 1 when i pass)....i just don't understand why it alert 2

   //1st question
   var x = 4,
     obj = {
       x: 3,
       bar: function() {
         var x = 2;
         setTimeout(function() {
           var x = 1;
           alert(this.x);
         }, 1000);
       }
     };
   obj.bar();

   //2nd question
   function foo(a) {
     arguments[0] = 2;
     alert(a);
   }
   foo(1);

1.why it returns 4 instead of 1? i thought this.x refer to 1, but it seems wrong....i just dont understand why it returns 4

2.why it return alert 2 instead of 1, i thought i pass a to function a, and as far as i know, i pass 1 to function foo, and 1 should be alerted because of a(which is 1 when i pass)....i just don't understand why it alert 2

• javascript

Share Improve this question Follow edited May 2, 2016 at 19:02 Mike Cluck 32.5k1313 gold badges8383 silver badges9494 bronze badges asked May 2, 2016 at 19:02 Kevin MogiKevin Mogi 11711 silver badge77 bronze badges 1

• console.log this and you will see that it is referring to the window. on that level x has been defined as 4. This is all about scoping. check out this article, especially the part about this inside of closures ;) javascriptissexy./… – HolyMoly Commented May 2, 2016 at 19:37

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

1. The runtime (in non-strict mode) invokes the setTimeout() callback with this bound to window (the global context), so this.x refers to the outer x.

2. The arguments object serves as a way to alias the formal parameters of a function. Setting the value of arguments[0] also sets the value of the first declared parameter to the function.

1. why it returns 4 instead of 1?

Notice the first initialization: var x = 4, which in non-strict mode attaches a property x to global object: window.x = 4.

setTimeout(function() {
 var x = 1;
 alert(this.x);
}, 1000);

setTimout() callback has this context as the global object. And actually calling alert(this.x) -> alert(window.x) -> alert(4).

2.why it return alert 2 instead of 1

arguments object represents the list of function arguments. When modifying it, you actually modify the arguments values: arguments[0] = 2 modifies first argument a = 2.

本文标签： Super Tricky Javascript quizneed to figure out about the answerStack Overflow