Руслан Куянец | Reactify

let counter = 0;
const increment = new Promise(resolve => {
    counter++;
    resolve(0);
});
await increment;
await increment;
console.log(counter);

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

console.log = (...args) => {
    const node = document.createElement("div");
    node.innerHTML = args.join(" ");
    document.getElementById("log").appendChild(node);
};

const Counter = (props) => {
    console.log(`Counter ${props.name} rendered`);
    return (
        <div>
            Counter {props.name} : {props.count}
        </div>
    );
};

export default function App() {
    const [countB] = useState(0);
    const [countA, setCountA] = useState(0);
    const handleCountA = () => {
        setCountA(countA + 1);
    };

    return (
        <div className="App">
            <Counter name="A" count={countA} />
            <Counter name="B" count={countB} />
            <button onClick={handleCountA}>Count A</button>
        </div>
    );
}

const test = 0 => test()
const test1 = async 0 => await test1()
const test2 = async 0 => await Promise.resolve(0).then(test2)
const test3 = 0 => setTimeout(test3, 1)