How to properly set up classes in Node using THREE.js

Questions
1

Hello,
I’m in the process of converting javascript code within an html file over to a node.js server. I’ve run into a problem trying to port over a class.

In the constructor portion of the class I create a new instance of a THREE.Mesh(), manipulate the mesh using updateMatrixWorld and then assign custom varibles within the class with the applyMatrix4 Calculations.

So an example

class myClass{
  constructor( position , up , lookAt ){
    var m = new THREE.Mesh( new THREE.Geometry() );
    m.geometry.vertices.push( new THREE.Vector3( 1 , 0 , 0 ) , new THREE.Vector3( 0 , 1 , 0 ) , new THREE.Vector3( 0 , 0 , 1 ) );
    m.position = position;
    m.up = up;
    m.lookAt( lookAt );
    m.updateMatrixWorld;

    this.one = m.geometry.vertices[0];
    this.two = m.geometry.vertices[1];
    this.three = m.geometry.vertices[2];

    this.one.applyMatrix4( m.matrixWorld );
    this.two.applyMatrix4( m.matrixWorld );
    this.three.applyMatrix4( m.matrixWorld );
  } 
}

Within the browser the mentioned code runs fine without any hiccups and performs the maxtrix calculations. However if I try and run it on a node server I have to add the following to the end of my class decleration

module.exports myClass;

But then I get the following error;
TypeError: Cannot assign to read only property ‘position’ of object '#'
The object in this case being ‘m’ or the mesh.

If I change the structure of the code and instead of creating a class export a function like so…

 exports.myClass = function( position , up , lookAt ){
        var m = new THREE.Mesh( new THREE.Geometry() );
        m.geometry.vertices.push( new THREE.Vector3( 1 , 0 , 0 ) , new THREE.Vector3( 0 , 1 , 0 ) , new THREE.Vector3( 0 , 0 , 1 ) );
        m.position = position;
        m.up = up;
        m.lookAt( lookAt );
        m.updateMatrixWorld;

        this.one = m.geometry.vertices[0];
        this.two = m.geometry.vertices[1];
        this.three = m.geometry.vertices[2];

        this.one.applyMatrix4( m.matrixWorld );
        this.two.applyMatrix4( m.matrixWorld );
        this.three.applyMatrix4( m.matrixWorld );
      }

then my issue is the Matrix calculations don’t actual work. updateMatrixWorld doesn’t seem to have any effect and the results are useless. So I don’t know what to do.
Any help would be greatly appreciated.

Thanks

2

All parts of a ClassDeclaration or a ClassExpression are strict mode code. So assigning a vector to the position property of a mesh does not work when you use classes. Try to use m.position.copy( position ); instead. This is in general the preferred approach.

1 Like
3

Oh, if you wonder why an assignment is not possible, it’s because of these lines (writable is not set so it is false).

More information: https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties

1 Like
4

That did the trick! Thank you very much