Resumo da Live TikTok 18082024 – Desvendando o Código

Olá Pessoal!

Na Live do dia 18/08/2024 foram abordados os seguintes temas:

Condicionais Simples;
Vetores;
Escopo;
Eventos;
Criação e Exclusão de Itens com JS e HTML.

METODOS PARA MANIPULAR VETORES
const list1 = [1,2,3,4,5];
list1.pop();
console.log(list1);

const list2 = [1,2,3,4,5];
list2.shift();
console.log(list2);

const list3 = [1,2,    3,4,5];
list3.splice(2, 0, 99 );
console.log(list3);

ESCOPO1
function exemploEscopo(){
    var b = 3;
    if(b == 3){
        var escopoVar = "Eu sou o VAR";
        let escopoLet = "Eu sou o LET";
        const escopoConst = "Eu sou a Const";
        console.log(escopoVar);
        console.log(escopoLet);
        console.log(escopoConst);
    }
    console.log(escopoVar);
    //console.log(escopoLet);
    //console.log(escopoConst);
}
exemploEscopo();

ESCOPO2

const numeros = [1,2,3,4];// escopo global

var a = 20;

if(a == 20){
numeros.push(99);
console.log(numeros); // escopo local
}

ESCOPO3

var b = 10;
var j = 50;

if(b == 10 ){
var j = 20;
console.log(j);
}
console.log(j);

EVENTOS1

Eventos

<p id="meuParagrafo">   Texto Original</p>
<button onclick="alterar()"> Alterar</button>

<script>
    const p = 
    document.getElementById('meuParagrafo');

    function alterar(){
        p.innerText = "Alteracao feita!";
        p.style.color = 'red';
        p.style.fontSize = '30pt';
    }
</script>

EVENTOS3

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Eventos Adicionar e Remover Item</title>
</head>
<body>

    <ul id="minhaLista">
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>

    <button id="botaoAdicionar">
        Adicionar</button>
    <button id="botaoRemover">
        Remover Último Item</button>
    
        <script>
            const add = 
            document.getElementById('botaoAdicionar');
            const del = 
            document.getElementById('botaoRemover');

        add.addEventListener('click', function(){
             const novoItem = document.createElement('li');
             novoItem.textContent = 'Item Novo';
             
            document.getElementById('minhaLista')
            .appendChild(novoItem);
            });
        
        del.addEventListener('click', function(){
            const lista = document.getElementById('minhaLista');
            lista.removeChild(lista.lastElementChild);
        })

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