CODEWITHSUNDEEP
javascripthtmlwebgl
Canvas
Canvas

Reputation: 5897

Javascript custom variable and custom array variable type

im trying to great a array of vector3's in JavaScript, im trying to create a Vertex, Edge, Face structure for a openGL cube, now im quite new to JavaScript but as HTML5 supports it, i feel JS should be a language i understand and now :),

Now I dont know how to declare a struct in JS and then how I would implement it into a array type?

I have something like this but i'm not sure if that's correct.

var vector3 = (x=0,y=0,z=0);

but then how would I use that for a array?

Cheers for the help.

Upvotes: 6

Views: 4741

Answers (4)

tobspr
tobspr

Reputation: 8376

I would create an Object:

var vector3 = {
    x:0,
    y:0,
    z:0
};

You can access the individual fields with code such as:

var tmp = vector3.x;

To place points in a vector

var myPolygon = [
    {x: 3, y: 8, z: -8},
    {x: 3, y: 4, z: 10},
    {x: 9, y: 8, z: -8},
];

You could write a vector type with this too so you do not have to write x, y, and z every time:

var vec3 = {x:0,y:0,z:0};

var demoVec = vec3;
var demo2Vec = vec3;
demoVec.x+=demo2Vec.y;

Upvotes: 1

Chango
Chango

Reputation: 6782

I like Tobias Springer's solution, but you could also create a vector object with utility methods:

Vector = function(x, y, z) {
  this._init(x, y, z);
};

Vector.prototype = {

  /**
   * Fixed Constructor.
   */
  constructor: Vector,

  x: null,

  y: null,

  z: null,

  /**
   * Add documentation!
   */
  _init: function(x, y, z) {
    this.x = x;
    this.y = y;
    this.z = z;
  },

  /**
   * Add documentation!
   */
  add: function(otherVector) {
    return new Vector(this.x + otherVector.x,
        this.y + otherVector.y, this.z + otherVector.z);
  },

  /**
   * Add documentation!
   */
  scalarProduct: function(otherVector) {
    return this.x * otherVector.x + this.y * otherVector.y
        + this.z * otherVector.z;
  },

  /**
   * From Asad's answer. Returns the distance between this vector
   * and <code>otherVector</code>.
   * @param otherVector {Vector}
   * @returns {Number}
   */
  distance: function(otherVector) {
    return Math.sqrt(Math.pow((this.x-otherVector.x),2)
        + Math.pow((this.y-otherVector.y),2)
        + Math.pow((this.z-otherVector.z),2));
  }
  // and so on....
};

So, you would use it like this:

var vector1 = new Vector (1, 1, 1);
var vector2 = new Vector (1, 0, 1);

var addedVector = vector1.add(vector2); // --> = (2, 1, 2)
var scalarProduct = vector1.scalarProduct(vector2); // --> = 2

Upvotes: 1

Paul S.
Paul S.

Reputation: 66334

I would write a constructor

function Vector(x,y,z){
    this.dimension = 0;
    if( undefined !== x ) this.dimension = 1, this.x = x || 0;
    else this.x = 0;
    if( undefined !== y ) this.dimension = 2, this.y = y || 0;
    else this.y = 0;
    if( undefined !== z ) this.dimension = 3, this.z = z || 0;
    else this.z = 0;
}
Vector.prototype = Object.create(null, {
    length: {
        get: function(){
            return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);
        }
    },
    add : {
        value: function(v){
            var d = Math.max(this.dimension, v.dimension), x, y, z;
            if( d > 0 ) x = (this.x || 0) + (v.x || 0);
            if( d > 1 ) y = (this.y || 0) + (v.y || 0);
            if( d > 2 ) z = (this.z || 0) + (v.z || 0);
            return new Vector(x, y, z);
        }
    }
});

var vector3 = new Vector(0,0,0);

Upvotes: 1

user1726343
user1726343

Reputation:

Use a javascript object: 

var vector1 = {x:0,y:0,z:0};
var vector2 = {x:10,y:0,z:0};

//example function to find scalar distance between two points
function distance(v1,v2){
    return Math.sqrt(Math.pow((v1.x-v2.x),2) + Math.pow((v1.y-v2.y),2) + Math.pow((v1.z-v2.z),2));
}
var d = distance(vector1,vector2); //returns 10
console.log(d);

Upvotes: 1

Related Questions