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 »

Video Nasty: Jun 17, 2003

e: apparently too stupid of a question for this group.

Video Nasty fucked around with this message at 14:28 on Sep 19, 2017

# ? Sep 18, 2017 08:11

Adbot: ADBOT LOVES YOU

# ? May 16, 2024 16:00

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

mystes posted:

Isn't TypeScript pretty clearly winning? Why use Flow now?

That's why I'm asking....

Flow is baked into create-react-app so ease of use is there, but having never used either, I wonder what the advantages of typescript over flow are.

# ? Sep 18, 2017 13:51

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

Off the top of my head, reasons to use TypeScript instead of Flow:

1. TypeScript tooling support is way ahead of the Flow situation. IDEs, linters, etc...
2. Way larger TS community meaning more examples, help, books, etc
3. When it comes to available and well-maintained types for third-party libraries, TypeScript is ahead. (This is a big one IMO)
4. Related to the previous point, third-party libraries are way more likely to include type definitions for TS than for Flow.
5. TypeScript supports more advanced generic typing.
6. TS has better error messages helping you pinpoint where you hosed up.

Thermopyle fucked around with this message at 14:41 on Sep 18, 2017

# ? Sep 18, 2017 14:37

Kekekela: Oct 28, 2004

Lumpy posted:

That's why I'm asking....

Flow is baked into create-react-app so ease of use is there, but having never used either, I wonder what the advantages of typescript over flow are.

Current flow user probably migrating to TS at some point in near future mainly due to 1-4 above in Thermo's list

E:which kind of sucks cus I really like flow

# ? Sep 18, 2017 16:33

awesomeolion: Nov 5, 2007; "Hi, I'm awesomeolion."

I'm trying to add a large number of entries to pouchdb. Adding each doc is asynchronous and I started by trying

code:

setTimeout(addICDDoc, delayTime * 100, thisId, codeToAdd, contentToAdd);

Is there a better way to do this?

Edit1: It's taking like 5 minutes to add everything which makes me feel like it's a horrible approach
Edit2: Going to try a batch call thanks to my friend's suggestion

awesomeolion fucked around with this message at 16:53 on Sep 18, 2017

# ? Sep 18, 2017 16:36

reversefungi: Nov 27, 2003; Master of the high hat!

Lumpy posted:

That's why I'm asking....

Flow is baked into create-react-app so ease of use is there, but having never used either, I wonder what the advantages of typescript over flow are.

Not sure if you're aware of this (I only found out about this a few weeks ago), but you can start a create-react-app with TypeScript using the following command:

code:

create-react-app --scripts-version=react-scripts-ts

It's pretty awesome.

# ? Sep 18, 2017 16:40

lunar detritus: May 6, 2009

Apparently CoffeeScript refused to die honorably.

# ? Sep 18, 2017 19:21

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

gmq posted:

Apparently CoffeeScript refused to die honorably.

I remember I had a pile of CoffeeScript once... as soon as it was mine I compiled it one last time and deleted the source files.

# ? Sep 18, 2017 19:34

Odette: Mar 19, 2011

Skandranon posted:

I remember I had a pile of CoffeeScript once... as soon as it was mine I compiled it one last time and deleted the source files.

Yeah, I had to maintain an external library that was 100% CoffeeScript. I ended up giving up trying to grok it and just rewrote it from the ground up.

It was mostly because the previous maintainer had all application logic in one file with minimal comments, but gently caress CoffeeScript anyway.

# ? Sep 18, 2017 22:14

Dominoes: Sep 20, 2007

Odette posted:

gently caress CoffeeScript anyway.

Why, other than the small community? The syntax seems nice.

Re Typescript supporting bundling: I'd like that. It would be nice if TS would just work as-is without multiple config files, tools etc. If you're not using imports, it works like this; if you are, you need webpack etc. Also, supporting the modern JS features that sparked this discussion (include, find, Map etc) out-of-the-box would be great.

TS question: How do I specific an object type? ie:

