Javascript MENTE

54.91k views3572 WordsCopy TextShare
Lucas Montano
✅ Torne-se membro para obter aulas técnicas exclusivas comigo: https://www.youtube.com/channel/UCyHO...
Video Transcript:
Por que que o JavaScript mente para ti vamos dar uma olhada nesse vídeo do galego Jesser JavaScript nunca mentiu para mim você que está mentindo vamos ver então cara jav script mentiu para ti mentiu porque ele falou que ia tu ia conseguir um emprego né vamos ver que o Galego tem a dizer se você pegar qualquer livro da nossa área da computação e estudar o que que é um Array e depois você abr lá o seu código a sua ideia em JavaScript ou em Python e tentar colocar em prático que você estudou vai ficar muito
claro que ou o livro ou o JavaScript ou o Python estão mentindo para você um os dois não tá contando a verdade nesse vídeo a gente vai olhar uma linguagem de verdade que é Rust uma de mentira que é JavaScript e ver Por que um Array em Rust é um Array E por que que o Array em JavaScript é uma mentira vou pegar uma linguagem de verdade tá o Rust não e não essa essa linguagen zinha de mentira que vocês usam aí qual linguagem vocês usam falar nisso vocês usam ah Rust vocês usam um node
JS ou typescript é o mais legal quando a galera coloca né node JS como linguagem É se bem que quando fala de JavaScript implementação de arrey quem tá certo o JavaScript ou o node né ou o V8 que na verdade tipo JavaScript é só o que tu é só a sín taxe é só o que tu escreve tá ligado é só o que tu escreve não é o que roda o arrei o que roda o arrei não é o teu JavaScript de qualquer forma ou é o html6 ou é o flutter gente eu trabalho com
JavaScript eu tenho lugar de fala para falar mal bom primeiro ah viu ah você vocês acharam que O que O galego tava o cara trabalha com JavaScript Então tudo tudo bem ele tá ele tá zoando a linguagem que ele trabalha pode tá liberado não pode acho que tá liberado linguagem de verdade aqu a linguagem que não mente é aquela que paga os meus boletos primeiro pra gente ver quem tá certo e quem tá mentindo nas linguagens a gente precisa que concordar numa definição formal de o que que é um Array tradicionalmente falando um Array vai
ser um espaço contigo na memória em que as coisas estão sequencialmente uma do lado da outra não tem nada na memória Entre esses itens no Array e dado que a gente alocou esse espaço contigo a gente vai saber onde todos os itens do Array estão em memória de modo que eu consiga acessar qualquer um desses itens de maneira imediata Então imagina o seguinte isso daqui é a nossa memória cada um desses quadradinhos pode tá representando sei lá o8 bytes enfim não importa e eu quero alocar um espaço para armazenar um Array Qual que é o
detalhe importante aqui imagina que eu inicializo um Array aqui ok se meu Array tem um elemento esse um elemento cabe aqui nesse espaço da memória mas imagina que eu quero armazenar um segundo elemento tanto a esquerda quanto à direita eu não tenho mais espaço ou seja para armazenar um segundo item eu teria que desse item aqui apontar para um segundo item E aí qual que é o nome disso é um link linked list bom E aí deixou de ser um Array Isso aqui é uma linkage list não é mais um Array então quebrou totalmente né
eu não posso alocar em qualquer espaço vazio na memória eu preciso alocar o meu Array num espaço da memória que eu vá conseguir armazenar os itens do Array continuamente né um do lado do outro porque das propriedades do Array se a gente tiver falando de um Array tradicional tem duas que são muito importantes pra performance só o linked list com 8 bits para manter ainda a referência do próximo EA ficar meio esticado né a chance de dar dist estorar ia ser ia ser grande eu preciso que a minha leitura caso eu já saiba onde o
elemento está seja em od um se eu souber a posição do elemento eu preciso saber encontrar ele imediatamente E se eu não tiver eles de forma sequencial na memória se eu tiver eles dessa forma aqui de linked list eu não consigo encontrar o elemento imediatamente porque eu sei a posição do meu primeiro elemento só que como o segundo não tá do lado L do primeiro eu preciso acessar o primeiro para ver onde é que tá o segundo para depois ver onde é que tá o terceiro isso não é ai um se eu tiver cara isso
aí me lembra desfragmentação de disco esse desenhinho que ele tá fazendo vocês é da época de vocês quando vocês tinham que se preocupar em desfragmentar o disco todos aqui em sequência e eu sei a posição do meu primeiro item o primeiro item tá aqui no byte zero o segundo item vai est 8 bytes depois o terceiro item 16 bytes depois o quarto item 24 bytes depois então eu não preciso percorrer um por um para encontrar o meu quarto item se eu sei que eu quero o quarto e eu sei onde inicializo o meu Array eu
só faço um offset de 48 bytes e eu encontro o meu quarto item em o de um eu consigo encontrar imediatamente ele é claro isso significa que eu também tenho uma modificação em o de um se eu quero mudar o meu quarto item de um valor para outro valor e encontrar é imediato né alterar ele também é imediato vamos voltar aqui para nosso exemplo da memória você percebe que a gente tem alguns espaços da memória que estão ocupados e alguns espaços que estão vazios existe um tamanho máximo aqui aqui né de espaços vazios que a
gente tem continuamente Quantos são eles é 1 mais 6 7 mais 2 9 a gente tem nove espaços contínuos no máximo se eu quiser armazenar 10 elementos no meu Array ele não cabe nessa memória que a gente desenhou aqui simplesmente não cabe eu preciso dar um dar um jeito aqui de reorganizar aqui os os fatores para fazer caber só que escala é por isso que a gente foi pra nuvem cara só escala bota mais memória e aloca já aloca Um arrei já gigante não é assim que vocês fazem vocês fazem isso pra coluna da banca
da base de dados não é por isso que tu bota varchar 255 a mesma coisa cara pra memória bota lá só que pô quando você inicializa umay em JavaScript não tem como a linguagem saber se você vai querer armazenar 10 elementos se você vai querer armazenar 100 elementos 1000 elementos ou 1 milhão de elementos tudo isso é possível e isso gera um problema enorme como a linguagem tem que acomodar o caso de você poder querer armazenar 1 milhão de elementos e eu não preciso definir no momento que eu instanci o Array Quantos elementos ele vai
ter Teoricamente para garantir essa leitura em od um para garantir essa leitura imediata Eu precisaria que todo o Array que eu inicialize em JavaScript pudesse acomodar o tamanho máximo e lógico você pode pensar cara mas isso aí é muito ineficiente na memória e é é mesmo por isso que JavaScript não faz isso vamos vamos pensar um pouco aqui a gente já vai ver isso em Rust mas para eu conseguir eficientemente alocar um Array na memória eu preciso saber quantos itens eu vou ter nesse Array né porque eu preciso conseguir encontrar um espaço que caiba o
número máximo de itens que eu vou ter ali se eu então por isso que assim a maioria dos arre que vocês usam aí eles tu tem que dizer o tamanho do Array já no início da tua implementação tá ligado já de cara tu já não tem algo que é mutável no JavaScript o aray tu pode dar uns dá push só dá push cara se eu não me engano eu eu vou eu quero deixar ele terminar de falar mas se eu não me engano o JavaScript Funciona igual o cotl igual várias outras linguagens que te fornece
esses arre se eu falar pro computador P meu vai ter s dois itens vai acaber aqui sem nenhum problema se eu falar pro computador Pô o meu Array vai ter seis itens ele consegue encaixar aqui nesse espaço da memória e vamos supor que no meio do caminho eu mudei de ideia eu aloquei seis itens depois na real não quero mais que seja seis eu quero que seja 20 itens você percebe que que a gente não não tem mais essa modificação em audio 1 porque eu não consigo encaixar 20 itens aqui Eu precisaria mover o Array
inteiro para outra posição para outro lugar na memória que senão vou perder minhas propriedades de Array então tá então a gente explicou por que um Array de verdade requer que eu estipule o tamanho dele em momento de criação para ele conseguir me garantir essas propriedades aqui né Afinal de contas ou ele vai me garantir isso daqu ou todo Array que eu iniciar vai consumir um espaço absurdo na memória e vai ser extremamente ineficiente né um dos dois tem que ser verdade e por isso que a gente pode dar um crédito Zinho pro nosso tão querido
Python né quando eu faço a igual isso daqui isso daqui em Python não é o Array nem se chama Array Python tem uma certa teimosia né em chamar isso daqui de lista E por que que se chama de uma lista porque não é o Array ele não respeita essas propriedades aqui de um aray ele não se comporta como um Array por debaixo dos panos você pode ir lá ler a implementação de uma lista em Python e você vai ver que não é um aray e tá tudo esse tipo de conteúdo é bom porque daí quando
tu olha o teu amigo lá escrevendo em Python né O cara tá começando no Python daí ele coloca ali Ah eu vou criar uma arrei aqui daí tu só olha para esse ó quis dizer lista tu quis dizer lista né quis dizer lista tá tudo certo não é uma Men Estamos aqui no nosso R Acabei de iniciar um projeto novo vamos inicializar um ar nesse projeto vamos lá let mul mul porque eu quero algo mutável né chamar de R ele vai ser igual a um Array percebe aqui que o Rust ele tá brigando comigo ele
não me deixa inicializar esse multiarray e ele tá me dando dois erros primeiro ele precisa saber o tipo do nosso Array Ele precisa saber o que que a gente vai armazenar nesse Array por quê Que bom como é um espaço contigo na memória como a gente conversou né se a gente imaginar qual é a estrutura de dados preferida do Silvio Santos que cada um disso aqui é oito bits nesse espaço aqui eu vou conseguir armazenar seis inteiros de oito bits mas se eu quiser armazenar inteiros de 16 bits Na real você consigo armazenar três entendeu
então para saber o espaço que eu vou precisar colocar na minha memória eu necessariamente preciso saber Qual é o tipo que eu vou est armazenando ali então tá então vamos ver se ele para de reclamar eu quero um i32 um inteiro de 32 bits ele ainda não gostou porque tá faltando o quantos itens de a gente sabe qual é o tipo mas a gente precisa saber o quanto que a gente vai quer armazenar Então vamos dizer para ele o que ele quer a gente vai armazenar três itens e tá feito Mas ainda tem um certo
probleminha aqui porque é R é bem chatinho com isso a gente tá criando um Array V ser três itens inteiros com 32 bits Mas a gente não especificou com o que que a gente vai Popular esse Array né É claro a gente poderia esperar que um comportamento meio Def fosse ter três zeros mas Rust quer que a gente seja bem explícito no que a gente tá fazendo então vamos colocar aqui zer TR e agora tá tudo correto vamos percorrer esse Array e printar os itens dele pra gente ver com o que que a gente Populi
ele né um lzinho aqui muito simples r e a gente pode dar um cargo Run bom ele tá reclamando comigo que eu pedi para Array mutável Só que eu nunca mute ele mas ele me dá aqui ó 00 perfeito temos o nosso aray funcionando printando os três itens e é só assim que a gente vai conseguir definir um aray precisa ser bem chatinho com as regras que senão a gente vai quebrar isso aquii que a gente acabou de conversar sobre Então vamos ver como é que se inicializa o Range jav script né para inicializar um
Range of script eu faço isso aqui let R igual isso faç qualquer coisa meu JavaScript só larga ali ja pronto não não tem mais nada fazero se eu quiser pegar aqui Array dá um push no Array que nem vai existir em Rust né porque não tem como se adicionar itens novos no Array Rush push zero eu posso dar push zero três vezes e eu posso fazer um loop aqui e contar os meus elementos e acho que é isso né e faz tempo que eu não faço assim mas se eu der um node . JS acho
que roda né e rodou tá aqui não precisa definir tamanho nada num tipo só fui jogando elemento dentro do meu Array e tá aí tá resolvido por isso que isso aqui é uma mentira Quando você vai olhar a implementação disso não é um Array Pode ser que em algum momento lá dentro da memória tenha algum Array mas ele não é um Array ele é uma combinação de Array com outras gambiarras também né se fosse só um Array ele não ia permitir um push e claro tem tem mais um n de complexidade aqui que a gente
tá falando de JavaScript só que não necessariamente é tudo implementado da mesma forma eu posso ter o Array implementado de uma forma no node né eu posso ter IMP node V8 tô dizendo eu posso ter implementado de outra forma no ban saca Isso aqui é uma bagunça Isso aqui é uma abstração em cima de uma abstração e o que a gente chama de Array na real é só uma lista meio tanto faz eu poderia agora rodar um benchmark para te mostrar a diferença nas velocidades de acesso nos itens em JavaScript num em Rust mostrar um
node Ban ver qual vai ser performance Você já sabe qual vai ser a resposta você não nesse ponto do vídeo não é pr você ter a menor das menores dúvidas que eu não tem dúvida que que o que o JavaScript vai ser mais rápido não é que manipular Rising Rust vai ser muito mais rápido que em JavaScript Não é para ter menor dúvida sobre isso e vai pelo menos a gente precisa dar um crédito aqui pro Python que isso aqui se eu quiser definir né eu defino como lista mesmo se quiser velocidade fazem assembly né
meu vamos se respeitar também que Python sabe que isso aquii é uma gambiarra esse canal não tem nenhum Patrocínio boa parte dos conteúdos que eu apresento aqui eu aprendi primeiro no livro entendendo algoritmos Então eu vou deixar na descrição um link de afiliado para você comprar esse livro se interess e assim você vai contribuindo também com o canal cara o conteúdo do do galego é muito bom tá já tinha deixado o like aqui conteúdo dele é muito bom mas deixa eu deixa eu falar para vocês mostrar para vocês aqui o como é que funciona esse
negócio de arrei porque assim eu não sei se Galego eu não sei se é uma mentira sei se é mentira mentira mentira porque se o JavaScript Funciona igual funciona em várias outras linguagens tipo cotlin que eles te dão essa abstração de lista né baseada em arrei tu vai ter tu vai ter uma arrei no final das contas Tu vai de fato ter uma Rei Então eu acho que a mentira depende do teu ponto de vista o que eu quero dizer com isso eu vou desenhar aqui também o o o desenho que tu fez tá então
tu tem aqui a tua memória minha memória aqui vai tá mais feia que a tua que tu desenhou melhor que eu então essa aqui é a minha memória essa memória vai cortar aqui e é isso é isso aqui que que a gente tem de memória Digamos que tu definiu o tamanho do teu arrei como sendo três definiu como três show tu alocou esse espaço em memória aqui mas em algum momento tu percebeu assim nossa eu vou eu vou precisar de mais espaço eu fui lá no meu JavaScript eu dei arrei push arrei push arrei push
e dei arrei push e agora aonde que vai esse push aqui para onde que vai esse push quarto push se tu tem um arrei de tamanho três que o que o JavaScript estipulou lá como sendo o tamanho do teu arrei bom o que acontece E aí depende da Estratégia que tu vai ter e Eu até já implementei isso na faculdade que é o seguinte a gente chama de Double the capacity a maioria das implementações toscas disso vai ser tudo a capacidade do teu arrei então tu vai criar um novo arrei de tamanho seis e tu
vai ter que mover os itens desse arrei pras posições a mantendo a mesma posição então tu mantém os itens ali tu move eles depois que tu moveu eles tu vai lá e deleta o original e atualiza as referências das tuas variáveis para essa nova posição Então esse puxa Rei vai entrar ali é assim que funciona então assim tu vai ter o de um até tu precisar dobrar quando tu precisar dobrar a capacidade do teu Array tu vai ter uma operação de odn de que ele chama de de shuffle se eu não me engano é shuffle
tu vai tu vai fazer o shuffle do bagulho tá ligado vai mover Isso vai acontecer se tu deletar também é basicamente isso Qual que é o passo a passo aqui que a gente fazer lá na faculdade então tu dobra E aí chama de amortization amortization capacity tá tua tu tu amortiza a capacidade do teu arrei Para que tu a tendência é que tu dobrando tu não precise ficar fazendo a sua operação tu vai alocar alocar novo espaço e memória vai copiar os elementos Ah vai limpar limpar a memória e vai atualizar os elementos e capacidades
é basicamente isso que que a maioria das linguagens que tem essa abstração vai fazer por ti e eu tenho quase certeza que se a gente for no JavaScript V8 no projeto V8 do github Vocês não precisam pegar o que eu tô falando tá se a gente for lá no projeto do V8 e a gente procurar aqui por arrei Será que a gente acha arrei V8 internal Fix CC é isso Fix CC capacity aqui ure capac calculation length divido por do deve ter alguma coisa de grow aqui cara grow not Space in left grow shrink or
compact Array e a tem uma lógica de grow talvez eles botar isso nos elements elements não tem elements elements grow grow Cap aqui ó grow capacity and convert implementation Então tá lá no V8 como que ele faz quer entender C mais mais é C mais mais isso aqui não é vai lá e faz tá ligado é isso essa é a melhor forma de fazer não não é a melhor forma de fazer tem outras formas de fazer tu pode fazer chunked chunked chunked Array então a invés de tu dobrar a capacidade do teu arrei basicamente vai
fazer uma nova locação de arrei Então tem um arrei alocado aqui tu vai alocar uma uma nova posição de arrei E aí esses dois a Reis aqui tu vai colocar dentro de uma outra estrutura de dados que vai ser o Chunk da rei teu E aí essa estrutura de dados aqui ela pode ter por exemplo um espaço também fixo em memória e é basicamente isso tu diminui a tu não precisa ficar dobrando toda hora Tá mas bom o que é melhor eu sinceramente eu não sei te dizer qual opção é a melhor eu sei que
é assim que funciona e ele trabalha com odn na amortização e depois ele volta a trabalhar com ODD um porque ele tem espaço né tá mentindo ou não tá mentindo eu deixo para você decidir mas apoia lá o canal do galego ele posta vários vídeos legais sobre dsa da structure e algoritmos é isso JavaScript mentiu para ti mentiu porque ele falou que ia tu ia conseguir um emprego né
Copyright © 2024. Made with ♥ in London by YTScribe.com