Goloburda

// https://www.youtube.com/watch?v=cCOL7MC4Pl0

const button = document.getElementsByTagName('button')[0]

button.addEventListener('click', () => {
  setTimeout(() => console.log('Timeout 1'))
  Promise.resolve().then(() => console.log('Microtask - 1'))
  console.log('task 1')
})

Goloburda

function makeRequest(arg) {
  return new Promise(res => {
    setTimeout(() => res(arg), 2000);
  });
}
const person = {
  name() {
    return makeRequest("Mikita");
  },
  age() {

Goloburda

const arr = [
  {name: "Mikita", age: 1, city: "Hrodna"}, 
  {name: "Martin", age: 2, city: "Berlin"},
  {name: "Nikita", age: 3, city: "Hrodna"},
  {name: "Nikita", age: 4, city: "Hrodna"},
  {name: "Sasha",  age: 2, city: "Minsk"},
  {name: "Sasha",  age: 2, city: "Paris"},
  {name: "Sasha",  age: 2, city: "Hrodna"},
  {name: "Martin", age: 2, city: "Berlin"},
  {name: "Martin", age: 2, city: "London"},

Goloburda

const cache = new Map();

const setCallback = (element, key) => {
  if (cache.has(key)) {
    return cache.get(key);
  }

  throw element;
};

Goloburda

import React, { useState } from "react";
import Child from "./Child";
import "./styles.css";

const MyReact = {
  storage: {},
  myCallback: function(fn) {
    if (this.storage.fn === undefined) {
      this.storage.fn = fn;
    }

Goloburda

const obj = {
  name: "Mikita",
  setName: function(name) {
    this.name = name;
  },
  asyncName: function() {
    const { name } = this;
    setTimeout(() => {
      console.log("async", name);
      console.log("async2", this.name);

Goloburda

//Component to style doc: https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/Switch/Switch.js

import Switch from "@material-ui/core/Switch";
import styled from "styled-components";
import { withStyles } from "@material-ui/core/styles";

const StyledSwitch = styled(Switch)`
  .MuiSwitch-colorSecondary {
    color: green;
    :hover {

Goloburda

const App = () => {
  // Ugly. I always want to declear hooks at the top. 
  // But I can't swap getDefaultValue and useState (error getDefaultValue is't a function), 
  // because I use function assigmnet and in that way function does't hoisting.
  const getDefaultValue = () => {
    return "Default value";
  };
  
  const [title, setTitle] = useState(getDefaultValue());
  

Goloburda

/*
The setState() method does not immediately update the state of the component, 
it just puts the update in a queue to be processed later. 
React may batch multiple update requests together to make rendering more efficient.
Due to this, special precautions must be made when you try to update 
the state based on the component's previous state.
*/  

state = { count: 1 };
  componentDidMount() {

Goloburda

const fn1 = arg => arg.toUpperCase();

const fn2 = arg =>
  arg
    .split("")
    .reverse()
    .join("");

const fn3 = arg => arg + "WoW";