TypeScript code:

let x: number = 5
let y: string = 'hi'
let z: boolean = true
let a: object? = {'hi': 4} = //  IIRC there's a way to do syntax like object['str', number], but what if I just want object?

Dominoes fucked around with this message at 23:29 on Sep 18, 2017

# ? Sep 18, 2017 23:20

Odette: Mar 19, 2011

Dominoes posted:

Why, other than the small community? The syntax seems nice.

It's not needed anymore now that ES2015+ has wide support.

# ? Sep 19, 2017 00:14

lunar detritus: May 6, 2009

Dominoes posted:

Why, other than the small community? The syntax seems nice.

I think that's the only reason it still exists. "Oh, you like Ruby and are unable to deal with curly brackets? Here you go."
Most of its other features were adopted by ES2015+.

Dominoes posted:

TS question: How do I specific an object type? ie:

TypeScript code:

let x: number = 5
let y: string = 'hi'
let z: boolean = true
let a: object? = {'hi': 4} = //  IIRC there's a way to do syntax like object['str', number], but what if I just want object?

Something like

JavaScript code:

let a: { [key: string]: any };

but if you don't care about the object's properties it'd just use any.

# ? Sep 19, 2017 02:29

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

Dominoes posted:

TS question: How do I specific an object type? ie:

TypeScript code:

let x: number = 5
let y: string = 'hi'
let z: boolean = true
let a: object? = {'hi': 4} = //  IIRC there's a way to do syntax like object['str', number], but what if I just want object?

There are a few ways.

1. let a: {}; // this is probably not what you want as it's literally an empty object and TypeScript will bitch at you if you put any properties on it.
2. let b: Object; // this is better, but again not what you want. this means its something that extends the JavaScript Object prototype, ie: has toString() etc.
3. let c: object; // this is what you want to represent something that is not a primitive, but does not have the baggage of the above things.

gmq posted:

Something like
JavaScript code:
let a: { [key: string]: any };
but if you don't care about the object's properties it'd just use any.

This creates a typed hashtable by specifying an indexer. This allows you to be specific (or not) about the types you can add/remove. They key can only be a string or number.

# ? Sep 19, 2017 04:53

Dominoes: Sep 20, 2007

gmq posted:

Something like
JavaScript code:
let a: { [key: string]: any };
but if you don't care about the object's properties it'd just use any.

Skandranon posted:

There are a few ways.

1. let a: {}; // this is probably not what you want as it's literally an empty object and TypeScript will bitch at you if you put any properties on it.
2. let b: Object; // this is better, but again not what you want. this means its something that extends the JavaScript Object prototype, ie: has toString() etc.
3. let c: object; // this is what you want to represent something that is not a primitive, but does not have the baggage of the above things.

This creates a typed hashtable by specifying an indexer. This allows you to be specific (or not) about the types you can add/remove. They key can only be a string or number.

Thanks bros!

# ? Sep 19, 2017 05:17

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

Dominoes posted:

Thanks bros!

I should have added one more thing. The best would be to create a specific interface for all your custom objects

code:


interface IPerson {
	name: string;
	age: number;
	awesome: boolean;
	metadata?: object; // ? makes it optional, in that TypeScript won't complain if it is not there
}

let skandranon: IPerson = { name: "Skandranon", age: 9001, awesome: true };

# ? Sep 19, 2017 05:23

Roadie: Jun 30, 2013

Also note that interfaces can be used to represent all kinds of complicated things.

code:

enum Something {
  First,
  Second,
  Third
}

interface Whatever {
  (): void // it's actually a function with other stuff added to it as properties

  // object structures
  property1: {
    nestedproperty: boolean
    othernestedproperty: number

    // allows "First", "Second", "Third"
    dynamicproperty: keyof typeof Something

    // allows "nestedproperty", "othernestedproperty", "dynamicproperty"
    anotherproperty: keyof Whatever['property1']
  }

  // an object that has fixed properties but also generic keys
  property2: {
    preset: boolean
    [key: string]: number
  }
}

