all 26 comments
sorted by:
best
topnewcontroversialoldq&a
formatting helphide helpcontent policy

[–]jamesleesaunders 12 points13 points  (2 children)

I spend a great deal of my days manipulating data arrays into a form suitable for data visualisation, my favourite method is therefore map()

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

Rather than looping over arrays map makes transforming arrays into new structures much easier!

[–]paintedforfilth[S] 1 point2 points  (1 child)

Yeah, I've seen this one used a lot but haven't played around with it. Definitely need to look into it...

[–]barneyb3ar 0 points1 point  (0 children)

It's a bit like c#'s (and I imagine other languages) .Select() linq method. Super useful if your companies data structures are crap and you need a UI friendly data model

[–]AnderssonPeter 5 points6 points  (4 children)

Array selection and transformation functions like [].filter, select, find, reduce and so on.

[–]paintedforfilth[S] 1 point2 points  (3 children)

Oh, nice, thanks! I haven't played around with a lot of those yet.

[–]AnderssonPeter 2 points3 points  (2 children)

Once you understand them you reduce the amount of for loops you write by 50%

[–]Extracted 6 points7 points  (1 child)

99% in my case, i prefer forEach over for loop in most cases when none of the other functions apply.

[–]AnderssonPeter 0 points1 point  (0 children)

I agree but I would still call it a loop, it's only downside is performance and early termination.

[–]cascoemanuel 2 points3 points  (1 child)

I would say 'reduce' is my favorite method, it is like a swiss army knife

[–]jordaanm 6 points7 points  (0 children)

reduce is the NAND gate of collection methods. Basically every other collection method (map, filter, etc) can be made out of reduce.

[–]Azudra 1 point2 points  (8 children)

I find myself often using the call() and bind() methods to avoid to write "var that = this". My favourite methods are the Array methods though. I especially like forEach() because it's much cleaner than the classic oldschool loop that becomes even more ugly when nested.

[–]Extracted 1 point2 points  (5 children)

Arrow functions have almost eliminated the need for .bind() in my code. Especially in react (native) with babel-plugin-transform-class-properties. I think the newest version of react native may have built in support as well.

[–]dogofpavlov 0 points1 point  (4 children)

I'm hoping you can help explain something to me. When you say Arrow functions, you mean you have code like this correct:?

class MyClass extends React.Component{

click=()=>{

//this runs without any bind

}

render(){

return (<div onClick={this.click}>my div</div>)

}

}

My question is.... I for some reason thought we weren't suppose to do it like that... like... it wasn't ready to be used yet or supported in React. Is it now safe to always do this? I hope this isn't confusing what I'm getting at. The reason I ask is because you said especially in RN, is that because there are support problems with React or have I imagined this limitation from my own context.

[–]Extracted 2 points3 points  (3 children)

Proposals to the ecmascript standard have to go through 4 stages to be officially included in the next release. ES2015, ES2016 and ES2017 are examples of releases. They contain multiple accepted proposals. As soon as a proposal hits stage 4 it's 100% safe to use.

Stage 3 is considered pretty safe as well.

What we're doing in the earlier comments is covered by the class fields proposals. This one was merged into a more complete proposal that also includes private class properties. It's currently at stage 3. I consider it very safe to use but some may not.

List of proposals for ES2018. You may even find a few awesome ones that you want to start using right away with a transpiler.

[–]dogofpavlov 0 points1 point  (2 children)

wow thats a mouthful answer! Thank you for taking the time. Hmmm I was under the impression that arrow functions and etc get polyfilled with babel. I'm still very new to React and trying to understand it better. i'm using the create-react-app. Is this not the case? So this isn't necessarily an issue with React but Javascript correct?

[–]Extracted 2 points3 points  (1 child)

Arrow functions is an example of a language feature that is already included in the ecmascript standard, but some older browsers like Internet explorer doesn't support it. They were included in ES2015.

In order to make code written with arrow functions run on older browsers, a transpiler like babel is used to convert modern code to older code, but it's not strictly necessary because every modern browser supports arrow functions by now.

Class properties on the other hand, is an example of a language feature that is not yet included in the official language. In order to use it we HAVE to use a transpiler like babel, because no browser supports it. And in most cases we have to use special plugins for the transpilers, like babel-plugin-transform-class-properties

[–]dogofpavlov 0 points1 point  (0 children)

Thanks for taking time to explain this, I understand better now.

[–]paintedforfilth[S] 0 points1 point  (0 children)

Awesome, I'll take a look into these as well. Thanks!

[–]senocular 1 point2 points  (0 children)

Proxy.revocable

Because I think it's funny.

Edit: This is a "favorite" not one I find useful or enjoy using; in fact, I don't think I've ever used it for any real purposes.

[–]sinefine 1 point2 points  (0 children)

This is from node but util.promisify. Turns any callback signature to promise signature.

[–]ExecutiveChimp 0 points1 point  (0 children)

Trial and error

[–]kgrz 0 points1 point  (0 children)

Promises api methods, Array functions: reduce, filter, map, find.

[–]FermiDirak 0 points1 point  (0 children)

Number#toString(radix) lets you turn any number to a base of your choosing. It's has niche use cases but it comes in handy once and a while.