Extend and Partial about js13k-2018 HOT 6 CLOSED

I should have done that well spotted!

I use the partial and extend functions as an alternative to class. I found this easier and cleaner than using the this keyword constantly. I write almost 100% OO Typescript at work so I wanted a change mostly.

Any other questions just let me know. You'll probably find a few things like this as I didn't refactor anything, due to being well under the 13kb limit.

from js13k-2018.

I thought that might be the case.

I have just started trying to do objects in javascript and I don't understand the need for class (or your technique). Why can't you just return an object ?

function vec(x,y) { return { x, y }; }

function tri(_v0,_v1,_v2) {

                let v0 = _v0;
                let v1 = _v1;
                let v2 = _v2;

                let centroid = () => vec(
                    (v0.x+v1.x+v2.x)/3,
                    (v0.y+v1.y+v2.y)/3
                );

                return { v0, v1, v2, centroid }
}

var tris = [];

tris.push(
        tri(
             vec(x,y),
             vec(x+50,y),
             vec(x,y+50)
 ));

Am I missing something ?

from js13k-2018.

@kewp You can certainly do that.

class is useful as it's syntax is more concise. It can also be extended eg class Dog extends Animal.

class is syntactic sugar for the following.

// syntactic sugar
class Dog {
  bark() { return 'woof!' }
}

// raw
var Dog = (function () {
  function Dog() {}

  Dog.prototype.bark = function() { 
    return 'woof!' 
  }
  
  return Dog
})()

An advantage of using the Object.assign approach that I use in the game is that any property can be assigned when the object is created.

For instance in the approach you show above when the object is created the arguments must be supplied in order and an argument will be needed for each value.

An example of when this becomes a burden is if I have a 3D vector that includes velocity. But on creation I want to assign only the x and vx value.

In the following approach four arguments need supplied in the correct order. In the future a new property might be needed eg: r and vr. If this was the case then every implementation of that function would need updated.

function vector3D(x, y, z, vx, vy, vz) { return { x, y, z, vx, vy, vz }; }
vector3D(3, 0, 0, 3)

The following example avoids this by assigning to an object with defaults. It is also more readable as it is easy to see that you are only updating the x and vx properties.

const vector3D = partial(extend, {x:0,y:0,z:0,vx:0,vy:0,vz:0})
vector3D({ x: 3, vx: 3})

from js13k-2018.

Thanks for this. It has been incredibly helpful.

Ok, I think I'm following. I also don't like this, which is why I like returning an object (instead of a function constructor).

For your example, you can reproduce your code like this

const vector3D = (...pts) => Object.assign(pts,{
	x:0,y:0,z:0,vx:0,vy:0,vz:0
});
vector3D({ x: 3, vx: 3});

I think that's essentially the same ? Though yours is a bit shorter (but has those extra two functions).

Great tip, though. Will make my code a lot clearer (and less brittle).

from js13k-2018.

Hmmm what do you think of this ?

const extend = (o) => (...args) => Object.assign(args,o)

const Vector3D = extend({
	x:0,y:0,z:0,vx:0,vy:0,vz:0
});

vector3D({ x: 3, vx: 3})

from js13k-2018.

@kewp

You will want to update it to the following, to allow for multiple extensions and to create a new object and also to inherit from the o argument. It is essentially the same as the extend function used in the game.

const extend = o => (...extensions) => Object.assign({}, o, ...extensions)

from js13k-2018.