And that's before you get into generics, which can do cool stuff.

code:

interface Thing<K> {
  [key: string]: K
}

const mapOfPoints: Thing<{x: number, y: number}> = {}

# ? Sep 19, 2017 09:45

Dominoes: Sep 20, 2007

Skandranon posted:

I should have added one more thing. The best would be to create a specific interface for all your custom objects

That makes sense if it's an object-like object, but not if it's a dict-like object.

# ? Sep 19, 2017 12:41

'ST: Jul 24, 2003; "The world has nothing to fear from military ambition in our Government."

Thermopyle posted:

Off the top of my head, reasons to use TypeScript instead of Flow:

1. TypeScript tooling support is way ahead of the Flow situation. IDEs, linters, etc...
2. Way larger TS community meaning more examples, help, books, etc
3. When it comes to available and well-maintained types for third-party libraries, TypeScript is ahead. (This is a big one IMO)
4. Related to the previous point, third-party libraries are way more likely to include type definitions for TS than for Flow.
5. TypeScript supports more advanced generic typing.
6. TS has better error messages helping you pinpoint where you hosed up.

I evaluated Flow and TypeScript for a React project in the spring. I expected Flow to come out of top because of the shared Facebook origin, but TypeScript was way better for all of these reasons. I'll also add that the TypeScript type checker was a lot faster than the Flow type checker, which was great for getting fast feedback on type issues while coding.

# ? Sep 19, 2017 13:40

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

Neat paper wherein they find that Flow and TypeScript reduce bugs by 15%.

They determine this by looking at fixed bugs in 398 open source projects. They check out the commit prior to the fixed bug, add type notations to the project, then see if the bug that was fixed is detected by the type checker.

# ? Sep 19, 2017 17:19

Knifegrab: Jul 30, 2014; Gadzooks! I'm terrified of this little child who is going to stab me with a knife. I must wrest the knife away from his control and therefore gain the upperhand.

I've got another odd question. I have an array that can contain a number of functions, but I cannot tell immediately what the function is.

so basically the array looks like this:

code:

let myArr = [funcA, funcB, funcC, funcB, funcC, funcA, funcA, funcA...];

The problem is I have no idea the order of the array or even if what I need is in there.

Bascially I want to iterate through the array and if the function is funcA, I want to call that function with my parameters. All of the functions take different parameters and do very different things. Sometimes an item in the array may not even be a function.

Obviously I know I can do typeOf to figure out if it is a function, but how do I tell if the function points to a specific function schema.

This becomes even more difficult because the function that is in the array is generated by a function that returns a new anonymized function so the pointer is going to be different each time.

Any ideas?

# ? Sep 20, 2017 01:01

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

I don't think there's any good way to do that. Do you already have a reference to funcA? Simply comparing would work then, but without a reference you are out of luck I think.

Edit: check out MDN for details on how you can inspect a function, which is very limited https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function

necrotic fucked around with this message at 01:13 on Sep 20, 2017

# ? Sep 20, 2017 01:11

Dogcow: Jun 21, 2005

Knifegrab posted:

This becomes even more difficult because the function that is in the array is generated by a function that returns a new anonymized function so the pointer is going to be different each time.

Any ideas?

Can you have the function that generates the new anonymized function to instead return an object that includes some description of the function? This could either be a string identifier or list of argument types (or whatever) as well as the actual function. If you can't edit that code then.. yeah I don't know. I was thinking of some super janky hack like just calling every function with every possible set of arguments in a try/catch block or something?

Edit: so I would only bother with this if you absolutely can't edit the code creating this array of stuff but there is this library on NPM for basic JS reflection stuff:

https://www.npmjs.com/package/js-reflection#module_reflection.Func+getParameters

That supposedly will get you an array of the argument names for the function (I'm presuming it's using regex and whatnot with Function.toString()). This would require the argument names in these generated anonymized functions to have remained meaningful which seems unlikely. If that's not the case then yeah I don't think it's really possible.

