Learn to Code via Tutorials on Repl.it!

← Back to all posts
Learning modern Javascript!
h
firefish

Learning es6 JS!

I've met a lot of people on repl.it who code in JS. But, they only code in old JS, and not es6. I'm also adding here some very useful syntactic features that not many seem to know.

NOTE: All of these do apply to NodeJS as well.

Functions

Everyone agrees. Functions are cool. But now we have some shorthand!

Pros

Arrow functions use an arrow (=>, sometimes known as the implies symbol) to denote when the parameters end and when the content finishes. Did I mention, there is no convoluted function keyword?

That's a lot easier to type. But, there is more shorthand! For instance, you only have one parameter. You can now omit the parentheses!

That is really simple. But it can be simplified further! If a value is returned, it is possible to omit the braces. It's hard to describe, I'll show you what I mean.

We've taken from a three line function, to a 10 character arrow function! You see the upsides.

Cons

I'm not saying old-fashioned functions don't have their use anymore. Far from it. If you make OOP projects in js, this is why you still use normal functions.

Arrow functions do some funny things with this scoping.

An arrow function uses this as the this at where the function was declared, and normal functions use this in the scope of the caller. Here's an example.

That was probably a bit confusing, so make sure you understand what the comments say before we move on.

Anti-hoist measures

In old JavaScript there was (and still is) a phenomenon known as hoisting. This meant anything declared got hoisted to the top of the scope, which is extremely counter-intuitive.

Doesn't make sense, right? There are declarations that don't hoist, which are let (which declares as mutable) and const (which declares as immutable).

Modules in JS

This is a recent addition: the import keyword! No RequireJS needed, just pure imports. Here's an example, with two files.

index.js

util.js

Illogical Logic

I've seen many people not know about the simple if (a). Here are just some simple examples:

It's painful. I know. Try this instead:

In this use case, we can do even better, using the ternary operator:

For those that don't know about the ternary operator, here's something to help you:

The mnemonic goes that it's like a question.

Anti-type

Some people I also have seen don't know the difference between == and ===. == matches value only, however === matches value and type.

In other words:

The end!

If you didn't understand some concepts in the tutorial, don't ask me, it's good practise to learn to use Google! :)

Voters
programmeruser
EpicGamer007
StringentDev
ch1ck3n
ANDREWVOSS
DynamicSquid
EthanBlesch
firefish
Comments
hotnewtop
StringentDev

yeah i recently found out about the tenery operators and then i felt so dumb for not using them. I also found classes 5 weeks back.

welp, thats why im still learning JS.

firefish

@StringentDev ternary operators are a hangover from C btw

StringentDev

@firefish huh interesting.

StringentDev

@firefish i think we need to rewrite our imports (They are using RequireJS)

firefish

@StringentDev so yeah any c-style language (i.e. C C++ C# Java JS etc) supports ternary. it's probably one of the most widely hated features

firefish

@StringentDev so? is requirejs bad?

StringentDev

@firefish well requireJS is pretty bad if we have a better alt for importig modules as Require is pretty slow.

firefish

require is pretty slow

@StringentDev js is slow in general. As a wise man once said:

everything is so fast that if it's horribly inefficient it doesn't matter
- Totally A. Real-Person, 2022

CyberHacker101

For my whole repl life ive thought you were a mod lkdsjo aodno andoijawniownan @firefish

firefish

@CyberHacker101 i've never been a mod, i'm not notable enough

ANDREWVOSS

I hate JavaScript but this tutorial is cool

EpicGamer007
firefish

@EpicGamer007 oh, you mean that cycle squeezer

firefish

@EpicGamer007 how is he ahead if i made it to highlights?

EpicGamer007

@firefish wdym "to highlights"?

firefish

@EpicGamer007 to monthly repls (or as they call it now monthly highlights) duh have you been living under a rock

EpicGamer007

@firefish i have not been living under a rock but thank you. i think you made it because now its just tutorials but back then it was share posts and tutorials so tutorials and stuff from other boards didn't really make the spotlight /shrug, but heres an upvote, i never said it was a bad tutorial anyways

DynamicSquid

Nice tutorial! Although JS sucks

firefish

@DynamicSquid even though i do love js, i agree, it does suck, I mean there's a reason why you can only find hoisting in javascript and nowhere else