NovoManu

const arr = ['Hello', 'World']
const [hello, world] = arr
console.log(`${hello} ${world}`) // Expected output: Hello World

const obj = { h: 'Hello', w: 'World', again: 'Again' }
const { again, w, h } = obj
console.log(`${h} ${w} ${again}`) // Expected output: Hello World Again

// It's possible to rename object keys
const { h: hello1, w: world1 } = obj

NovoManu

// Default parameters
const add = (a, b = 1) => a + b

console.log(add(1,5)) // Expected output: 6
console.log(add(1)) // Expected output: 2

// Rest parameters
const myFunc = (a, ...rest) => {
  console.log(rest)
}

NovoManu

// One line return
const increment1 = (number) => ++number
// or without parentheses
const increment2 = number => ++number
// Analog in ES5
var increment3 = function(number) {
  return ++number 
}
// One line return object
const returnObj1 = () => ({ a: 1, b: 2 })

NovoManu

const hello = 'Hello'
const world = 'World'

console.log('Hello World') // expected output: Hello World
console.log(`Hello ${world}`) // expected output: Hello World
console.log(`${hello} World`) // expected output: Hello World
console.log(`${hello} ${world}`) // expected output: Hello World

for (let i=0; i<10; ++i) {
  console.log(`Index is ${i}`) // dynamic output

NovoManu

const PI = 3.14 // immutable variable, could't be redeclared
const a = 5

let b = 6
let b = 7

{
  let b = 8 
}

NovoManu

<template>
  <component :is="layout">
    <slot />
  </component>
</template>

<script>
import AppLayoutDefault from './AppLayoutDefault'
import { markRaw, watch } from 'vue'
import { useRoute } from 'vue-router'

NovoManu

import Vue from 'vue'
import VueRouter from 'vue-router'
import routes from './routes'

Vue.use(VueRouter)

export default Promise.all(routes).then(routes => {
  const router = new VueRouter({
    mode: 'history',
    routes

NovoManu

<script>
import middleware from '@/middlewares/myMiddleware'

export default {
  name: 'Home',
  layout: 'MyLayout',
  middlewares: { middleware }
}
</script>

NovoManu

const defaultLayout = 'AppDefaultLayout'

export default pages
  // Note: remove nested routes from pages
  .filter(path => !path.some(childrenFilter))
  .map(async path => {
    const { default: component } = await import(`../views/${path.join('/')}`)
    const { layout, middlewares, name } = component
    const route = `/${generateRoute([...path])}`
    let children = []

NovoManu

<template>
  <div>
    <h1>This is an user profile child page</h1>
  </div>
</template>

<script>
export default {
  name: 'UserProfile'
}