Dogcow fucked around with this message at 01:34 on Sep 20, 2017

# ? Sep 20, 2017 01:25

reversefungi: Nov 27, 2003; Master of the high hat!

Do the functions have unique information? One very hacky way I could think of doing this is maybe calling toString() on each function and comparing substrings to see if the function matches what I'm looking for. Of course this is probably a really horrible way to handle this but I can't think of anything better offhandedly besides what the posters above mentioned.

reversefungi fucked around with this message at 01:53 on Sep 20, 2017

# ? Sep 20, 2017 01:50

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

This is a real mess of a problem, I don't think there are any good solutions to dealing with your array. Can you change this array at all? Dogcow's object suggestion is what I would do if you can.

# ? Sep 20, 2017 04:07

Odette: Mar 19, 2011

Has anyone got the following combination working in Sublime Text: ESLint + Standard + Prettier?

# ? Sep 20, 2017 04:20

reversefungi: Nov 27, 2003; Master of the high hat!

Just curiously, do other languages have a good way of handling a situation like that, or is that a tricky scenario no matter what language you're working in?

# ? Sep 20, 2017 05:43

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

Not that I'm aware of... if they are anonymous functions. You could probably use reflection to figure this out in C#, but that's stupid slow and complicated. A proper data structure is a far better solution.

# ? Sep 20, 2017 05:48

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

The Dark Wind posted:

Just curiously, do other languages have a good way of handling a situation like that, or is that a tricky scenario no matter what language you're working in?

In python you can use the inspect standard library module to get the argument spec for any function.

Thermopyle fucked around with this message at 06:11 on Sep 20, 2017

# ? Sep 20, 2017 06:08

Jabor: Jul 16, 2010; #1 Loser at SpaceChem

It honestly sounds like a big X-Y problem. Presumably these functions are being produced on this form because it's somehow useful to some other component, and I'd really like to see what that other component looks like.

# ? Sep 20, 2017 07:59

Wheany: Mar 17, 2006; Spinya^{ha^{ha^haha}ha}ha_{ha_{ha_haha}ha}ha!; Doctor Rope

This is definitely a case of "what? why?"

# ? Sep 20, 2017 08:17

Knifegrab: Jul 30, 2014; Gadzooks! I'm terrified of this little child who is going to stab me with a knife. I must wrest the knife away from his control and therefore gain the upperhand.

Sorry guys, let me give you the full explanation. I am trying to figure out a way to list all the routes and auth capabilities within my express server. After app.use'ing all of my router files, I iterate though the router. I'm on mobile and away from my computer right now so I can't give exact code but will do so tomorrow morning. Basically within the router files we have this:

code:

 router.get('/item', auth('permission'), getItem);

auth() is a function which returns a callback that router can use as normal middle ware.

So after I iterate through all of the routes in my app by calling forEach on app._router.stack, I then access the path, method, and the middle ware call back with a parameter to dump the capabilities it was set up with. Problem is, not every router uses the auth middle ware so I can't always assume it's there.

Yes this is weird and dumb and I'm probably doing this a really stupid way.

Like I said I'll be more explicit tomorrow when I am at my work terminal.

# ? Sep 20, 2017 08:53

Roadie: Jun 30, 2013

Knifegrab posted:

I've got another odd question. I have an array that can contain a number of functions, but I cannot tell immediately what the function is.

so basically the array looks like this:
code:
let myArr = [funcA, funcB, funcC, funcB, funcC, funcA, funcA, funcA...];
The problem is I have no idea the order of the array or even if what I need is in there.

Bascially I want to iterate through the array and if the function is funcA, I want to call that function with my parameters. All of the functions take different parameters and do very different things. Sometimes an item in the array may not even be a function.

Obviously I know I can do typeOf to figure out if it is a function, but how do I tell if the function points to a specific function schema.

This becomes even more difficult because the function that is in the array is generated by a function that returns a new anonymized function so the pointer is going to be different each time.

Any ideas?

