Ad
esamaralvs.moragaFailed Tests

Criando e executando uma Promise com async/await

Code
Diff
  • async function a() {
  return 'ok'
}

async function b() {
  try {
    const res = await a()
    console.log(res)
  } catch(e) {
    console.log(e)
  }
}
    • function a() {
    • return new Promise(function (resolve, reject) {
    • resolve('ok');
    • });
    • async function a() {
    • return 'ok'
    • }
    • function b() {
    • a().then(function(res) {
    • console.log(res);
    • }).catch(function(err) {
    • console.log(err);
    • })
    • async function b() {
    • try {
    • const res = await a()
    • console.log(res)
    • } catch(e) {
    • console.log(e)
    • }
    • }
esamaralvs.moraga

Capturando um promise reject

Code
Diff
  • function monteCarlo() {
  return new Promise(function (resolve, reject) {
    reject({server: 'down'});
  });
}

async function main() {

  try {
    const results = await monteCarlo();
  } catch(e) {
    console.log(e)
  }
  
  return true;
}
    • function monteCarlo() {
    • return new Promise(function (resolve, reject) {
    • reject({server: 'down'});
    • });
    • }
    • async function main() {
    • // converter para ES6
    • const results = await monteCarlo();
    • try {
    • const results = await monteCarlo();
    • } catch(e) {
    • console.log(e)
    • }
    • return true;
    • }
esamaralvs.moraga

Async / await em Promises

Code
Diff
  • function monteCarlo() {
  return new Promise(function (resolve, reject) {
    resolve([{
      titulo: 'UOL - O Melhor conteúdo'
    }]);
  });
}

async function main() {
  const response = await monteCarlo()
  
  return true;
}
    • function monteCarlo() {
    • return new Promise(function (resolve, reject) {
    • resolve([{
    • titulo: 'UOL - O Melhor conteúdo'
    • }]);
    • });
    • }
    • async function main() {
    • // converter para ES6
    • monteCarlo().then(function(response) {
    • console.log(response)
    • });
    • const response = await monteCarlo()
    • return true;
    • }
esamaralvs.moragaFailed Tests

Remover itens duplicados

Code
Diff
  • const main = () => {
  
  let links = [
    'https://www.uol',
    'https://www.bol.com.br',
    'https://www.uol',
    'https://noticias.uol.com.br',
    'https://www.bol.com.br',
  ];
  
  // converter para ES6
  var uniqueLinks = links.reduce(function (carry, item) {
    if (carry.indexOf(item) === -1) {
      carry.push(item);
    }
    return carry;
  }, []);
  
  
  return new Set(links);
};
    • const main = () => {
    • let links = [
    • 'https://www.uol',
    • 'https://www.bol.com.br',
    • 'https://www.uol',
    • 'https://noticias.uol.com.br',
    • 'https://www.bol.com.br',
    • ];
    • // converter para ES6
    • var uniqueLinks = links.reduce(function (carry, item) {
    • if (carry.indexOf(item) === -1) {
    • carry.push(item);
    • }
    • return carry;
    • }, []);
    • return uniqueLinks.length;
    • return new Set(links);
    • };
esamaralvs.moraga

Concatenar listas

Code
Diff
  • const main = () => {

  let a = [1, 2, 3];
  
  let b = [4, 5, 6];
  
  let c = [7, 8, 9];

  // converter para ES6
  var d = [...a, ...b, ...c]
  
  return d.join(',');
}
    • const main = () => {
    • let a = [1, 2, 3];
    • let b = [4, 5, 6];
    • let c = [7, 8, 9];
    • // converter para ES6
    • var d = a.concat(b).concat(c);
    • var d = [...a, ...b, ...c]
    • return d.join(',');
    • }
esamaralvs.moraga

Sobrescrevendo o constructor da classe base

Code
Diff
  • class Component {
  constructor(dom) {
    console.log('Parent class constructor executed!');
    this.dom = dom;
  }
  
  onCreate() {
    return true;
  }
}

class Collection extends Component {
  constructor(dom) {
    super(dom);    
  }
}
    • class Component {
    • constructor(dom) {
    • console.log('Parent class constructor executed!');
    • this.dom = dom;
    • }
    • onCreate() {
    • return true;
    • }
    • }
    • class Collection {
    • //
    • class Collection extends Component {
    • constructor(dom) {
    • super(dom);
    • }
    • }
esamaralvs.moraga

Herdando classes e sobrescrevendo métodos

Code
Diff
  • class Component {
  constructor(dom) {
      this.dom = dom;
  }
  
  onCreate() {
    console.log('onCreate from parent class');
    return 'missing';
  }
  
  static on(event, callback) {
    callback();
  }
  
  async emit(event, data) {}
}

class Title extends Component {
  onCreate(){
    super.onCreate();
    return 'super!';
  }
}
    • class Component {
    • constructor(dom) {
    • this.dom = dom;
    • }
    • onCreate() {
    • console.log('onCreate from parent class');
    • return 'missing';
    • }
    • static on(event, callback) {
    • callback();
    • }
    • async emit(event, data) {}
    • }
    • class Title extends Component {
    • onCreate(){
    • super.onCreate();
    • return 'super!';
    • }
    • }
esamaralvs.moraga

Criando uma Classe

Code
Diff
  • class Component {
  constructor(dom) {
    this.dom = dom
  }
  onCreate() {
    return this.dom;
  }
}
    • function Component(dom) {
    • this.dom = dom;
    • this.onCreate = function() {
    • class Component {
    • constructor(dom) {
    • this.dom = dom
    • }
    • onCreate() {
    • return this.dom;
    • }
    • }
esamaralvs.moraga

Criando um escopo

Code
Diff
  • {
  function todo() {
    return 'Walk';
  }
  
  // reescrever em ES6
  {
  
    function todo() {
      return 'Run';
    }
  
  }
}
    • function todo() {
    • return 'Walk';
    • }
    • // reescrever em ES6
    • (function() {
    • {
    • function todo() {
    • return 'Run';
    • return 'Walk';
    • }
    • })();
    • // reescrever em ES6
    • {
    • function todo() {
    • return 'Run';
    • }
    • }
    • }
esamaralvs.moraga

Method shorthand e computed property names

Code
Diff
  • // reescreva usando ES6

var prop = 'myProp';

var obj = {
  [prop]: 123,
  myFunc() {
    return this[prop];
  } 
};
    • // reescreva usando ES6
    • var prop = 'myProp';
    • var obj = {
    • myFunc: function() {
    • [prop]: 123,
    • myFunc() {
    • return this[prop];
    • }
    • };
    • obj[prop] = 123;
esamaralvs.moraga

Property Shorthand

Code
Diff
  • var title = 'UOL - O melhor conteúdo';

var share = {
  fb: {
    title
  },
  twitter: {
    tweet: title
  }
};
    • var title = 'UOL - O melhor conteúdo';
    • var share = {
    • fb: {
    • title: title
    • title
    • },
    • twitter: {
    • tweet: title
    • }
    • };
esamaralvs.moraga

Template Literals

Code
Diff
  • var bg = `gray`;

var css = ` <style>
  body { 
    background: ${bg};
    color: black;
  }
  </style>`;
    • var bg = 'gray';
    • var bg = `gray`;
    • var css = '' +
    • '<style>' +
    • 'body {' +
    • ' background: '+ bg + ';' +
    • ' color: black;'
    • '}' +
    • '</style>';
    • var css = ` <style>
    • body {
    • background: ${bg};
    • color: black;
    • }
    • </style>`;