Javascript questions which don't deserve their own thread.

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.

«‹›277 »

Kobayashi: Aug 13, 2004; by Nyc_Tattoo

My favorite thing about NPM, aside from hundreds of Mbs of dependencies in node_modules, is the fact that it only speaks JSON, so there's no sane way to comment on dependencies or scripts more complex than the defaults.

# ? Oct 12, 2016 05:18

Adbot: ADBOT LOVES YOU

# ? May 15, 2024 12:10

Anony Mouse: Jan 30, 2005; A name means nothing on the battlefield. After a week, no one has a name.; Lipstick Apathy

On the one hand, ugh, another package manager?

On the other hand, ugh, NPM.

I'm torn.

# ? Oct 12, 2016 06:49

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

Kobayashi posted:

My favorite thing about NPM, aside from hundreds of Mbs of dependencies in node_modules, is the fact that it only speaks JSON, so there's no sane way to comment on dependencies or scripts more complex than the defaults.

Yes, this is terrible.

# ? Oct 12, 2016 14:45

ModeSix: Mar 14, 2009

Kekekela posted:

Ok thank you for clarifying. I was just thinking of what you would call the way everyone's going to do it, what's the word for that?

Would 'defacto' work?

# ? Oct 12, 2016 17:24

Kekekela: Oct 28, 2004

e: killing my own derail

Kekekela fucked around with this message at 19:33 on Oct 12, 2016

# ? Oct 12, 2016 18:35

ufarn: May 30, 2009

Anyone figured out what to do if Yarn uses a different version of Node than NPM? I've been using n for versioning until now.

# ? Oct 15, 2016 14:22

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

What's a good pattern for optionally assigning object properties?

What would be nice is if I could do this:

JavaScript code:

const maybe = False;
const iHaveOptionalProperties = {
  iExist = true,
  iMightExist = maybe ? 'i do exist!' : undefined;
};

Unfortunately this happens:

JavaScript code:

> 'iMightExist' in iHaveOptionalProperties
> true

So, I currently create the object with for-sure properties, and then using logic add (or not) optional properties...and this sucks.

# ? Oct 18, 2016 15:32

tyrelhill: Jul 30, 2006

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/in

Read the part about undefined and delete

# ? Oct 18, 2016 16:03

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

tyrelhill posted:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/in

Read the part about undefined and delete

Right, it's because of that behavior I'm asking the question.

The cleanest solution I've come up with so far is build the object like in my first example and then build another object with lodash:

JavaScript code:

const maybe = False;
const iHaveOptionalProperties = {
  iExist = true,
  iMightExist = maybe ? 'i do exist!' : undefined;
};
const fixedObjectWithUndefinedRemoved = _.omitBy(iHaveOptionalProperties, x => !x);

Of course, this isn't really a solution for the general case since there might be properties that should be there with falsey values. It's good enough for me in what I'm working on right now, but I seem to encounter this kind of pattern not-infrequently.

Thermopyle fucked around with this message at 16:15 on Oct 18, 2016

# ? Oct 18, 2016 16:07

tyrelhill: Jul 30, 2006

you have to delete the property

# ? Oct 18, 2016 16:12

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

tyrelhill posted:

you have to delete the property

Yes, I know, but building the object and then having a bunch of if's to delete properties doesn't save me anything from what I mentioned before...having a bunch of if's to add properties.

# ? Oct 18, 2016 16:14

Munkeymon: Aug 14, 2003; Motherfucker's got an
armor-piercing crowbar! Rigoddamndicu𝜆ous.

You could do your own shallow copy like

JavaScript code:

function s_copy(from, into) {
    for (var i in from) {
        //maybe also hasOwnProperty ?
        if (from[i] !== undefined) {
            into[i] = from[i];
        }
    }
}//untested!

Doesn't that do what you want?

# ? Oct 18, 2016 16:35

Flat Daddy: Dec 3, 2014; by Nyc_Tattoo

I would write it like this

code:

const maybe = false;
const iHaveOptionalProperties = Object.assign(
    { iExist: true },
    maybe ? { iMightExist: 'i do exist!' }
          : {}
);

> 'iMightExist' in iHaveOptionalProperties
> false

# ? Oct 18, 2016 16:56

Munkeymon: Aug 14, 2003; Motherfucker's got an
armor-piercing crowbar! Rigoddamndicu𝜆ous.

Flat Daddy posted:

I would write it like this

code:

const maybe = false;
const iHaveOptionalProperties = Object.assign(
    { iExist: true },
    maybe ? { iMightExist: 'i do exist!' }
          : {}
);

> 'iMightExist' in iHaveOptionalProperties
> false

Oh nice - I really need to get used to more of the ES6 features

# ? Oct 18, 2016 17:01

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

Munkeymon posted:

You could do your own shallow copy like
JavaScript code:
function s_copy(from, into) {
    for (var i in from) {
        //maybe also hasOwnProperty ?
        if (from[i] !== undefined) {
            into[i] = from[i];
        }
    }
}//untested!
Doesn't that do what you want?

Yeah, that's somewhat equivalent to my _.omitBy solution and has the same failing (i.e. maybe there are properties that are supposed to be undefined)...though it's probably good enough.

I guess what I wish for is some extra syntax for object literals.

# ? Oct 18, 2016 17:08

Sedro: Dec 31, 2008

You can write it in ES7 as

JavaScript code:

const maybe = true;
const iHaveOptionalProperties = {
  iExist: true,
  ...(maybe && { iMightExist: 'i do exist!' })
}

Edit:

Thermopyle posted:

I guess what I wish for is some extra syntax for object literals.

as you wish

# ? Oct 18, 2016 18:22

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

That's a neat idea.

# ? Oct 18, 2016 18:41

Ranzear: Jul 25, 2013

If you go with the shallow copy approach, you can (ab)use the enumerable flag to skip properties you want to leave out. I use it to hide server-only properties (mostly roomgen process stuff that might be handy later) from JSON.stringify. Only really useful if you have a lot of stuff you want to kinda ... anti-template?

code:

Object.defineProperty(thing, 'prop', {enumerable:false})

Ranzear fucked around with this message at 22:05 on Oct 18, 2016

# ? Oct 18, 2016 22:02

necrotic: Aug 2, 2005; I owe my brother big time for this!

That doesn't help if he wants the key enumerable when a value is present.

# ? Oct 19, 2016 04:14

Suspicious Dish: Sep 24, 2011; 2020 is the year of linux on the desktop, bro; Fun Shoe

Build up a giant list of what you want and use Object.defineProperties?

You could also use your lodash thing and just use x !== undefined as your condition.

# ? Oct 19, 2016 16:25

Strong Sauce: Jul 2, 2003; You know I am not really your father.

Thermopyle posted:

What's a good pattern for optionally assigning object properties?

What would be nice is if I could do this:
JavaScript code:
const maybe = False;
const iHaveOptionalProperties = {
  iExist = true,
  iMightExist = maybe ? 'i do exist!' : undefined;
};
Unfortunately this happens:
JavaScript code:
> 'iMightExist' in iHaveOptionalProperties
> true
So, I currently create the object with for-sure properties, and then using logic add (or not) optional properties...and this sucks.

how much of a hack do you want it to be?

JavaScript code:

const maybe = false;

const iHaveOptProps = {
  iExist: true,
  [maybe ? 'iMightExist' : Symbol()]: 'i do exist'
}

> 'iMightExist' in iHaveOptionalProperties
> false

BUT

JavaScript code:

Reflect.ownKeys(iHaveOptProps)
> [ Symbol(), 'iExist' ]

Object.getOwnPropertySymbols(r)
> [ Symbol() ]

Object.getOwnPropertyNames(r)
> [ 'iExist' ]

Or instead of having Symbol(), just use another property value.

JavaScript code:

const maybe = false;

const iHaveOptProps = {
  iExist: true,
  [maybe ? 'iMightExist' : '_dne']: 'i do exist'
}
delete iHaveOptProps._dne; // cleanup

> 'iMightExist' in iHaveOptionalProperties
> false

# ? Oct 20, 2016 09:41

ROFLburger: Jan 12, 2006

I could really use something similar to the JS Iterable interface, but also employs a previous() method and maybe first() and last(). I don't see anything like that in es6 or in Immutable (I'm using both in my project). Does something like that exist without having to either make it myself or pull in another dependency? I feel like I might be overlooking something. I know I could use an array and keep track of the index myself, but this would be a lot more pleasant to look at.

Like this: https://docs.oracle.com/javase/7/docs/api/java/util/ListIterator.html

# ? Oct 22, 2016 01:49

necrotic: Aug 2, 2005; I owe my brother big time for this!

Nothing exists in stdlib for that. I'm not familiar with any libraries that do that, but you either need one of those or write your own.

# ? Oct 23, 2016 03:18

Begall: Jul 28, 2008

I've got an existing web application that makes use of the knockout.js foreach binding to populate a data table like so:

code:

<tbody data-bind="foreach: records()">
        <tr>
        	<td data-bind="text: column1"/>
                <td data-bind="text: column2"/>
                <td data-bind="text: column3"/>
                <td data-bind="text: column4"/>
       </tr>
</tbody>

I'm trying to swap over to using the bootstrap-table plugin for making the table pretty, and the data does display, but the table acts like there is no data in it i.e. at the end it has 'No matching records found', none of the functionality like sorting or pagination works. I understand that the reason it's doing this is because the knockout data is being loaded after the document ready event, but I can't work out how I would go about forcing a refresh on the table so that it is able to find the additional data.