code:

const someFunction = function() { return }
someFunction.typeForComparisonPurposes = 'funcA'

Then put them into the array.

# ? Sep 20, 2017 09:16

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

Skandranon posted:

You could probably use reflection to figure this out in C#, but that's stupid slow and complicated.

You could also make a DynamicObject that overrides TryInvoke.

And by 'You could' I mean I've totally done that

# ? Sep 20, 2017 14:53

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

Knifegrab posted:

Sorry guys, let me give you the full explanation. I am trying to figure out a way to list all the routes and auth capabilities within my express server. After app.use'ing all of my router files, I iterate though the router. I'm on mobile and away from my computer right now so I can't give exact code but will do so tomorrow morning. Basically within the router files we have this:
code:
 router.get('/item', auth('permission'), getItem); 
auth() is a function which returns a callback that router can use as normal middle ware.

So after I iterate through all of the routes in my app by calling forEach on app._router.stack, I then access the path, method, and the middle ware call back with a parameter to dump the capabilities it was set up with. Problem is, not every router uses the auth middle ware so I can't always assume it's there.

Have you considered setting up some other data structure that has all your route information organized better, with explicit metadata that would tell you what to do with each route that you could iterate over? You could then have your router set up based on this new object, so you don't duplicate the data, but this way you are not constrained to iterating over something a 3rd party gives you.

# ? Sep 20, 2017 16:26

Knifegrab: Jul 30, 2014; Gadzooks! I'm terrified of this little child who is going to stab me with a knife. I must wrest the knife away from his control and therefore gain the upperhand.

Skandranon posted:

Have you considered setting up some other data structure that has all your route information organized better, with explicit metadata that would tell you what to do with each route that you could iterate over? You could then have your router set up based on this new object, so you don't duplicate the data, but this way you are not constrained to iterating over something a 3rd party gives you.

There are many ways I would prefer to do it, such as this, but this is the way I have to do it (I am hardly the only one on this project).

Roadie posted:

code:

const someFunction = function() { return }
someFunction.typeForComparisonPurposes = 'funcA'

Then put them into the array.

I will try this, but I don't completely understand it. Is a function an object? How can you just assign a property to a function reference?

# ? Sep 20, 2017 16:37

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

Knifegrab posted:

I will try this, but I don't completely understand it. Is a function an object? How can you just assign a property to a function reference?

Yes.

Because functions are objects.

# ? Sep 20, 2017 16:50

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

Knifegrab posted:

There are many ways I would prefer to do it, such as this, but this is the way I have to do it (I am hardly the only one on this project).

I will try this, but I don't completely understand it. Is a function an object? How can you just assign a property to a function reference?

JavaScript is strange sometimes, try not to think about it too much...

# ? Sep 20, 2017 17:06

Knifegrab: Jul 30, 2014; Gadzooks! I'm terrified of this little child who is going to stab me with a knife. I must wrest the knife away from his control and therefore gain the upperhand.

Thermopyle posted:

Yes.

Because functions are objects.

Sorry, of course they are, everything is objects. Forget it Jake, its object-town.

# ? Sep 20, 2017 17:43

reversefungi: Nov 27, 2003; Master of the high hat!

Knifegrab posted:

Sorry, of course they are, everything is objects. Forget it Jake, its object-town.

This is why you can do things as delightfully weird as

JavaScript code:

let foo = [];
foo[1.618] = "gently caress";
foo[1.618]; // "gently caress"

# ? Sep 20, 2017 18:44

Adbot: ADBOT LOVES YOU

# ? May 16, 2024 16:00

Ranzear: Jul 25, 2013

Do you know the parameters for any given function by name, exhaustively? Your list of router functions can be thought of as static functions. You don't have to add anything to them, all you really need is a lookup for what "type" each function can take as Roadie brought up. Think of the parameter set to each function as a duck typed object. Your duck types would be like "minimalParams" and "allTheParams".

# ? Sep 20, 2017 19:28

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

«‹›277 »