Operador Spread, aprendendo sobre o espalhador em Javascript - Curso de Javascript Moderno - Aula 12

แชร์
ฝัง
  • เผยแพร่เมื่อ 15 ม.ค. 2025

ความคิดเห็น • 64

  • @bartsilva5513
    @bartsilva5513 2 ปีที่แล้ว +50

    importante! ( dê like no vídeo não seja ingrato ) e recomendo da uma olhada
    no resto do comentário, creio que mais pra frente o fessor vai abordar
    esse tema mas afundo, mas se ajudar!
    let array1 = [11, 22, 33, 44]
    let array2 = array1
    //observe que temos dois arrays
    //sendo o segundo igual ao primeiro
    //imprimindo temos os dois iguais
    console.log('array1=' + array1)
    console.log('array2=' + array2)
    /* sairá assim correto
    array1=11,22,33,44
    array2=11,22,33,44
    */
    //agora observe se precisar mudar
    //valores no array1 ou array2
    //perceberá que a alteração
    //afetará os dois arrays
    console.log('

    ')
    console.log('alterado dados sem Spread')
    array2[0] = 'LL'
    array2[1] = 'OO'
    array2[2] = 'OO'
    array2[3] = 'LL'
    //observe o resultado
    //algo deu errado era pra ser
    //valores diferentes em cada array
    console.log('array1=' + array1)
    console.log('array2=' + array2)
    /* sairá assim hummm
    array1=LL,OO,OO,LL
    array2=LL,OO,OO,LL
    */
    //isso acontece porque que ao fazer
    // array2=array1
    //não é criado de fato um novo array
    //mas uma referência um apelido
    //fica espelhado
    console.log('

    ')
    console.log('alterado dados sem Spread')
    array1[0] = '--'
    array1[1] = 'TT'
    array1[2] = '=='
    array1[3] = '\\'
    //observe o resultado
    console.log('array1=' + array1)
    console.log('array2=' + array2)
    /*sairá assim
    array1=--,TT,==,\\
    array2=--,TT,==,\\
    */
    //agora se usar o operador SPREAD
    //teremos uma cópia
    console.log('

    ')
    array1 = [11, 22, 33, 44]
    array2 = [...array1]
    //temos agora uma cópia independente
    console.log('array1=' + array1)
    console.log('array2=' + array2)
    /* sairá assim correto
    array1=11,22,33,44
    array2=11,22,33,44
    */
    //alterando
    console.log('

    ')
    console.log('alterando dados depois de usar Spread')
    array2[0] = 'LL'
    array2[1] = 'OO'
    array2[2] = 'OO'
    array2[3] = 'LL'
    console.log('array1=' + array1)
    console.log('array2=' + array2)
    /*sairá assim correto
    array1=11,22,33,44
    array2=LL,OO,OO,LL
    */
    //sacou?

    • @eliascassim367
      @eliascassim367 2 ปีที่แล้ว +3

      Rodei o seu código e realmente aconteceu isso, parece que ele cria um ponteiro ao invés de uma variável imdependente, já com variáveis sem array não aconteceu isso.

  • @marcelocarlos9252
    @marcelocarlos9252 4 หลายเดือนก่อน +4

    Que bom que recuperou o canal 🙌🙌🙌

  • @ThaylaLuiza-x4q
    @ThaylaLuiza-x4q หลายเดือนก่อน +1

    Curso ótimo. Parabéns pela didática professor

  • @Lakke_Edu
    @Lakke_Edu ปีที่แล้ว +27

    Excelente aula, estou acompanhando seu curso e estou entendo a mecânica do JS, mas pra fixar deveria ter exercícios pra cada aula, as primeiras foram bem tranquilas, mas essa é o tipo de aula q se n houver aplicação prática eu esquecerei

    • @felipemelo8020
      @felipemelo8020 10 หลายเดือนก่อน +9

      eu tenho usado o ChatGPT pra criar exercícios. falo qual o tema e o nível de dificuldade e peço para ele dar as respostas no final.

  • @carlosEduardoH
    @carlosEduardoH 2 ปีที่แล้ว +10

    let n1 = [1,2,3,4,5];
    let n2 = [10,20,30,40,50];
    let n3 = [n1,n2]; // Ao se fazer a atribuição desse jeito o n3 será na verdade uma matriz com dois arrays, para se acessar por exemplo o valor 10 nessa matriz se deve usar a notação n3[1][0];
    let n4 = [...n1,...n2]; // Ao se fazer a atribuição desse jeito o n4 será um array, para se acessar o valor 10 nesse array se deve usar a notação n4[5];

    • @eliascassim367
      @eliascassim367 2 ปีที่แล้ว

      Eu vi que dá pra fazer spread em apenas uma array, só não sei a utilidade disso:
      let num1 = [1,2,3,4,5];
      let num2 = [10,20,30,40,50];
      let num3 = [...num1,num2]//Spread em apenas um array
      console.log(num3)//resposta [1, 2, 3, 4, 5, Array(5)]

    • @Prof.RafaelJunqueira
      @Prof.RafaelJunqueira 4 หลายเดือนก่อน

      @@eliascassim367 Spread é apenas para estruturas de dados simples. Eu sinceramente nunca vi alguém usar spread em complexidades maiores.

    • @JulioAndrad3
      @JulioAndrad3 3 หลายเดือนก่อน

      Po, agora realmente entendi. Passei o vídeo todo tentando identificar a diferença. Falar apenas que "espalha", como ele fez no vídeo, deixa muito vago.
      Valeu por explicar.

  • @MateusRLTJ
    @MateusRLTJ ปีที่แล้ว +2

    Que aula genial, realmente a didática do professor é fora da curva.

  • @rafaelmarques7432
    @rafaelmarques7432 9 หลายเดือนก่อน +1

    as aulas são excelentes, e a didática confesso que nunca vi igual, muito bom mesmo

  • @Archivesish
    @Archivesish 2 ปีที่แล้ว +2

    Já vi o seu curso de JS antigo todo mas tô aqui revendo todas desse novo, vlw professor.

  • @vortextemporal101
    @vortextemporal101 2 ปีที่แล้ว +2

    Muito bom poder se atualizar, como sempre fessor bruno postando ótimos conteúdos! Parabéns pelo ótimo trabalho!🖖

  • @JoaoVictor-zb8yx
    @JoaoVictor-zb8yx 3 หลายเดือนก่อน

    Obrigado pela aula professor! Sempre que tenho dúvidas venho aqui no canal pq sei que vou entender

  • @celsosilva8530
    @celsosilva8530 2 ปีที่แล้ว +3

    Outra aula show! Meu like está garantido professor.

  • @yuri-ut2yt
    @yuri-ut2yt ปีที่แล้ว

    Obrigado pela aula #CFBCursos

  • @ruansilva2795
    @ruansilva2795 2 ปีที่แล้ว

    Grande profeesor Bruno

  • @lucaslsamaro
    @lucaslsamaro 2 ปีที่แล้ว

    Fala aí Fessor, já cheguei deixando o meu like para ajudar o canal

  • @biscoito5000000
    @biscoito5000000 ปีที่แล้ว

    Essa aula foi boa demais!!!

  • @jasonloureiro7095
    @jasonloureiro7095 ปีที่แล้ว

    A aula foi top professor.

  • @yasmimvitoriasilvadeolivei488
    @yasmimvitoriasilvadeolivei488 ปีที่แล้ว

    Muito bom, professor!

  • @paulofernandes9456
    @paulofernandes9456 9 หลายเดือนก่อน

    Muito boa aula

  • @badcompanynaestrada29
    @badcompanynaestrada29 ปีที่แล้ว

    aula sensacional

  • @GilsonFN1
    @GilsonFN1 ปีที่แล้ว

    Caramba!!! muito show! vou rever o vídeo

  • @lucassoutopvp7250
    @lucassoutopvp7250 ปีที่แล้ว

    Muiiiiitoooo boa

  • @pedroecris100
    @pedroecris100 11 หลายเดือนก่อน

    BOA AULA

  • @willi_ansilvaoliveira
    @willi_ansilvaoliveira 11 หลายเดือนก่อน

    Rapaz vi essas aulas umas 5 vezes

  • @DaianaKoblitz
    @DaianaKoblitz ปีที่แล้ว

    Excelente aula!

  • @vortextemporal101
    @vortextemporal101 ปีที่แล้ว

    Spread é vida..

  • @AndersonSantos-ur4nf
    @AndersonSantos-ur4nf 2 ปีที่แล้ว

    Melhor aula, super importante, ótima explicação, obrigado por compartilhar o conhecimento, parabéns pelo seu trabalho.

  • @simplificandoamusica8744
    @simplificandoamusica8744 2 ปีที่แล้ว

    Bom dia!! Parabéns pela aula...muito boa mesmo, grande abraço e obrigado por compartilhar!

  • @IvanOlivenbaum
    @IvanOlivenbaum ปีที่แล้ว

    excelente

  • @pauloalmeida1732
    @pauloalmeida1732 2 ปีที่แล้ว

    Show

  • @TheRagreis
    @TheRagreis ปีที่แล้ว

    Aula espetacular!!!
    Parabéns

  • @andersonleite20
    @andersonleite20 2 ปีที่แล้ว

    Que didática incrivél tó curtindo muito.

  • @malexjm
    @malexjm ปีที่แล้ว

    aula top´

  • @Dier_da76
    @Dier_da76 ปีที่แล้ว +1

    [...] serve para você pode usar o operador spread para criar especificamente rasas (cópias superficiais) de arrays e objetos, o que é útil para evitar alterações acidentais do objeto original. um resumo bem superficial do assunto :)

  • @JuliCorso
    @JuliCorso ปีที่แล้ว

    Obrigado pela aula, professor!

  • @ramosandresc
    @ramosandresc 11 หลายเดือนก่อน

    👍👍👍

  • @lucianoprata86
    @lucianoprata86 5 หลายเดือนก่อน

    Assistindo até na hora do almoço no trabalho.

  • @isaque-fernandes1068
    @isaque-fernandes1068 2 ปีที่แล้ว

    Thanks 🙏

  • @Jhean_Perdido
    @Jhean_Perdido 2 ปีที่แล้ว

    brabo

  • @baxiclidesbassoneto6554
    @baxiclidesbassoneto6554 2 ปีที่แล้ว

    Excelente, obrigado!

  • @AlcinoMartins777
    @AlcinoMartins777 ปีที่แล้ว

    fessor com o querySelectorAll consigo fazer foreach nos dois modos não preciso por a chave e os pontinhos né?

  • @julioboaventura7234
    @julioboaventura7234 2 ปีที่แล้ว

    se tu usasses o querySelectorAll no objs1,funcionaria com o forEach

  • @oidanieldantas
    @oidanieldantas 2 ปีที่แล้ว +5

    Primeira vez que ouço falar.

  • @Adestudos
    @Adestudos ปีที่แล้ว

    👊

  • @Everaldobass
    @Everaldobass 2 ปีที่แล้ว +4

    Excelente conteúdo, Professor uma sugestão fazer um projeto um CRUD com JS Vanilla usando um banco de dados como Mysql ou PostgreSQL.

  • @conversas5895
    @conversas5895 2 ปีที่แล้ว +1

    Professor vai ter ELECTRON para fazer aplicativo desktop COM JAVASCRIPT?

  • @luharruda7261
    @luharruda7261 5 หลายเดือนก่อน

    😊

  • @85dansurf
    @85dansurf ปีที่แล้ว

    Talvez a minha compreensão vai ser mais clara, quando entender o funcionamento do array, no qual ainda não foi abordado.

  • @decaastro96
    @decaastro96 7 หลายเดือนก่อน

    Me Corrija se estiver errado, mas basicamente o uso mais apropriado é criar cópias para a manipulação ou testes, para caso ocorra algum problema ou imprevisto, eu não perca os dados originais?

  • @bruce6037
    @bruce6037 10 หลายเดือนก่อน

    O cara usou meu apelido

  • @guilhermelimaaraujo9409
    @guilhermelimaaraujo9409 ปีที่แล้ว

    Caso alguem esteja com problema de não alterar o conteúdo da div, tenta utilizar o codigo dessa forma
    document.addEventListener("DOMContentLoaded", function() {
    const objs1 = document.getElementsByTagName("div")
    const objs2 = [...document.getElementsByTagName("div")]
    objs2.forEach(element => {
    element.innerHTML = "curso"
    })
    });
    Dessa maneira irá sera alterado apenas após o conteudo do DOM ser carregado

  • @janainajucelly4387
    @janainajucelly4387 5 หลายเดือนก่อน

    const original = [ 1, 2, 3]
    const copia =[ original, 4]
    const copia2 =[...original, 4]
    console.log(original) [ 1, 2, 3 ] imprime original
    console.log(copia) [ [ 1, 2, 3 ], 4 ] sem ( ... ) vai imprimir um array com o array original , e fora do array original o 4 q foi adicionado
    console.log(copia2)// [ 1, 2, 3, 4 ] vai concatenar em um só array

  • @edimirk9
    @edimirk9 2 ปีที่แล้ว

    Esse TH-cam não ta avisando era bom fazer um rede de contato

  • @fredycfh
    @fredycfh 8 หลายเดือนก่อน +1

    achei esse operador muito complexo, seria mais fácil de entender ele se fosse explicando antes os arrays. Mas como eu li em "JavaScript - O guia definitivo" não é um a assunto linear. Bora quebrar a cabeça até entender hehehe

  • @messidaquebrada8536
    @messidaquebrada8536 ปีที่แล้ว

    Esse curso não é bom para iniciantes, ele deu os conhecimentos da aula praticamente pressupondo que todos conhecem funções e arrays, sendo que nem deu aula disso ainda, a linha cronologia do curso não tá muito caprichada, sem falar que poderia ter falado lá no início que seria nescessário conhecimento de HTML para entender as aulas, se não tivesse tido um curso de htlm e css taria fudido agr, do nada mandou o conceito de div e usou o dev tools na aula como se fosse algo óbvio 🫤

    • @MegaXDbr
      @MegaXDbr 11 หลายเดือนก่อน

      Cara isso é pra iniciante sim basico é aprender arrays/vetores mano

    • @MegaXDbr
      @MegaXDbr 11 หลายเดือนก่อน

      Mas toda linguagem se aprende vetores no inicio

    • @MegaXDbr
      @MegaXDbr 11 หลายเดือนก่อน

      Vetor é apenas um grupo, e cada grupo guarda valores, ai ele ensina como interagir com esses grupos chamado vetores

    • @leandrorodrigues1700
      @leandrorodrigues1700 8 หลายเดือนก่อน +2

      Se for fazer um curso de Javascript e não souber o que é uma div, recomendo iniciar por HTML, CSS, depois partir para o Javascript. E outra esse vídeo é só para aprender o que o spread faz. Ele deixou claro isso, até pq array mais adiante será abordado com mais ênfase, de longe é o melhor conteúdo TOTALMENTE gratuito, didático e completo que já encontrei.