简体   繁体   中英

Javascript/Jquery beginner question

I am learning some jQuery basics with this great book: http://jqfundamentals.com/book/

There is an example that doesn't return the right result.

Here is the code:

  var myName = 'the global object',

      sayHello = function () {
          console.log('Hi! My name is ' + this.myName);
      },

      myObject = {
          myName : 'Rebecca'
      };

  var myObjectHello = sayHello.bind(myObject);

  sayHello();       // logs 'Hi! My name is the global object'
  myObjectHello();  // logs 'Hi! My name is Rebecca'

The log returns undefined instead of the global object for sayHello(); and I'd like to know why...

It should work properly, unless you've wrapped that code in another function, creating a new variable scope.

Example: http://jsfiddle.net/RKYNn/

As such, myName would not be available as a property on the global object.

So if you did this:

(function() {

  var myName = 'the global object',

      sayHello = function () {
          console.log('Hi! My name is ' + this.myName);
      },

      myObject = {
          myName : 'Rebecca'
      };

  var myObjectHello = sayHello.bind(myObject);

  sayHello();       // logs 'Hi! My name is the global object'
  myObjectHello();  // logs 'Hi! My name is Rebecca'

})();

...you'd get undefined because myName is no longer global, and this in the function is a reference to the global object.

My guess is that you are running onDomReady or onLoad . If I am correct, that is your problem (or appears to be when playing around in jsFiddle). Don't wrap it up and load it in the head or body after your jQuery.

See http://jsfiddle.net/morrison/euprL/

The reason has to do with scoping. What is the scope of variables in JavaScript? sums it up quite well, I think.

The global object isn't what it's actually going to say. It was implied that it will return the global window object, which is where global variables and such live. Unless you have a global variable named myName the value will be undefined .

Edit First time through I missed the var myName = 'the global object'; . That var makes it it part of the scope it's currently in, so as others have pointed out, unless you're in the global scope, it won't find the variable.

Tested your code like this and it works:

<html>
<head>
<script type="text/javascript">
var myName = 'the global object',

      sayHello = function () {
          console.log('Hi! My name is ' + this.myName);
      },

      myObject = {
          myName : 'Rebecca'
      };

  var myObjectHello = sayHello.bind(myObject);

  sayHello();       // logs 'Hi! My name is the global object'
  myObjectHello();  // logs 'Hi! My name is Rebecca'

</script>
</head>
</html>

Can you give us some details on the context of this script?

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM