Jump to content

How to use in babylon.js "variables" and "this"?


hulahula
 Share

Recommended Posts

Hello every body  I have  question about using variables and "this". I am  autodidact and I really like code and  last 2 week I am  trying make "simple" game but  I am stuck. Here is my question : 

If I create js file and make there function:

function Box(scene){
this.scene = scene;

this.box = BABYLON.Mesh.CreateBox("box", 0.32, this.scene);
this.boxMat = new BABYLON.StandardMaterial("mat",this.scene);
this.boxMat.diffuseColor = new BABYLON.Color3(10,1,1);
this.box.material = this.boxMat;

};

And I have other js file whit other function  which contains mesh like a sphere for example  and now I want to use "this.box.position.x " in function  where is  the sphere. Is it possible ? 

I tried  like function call() but it didn´t worked. I treid search in google  some exampels and without success.

 Sorry for my bad English.  Have a nice evening :).

Link to comment
Share on other sites

Hello, sorry for my bad english too :D 

In javascript 'this' is referring to the current scope. Now to understand what a scope is, scope is the space between {  } , in your example the box mesh only exists in the Box function scope. 

I think you need better app structure in order to achieve things easily. Structure in javascript can be achieved in many ways. The following is one approach I use a lot. In this example both the sphere and box meshes belongs to the scope of MyApp and can be used from any prototype function of class MyApp. 

var MyApp = (function(){
    
    //constructor
    function MyApp(){

        this.box = this.createBox();
        this.sphere = this.createSphere();

    }
    
    MyApp.prototype.createBox = function(){
        
        this.box = //create mesh
      
    };
        
    MyApp.prototype.createSphere = function(){
      
        this.sphere = //create mesh
        
    };
    
    MyApp.prototype.anotherFunction = function(){
            
        //here you have both the box and spehere mesh
        
    }
    
    return MyApp; // returning the constructor
    
})();
        
        
        
// use the app as follows
        
        
var app = new MyApp();
        
app.anotherFunction();

 

 

 

Link to comment
Share on other sites

    var Scene = new BABYLON.Scene(engine);
    
    class Box {
        constructor (scene){

            this.scene = scene;

            this.box = BABYLON.MeshBuilder.CreateBox("box", {height: 2, width: 3, depth: 3}, this.scene);
            this.boxMat = new BABYLON.StandardMaterial("mat",this.scene);
            this.boxMat.diffuseColor = new BABYLON.Color3(10,1,1);
            this.box.material = this.boxMat;

            this.box.position.x += .2;

            console.log(this.box.position.x)
        }
    }

    new Box(Scene);

 

Here is how I would use this.box.position.x
 
Check the console.
 
Link to comment
Share on other sites

Since it's in another JS file then you can't use "this" from the other file.  I have expanded a bit on the PG from Spankied.  Look at the mesh() "property", that's one way to get access to a "this.box" variable from another JS file - from the instance of the Box class.
https://www.babylonjs-playground.com/#WQ8M9K#1


 

Link to comment
Share on other sites

@Alenvei - Yes, so you could do this in the other JS file, which needs access to the box instance:

var sphereAndSquareIntesect = this.sphere.intersectsMesh(box.mesh)

The syntax from spankied looks better, but make sure ES2015 is okay for you, if you need to support older browsers; if you are not using something like babel (https://babeljs.io/), otherwise the syntax from senglean is more compatible with older browsers.

Link to comment
Share on other sites

35 minutes ago, Pryme8 said:

would need to give it a different namespace than 'this' because it can not be overwritten

'this' can be overwritten on functions with bind (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Function/bind).  There's so much trickery in javascript and other ways to get 'this' from another file like inheritance or mixins, but trying to keep it simple :)

Link to comment
Share on other sites

43 minutes ago, brianzinn said:

'this' can be overwritten on functions with bind (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Function/bind).  There's so much trickery in javascript and other ways to get 'this' from another file like inheritance or mixins, but trying to keep it simple :)

yeah, but that is asking for trouble unless you have a reason to reset your scope chain, which might at some point be useful thanks for the info.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...