Search code examples
javascriptreturnbox2dundefinedbox2dweb

Why does my function return undefined?


With easeljs and box2d I have created several objects which collide with each other. Using the following code I create a box on the screen:

var b = new Box(400,0); // pass xPos and yPos
stage.addChild(b.view);

At a certain point in my script the box collides with a circle and when that happens a triangle has to Tween towards the box. So I need the position of the box! In my Box.js I have the following function:

function getX(){
    var xPos = this.body.GetPosition().x * SCALE;
    return xPos;
}

I have replaced the same function for the following function:

function getX(){
    return this.x;
}

Both functions return the same value when to the browser console I use console.log(b.getX);, which is undefined. Do I need to pass a parameter with my return function or is the structure of my function incorrect?


Solution

  • You are saying console.log(b.getX),

    first, you are not executing the function but logging its content. Secondly, the function is not a property of var b.

    // create the function.
    b.getX = function()
    {
     this.x;
    };
    
    // runs the command.
    b.getX();
    

    Edit:

    Jsfiddle explaining what you did wrong: http://jsfiddle.net/kychan/zsWpN/

    Edit 2:

    First i'll explain what a 'property' is. An property is a 'thing' owned by a certain object. Let's define a var and instantiate it:

    var x = {}; // this makes an object.
    

    We can also add properties with it:

    var y = {myProp1:'Hello', myProp2:'World'};
    

    This creates an object (y) with two properties (myProp1 and myProp2).

    Now, in your code (jsfiddle) you have the (global) function getX. This isn't set as a property, thus it must be called as a global statement:

    getX(b); // should return this.x;
    

    Fiddle with more thorough explanation: http://jsfiddle.net/kychan/WwxC9/

    //    METHOD 1 (Your method); works, but you can do it more directly, see METHOD 2.
    //    define the var, with 'var'.
    //    let it hold a (global) function.
    var getX = function(object){
        return object.x;
    };
    
    //    we make a test variable holding an object with property x:
    var foo = {x:4};
    console.log(getX(foo)); // this should return 4.
    
    //    METHOD 2:
    //    we will make a normal function (which has the same execution as METHOD 1).
    function getX2(o)
    {
        return o.x;
    }
    
    //    create a test variable.
    var bar = {x:4};
    console.log(getX2(bar)); // should print 4 as well.
    
    //   METHOD 3:
    //    now we create a CLASS which has a default property named getX:
    function myObject()
    {
        this.x     = 4;
    
        //    here, this is called a method (because it is a property owned by a class/object).
        this.getX  = function()
        {
            return this.x;
        };
    }
    
    //    we create a test variable holding the object from the class myObject.
    var baz = new myObject();
    console.log(baz.getX()); // now it ALSO should print 4!