DEV Community

Cover image for Know the difference between theses JS concept in order to skill up #1

Know the difference between theses JS concept in order to skill up #1

Code Oz on March 23, 2021

Hey ! Welcome here ! At the end of this article you will improve your javascript skills thanks to know the difference between a lot of concept that...
Read full post
Collapse
 
khangnd profile image
Khang •

The point about Spread and Rest is not correct, it should be the other way around.

Rest syntax looks exactly like spread syntax. In a way, rest syntax is the opposite of spread syntax. Spread syntax "expands" an array into its elements, while rest syntax collects multiple elements and "condenses" them into a single element

Source: MDN

Collapse
 
codeoz profile image
Code Oz •

Nice explication thank for sharing Khang!

Collapse
 
eecolor profile image
EECOLOR •

Hello, these are some interesting comparisons.

I was kinda surprised to see no example of spread in the 'Spread vs rest' section. A few examples of spread:

someFunction(...someArray)

...

const x = [...somethingIterable]

...

const y = { ...somethingIterable }
Enter fullscreen mode Exit fullscreen mode

I was also surprised to see no example of function in the 'Hoisting' section. It is the one form of hoisting that I find very useful because it allows you to optimize the readability of the code.

someFunction() // "hello"

function someFunction() {
  console.log('hello')
}

...

function SomeComponent() {
  return <button type='button' onClick={handleClick}>click</button>

  function handleClick(e) {
    ...
  }
}
Enter fullscreen mode Exit fullscreen mode

An example that hopefully communicates how you can improve readability by relying on hoisting:

function mySpecialAction() {
  const resultOfThis = doThis()
  const resultOfThat = doThat(resultOfThis)
  return resultOfThat
}

function doThis(someInput) {
  ...
}

function doThat(someInput) {
  ...
}
Enter fullscreen mode Exit fullscreen mode

This helps the reader by obtaining an overview before diving into details.

Collapse
 
codeoz profile image
Code Oz •

Nice thank you!

Collapse
 
levideang29 profile image
LeviDeang29 •

When to use var? Don't.

Collapse
 
aarone4 profile image
Aaron Reese •

Use it if you need to declare a variable globally and modify it in a function and the changed value to be available globally. Probably best to leave comments as well as this would be unusual behaviour. There are likely other ways to achieve your logic as well

Collapse
 
codeoz profile image
Code Oz •

Yes and moreover, it can be dangerous to create global variable in general since you can easily override it

Thread Thread
 
aarone4 profile image
Aaron Reese •

Sort of. You should declare it globally BECAUSE you intend to modify it within a localised scope. This is how the js frameworks work. Vue is effectively a Global object which can have it's properties manipulated by the functions within it. but then we are getting into immutability and state management.

Collapse
 
flutch profile image
flutch •

Thanks for this

Collapse
 
dylantuna profile image
Cen •

A nice article as always, thoses basics concept should be used and known by all !