I've tried reinitialising the table with $('#table').bootstrapTable({}) after all the data has been loaded, but no luck. Is there any way of getting it to play nicely with knockout?

# ? Oct 26, 2016 23:50

Batham: Jun 19, 2010; _{Cluster bombing from B-52s is very, very accurate. The bombs are guaranteed to always hit the ground.}

After having used AngularJS 1.x for a year and a half, I thought I'd take a peek at AngularJS 2.x this weekend. Apparently they wanted AngularJS 2.x to have a smaller learning curve, so I was a bit surprised as to where AngularJS 2.x has ended up. To be more precise; it seem like all they might've gained in lowering the learning curve, they lost by the much heavier front-load.

Am I wrong when thinking this? A year and a half ago I got up and running with AngularJS 1.x in less than half an hour, while the setup for AngularJS 2.x is not only a lot longer, there's also a lot more that you need to know already or setup. How will this not drive new webdevelopers away from AngularJS 2.0? But time will tell I guess.

Batham fucked around with this message at 14:33 on Oct 31, 2016

# ? Oct 31, 2016 11:16

Osmosisch: Sep 9, 2007; I shall make everyone look like me! Then when they trick each other, they will say "oh that Coyote, he is the smartest one, he can even trick the great Coyote."; Grimey Drawer

Batham posted:

After having used AngularJS 1.x for a year and a half, I thought I'd take a peek at AngularJS 2.x this weekend. After hearing that they said they wanted to make AngularJS have a lot smaller learning curve, I really wasn't expecting what AngularJS ended up being. To be more exact; it seem like all they might've gained by possibly lowering the learning curve they lost by the much heavier front-load.

Am I wrong when thinking this? A year and a half ago I got up and running with AngularJS 1.x in less than half an hour, while the setup for AngularJS 2.x is not only a lot longer, there's also a lot more that you need to know already or setup.

For me it's definitely been the same experience. The need for extra tools for things like transpiling the typescript, having to learn both TS and the new framework, and all the extra config files beyond package and babel .Jason really make it harder to get up and running or change something about your workflow. Plus the angular 2 docs are even worse than those for 1 so that doesn't help.

# ? Oct 31, 2016 14:28

IAmKale: Jun 7, 2007; やらないか; Fun Shoe

Batham posted:

Am I wrong when thinking this? A year and a half ago I got up and running with AngularJS 1.x in less than half an hour, while the setup for AngularJS 2.x is not only a lot longer, there's also a lot more that you need to know already or setup. How will this not drive new webdevelopers away from AngularJS 2.0? But time will tell I guess.

I felt the same way until I tried out angular-cli. Within seconds I had an Angular2 codebase up and running with a build setup that wasn't too complex to understand and handled things like TS transpilation, bundling, etc... It allowed me to skip all the bullshit of setting up Webpack, and I felt as though this setup the tool spit out was the "right" way to start an Angular2 project because it came from the Angular people. It's worth a shot if you just want to get to coding.

# ? Oct 31, 2016 14:50

Honest Thief: Jan 11, 2009

I honestly just said gently caress it and dove in further into React when ng2 reared it's ugly mug. I think it will eventually be a good evolution and departure from 1.x but eh, don't want to deal with the growing pains of it.

# ? Oct 31, 2016 15:05

lunar detritus: May 6, 2009

Angular 2 is great, the only problem it has is that you can only use it for SPAs. Using it in a server-side app is incredibly annoying thanks to having a root component + its desire to control the DOM.

# ? Oct 31, 2016 16:10

ROFLburger: Jan 12, 2006

Anyone have any good resources for learning three.js? The examples and docs seem great but a little unapproachable for someone that's not all that familiar with 3D programming. Most of the tutorials I can find just outline how to render a scene with a cube, and not much else. Videos seem pretty scarce as well.

# ? Nov 1, 2016 04:49

wide stance: Jan 28, 2011; If there's more than one way to do a job, and one of those ways will result in disaster, then he will do it that way.

gmq posted:

Angular 2 is great, the only problem it has is that you can only use it for SPAs. Using it in a server-side app is incredibly annoying thanks to having a root component + its desire to control the DOM.

Interesting, by server-side do you mean isomorphic rendering with Angular 2 or just true multi-page MVC type back-end?

# ? Nov 1, 2016 04:59

IAmKale: Jun 7, 2007; やらないか; Fun Shoe

There's also Angular Universal that's supposed to enable server-side rendering of Angular2 apps: https://github.com/angular/universal

# ? Nov 1, 2016 15:18

lunar detritus: May 6, 2009

wide stance posted:

Interesting, by server-side do you mean isomorphic rendering with Angular 2 or just true multi-page MVC type back-end?

