JS Async: 17. Await

by istiq20

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Await</title>
</head>
<body>
<script>

    // Promise<JSON Product>
    function getProduct() {
        const request = new Request("api/product.json", {
            method: "GET"
        });

        const response = fetch(request);

        return response.then((response) => response.json());
    }

    // Promise<String ProductName>
    function getProductNamePromise() {
        return new Promise(function (resolve, reject) {
            getProduct()
                .then((product) => resolve(product.name))
                // .cath((error) => reject(error));
                .catch((error) => resolve("Product Not Found"));
        })
    }

    async function getProductNameAsync() {
        try {
            const product = await getProduct();
            return product.name;
        } catch (e) {
            return "Product Not Found";
        } finally {

        }
    }

    getProductNamePromise()
        .then((productName) => console.info(productName)); // MacBook Pro 15

    getProductNameAsync()
        .then((productName) => console.info(productName)); // MacBook Pro 15

</script>
</body>
</html>

JavaScript

// file: product.json
{
  "id": "1234",
  "name": "MacBook Pro 15",
  "price": 30000000
}