MVC backend, like Rails. For example with Angular 1 you could put ng-app in the layout, ng-controller in the view and you had access to angular logic within your rails view. Even Angular 1 components still work in that kind of environment. However, since Angular 2 requires total control of everything inside its own root component there's no clear upgrade path for that kind of app. Vue works much better for that kind of thing and it's what I'm trying to push as a modern replacement to Angular 1 in my job.

# ? Nov 1, 2016 18:21

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

I haven't had a need to use isomorphic/server-side rendering yet, but from my little understanding React/Redux works pretty good for that too.

For someone who has looked into in more detail or used them...how does React/Redux compare to Angular 1/2 or Vue?

# ? Nov 1, 2016 18:26

Redmark: Dec 11, 2012; This one's for you, Morph.
-Evo 2013

ROFLburger posted:

Anyone have any good resources for learning three.js? The examples and docs seem great but a little unapproachable for someone that's not all that familiar with 3D programming. Most of the tutorials I can find just outline how to render a scene with a cube, and not much else. Videos seem pretty scarce as well.

Honestly if you're not already familiar with 3D programming it's going to be pretty hard. The "docs" don't actually explain anything about anything. so when I worked with it I had to lean heavily on my co-workers at first.

Is there anything specific you need help with? Do you have a mental model of what cameras/geometries/materials do? Are you going to write shaders?

# ? Nov 1, 2016 22:04

BlueInkAlchemist: Apr 17, 2012; "He's also known as 'BlueInkAlchemist'."
"Who calls him that?"
"Himself, mostly."

I'm working through the Build an HTML5 Game book, and came across the author's direction to assemble a Modernizr library, including Modernizr.load. This is a depreciated function, based on yepnope.js, which is itself depreciated. This is the code that pre-loads jQuery as listed in the book:

JavaScript code:

Modernizr.load({
	load: "//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js", complete: function() {
		if(!window.jQuery){
			Modernizr.load("_js/jquery-1.8.2.min.js");
		}
	}
});

Head.js looks like it can do the pre-loading before Modernizr is initialized, but I'm curious what other alternatives might be out there.

# ? Nov 8, 2016 00:38

Impotence: Nov 8, 2010; Lipstick Apathy

async defer?

# ? Nov 8, 2016 01:21

plasticbugs: Dec 13, 2006; Special Batman and Robin

I'm working on a recursive problem -- it's a guessing game that plays itself and uses a simple algorithm to guess the right answer in the fewest steps.

I don't understand why I can log to the console from above and within an if statement inside my function but I can't for the life of me return a value from the exact same spot in the same if statement. The function is recursive, and it's hitting the end case where outcome === 0 but it only returns undefined from that point. I never get any output.

I am misunderstanding something very basic about Javascript return statements.

You can test this by running:

pre:

advGuessMyNumber(guess);

And, if you run it twice, in succession, it does execute the return but all the globals are the same, so I don't know why it exits without a return on the first "successful" execution.

JavaScript code:

var numberOfGuesses = 0;
var upperBound = 100;
var lowerBound = 0;
var random = false;
var guess = upperBound/2;

function advGuessMyNumber(input) {
  var outcome;
  guess = input;

  if (random === false) {
    random = randInt(upperBound)
    numberOfGuesses +=1;
  } else {
    numberOfGuesses +=1;
  };

  if (input === random) {
    outcome = 0;
  } else {
    if (input > random) {
      outcome = 1;
    } else {
      outcome = -1;
    };
};

  console.log(outcome);

  if (outcome === 0) {
    console.log("I can't return from here, but this logs out to the console");
    return "success";
  } else if (outcome > 0) {
    upperBound = input;
    advGuessMyNumber(input - Math.ceil((input - lowerBound)/2));
    } else {
    lowerBound = input;
    advGuessMyNumber(Math.floor((upperBound-input)/2)+input);
  };
};

function randInt(n) {
  return Math.floor(Math.random() * (n + 1));
};

plasticbugs fucked around with this message at 03:52 on Nov 12, 2016

# ? Nov 12, 2016 03:32

Anony Mouse: Jan 30, 2005; A name means nothing on the battlefield. After a week, no one has a name.; Lipstick Apathy

Edit: Wait ignore me I totally misunderstood your problem.

# ? Nov 12, 2016 03:56

Adbot: ADBOT LOVES YOU

# ? May 15, 2024 12:10

geeves: Sep 16, 2004

Because you have multiple return points which, IMHO, is bad code.

Add:

return advGuessMyNumber(input - M...

return advGuessMyNumber(Math.floor

You're better off with something like

https://jsfiddle.net/9h7dqgzk/2/

geeves fucked around with this message at 04:04 on Nov 12, 2016

# ? Nov 12, 2016 04:01

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.

«‹›277 »