Depois dessa consideração, nada mais que justa pelo expectativa vivida hoje em todo mundo, vamos ao pequeno tutorial, que na verdade está mais para um help do que um tutorial em si, sobre a manipulação de vetores considerando índices em string utilizando JavaScript. Logicamente utilizarei recursos jQuery para apresentar aqui a sintaxe de seletores (calma que esse assunto será tratado e detalhado no próximo post). Talvez, agora, você esteja procurando algo sobre o assunto e se está um pouco difícil de ajudar, então vamos à facilitação:
Veja o seguinte trecho html abaixo, especificamente o conteúdo body para encurtarmos o papo (Clique sobre a imagem para ampliar):
Vamos supor que, para uma aplicação sua aí, você queira montar um vetor de gêneros em que cada gênero armazenará um vetor de temas e esses temas vão guardar números (por exemplo, a quantidade de temas que cada gênero possui em sua base de dados ou o tempo dos vídeos de um tema de um determinado gênero, etc...).
O que interessa para você é criar e inicializar (pode ser com zero) esses vetores e, para futuras manipulações, você deseja que os índices do vetor de gêneros sejam os próprios gêneros e os índices de cada vetor de temática sejam as próprias temáticas.
Para isso, segue o código em JavaScript abaixo no bloco $(document).ready do script (Clique sobre a imagem para ampliar):
Conforme o comentário da linha 1, da linha 2 à linha 10 temos a criação do vetor de gêneros, criando normalmente um Array chamado vetorGenero e inicializando o mesmo com os valores dos inputs de classe genero do trecho HTML. Notem o uso de seletores jQuery, no caso uma forma bem simples de seletor em $('#nomeSuaDiv .genero') que simplesmente retorna todos os inputs de classe genero existentes dentro da div com identificador nomeSuaDiv. Para cada input de gênero retornado (comando each), criamos um vetor de temas. Para cada tema, pegamos o seu valor e aplicamos como índice do vetor vetorTema, inicializando com zero. O JavaScript aceita esse tipo de inicialização, gerando em tempo de execução o índice com a string informada. Depois disso, atribuímos na respectiva posição do gênero o vetorTema criado (linha 9). Note que os índices do vetorGenero são strings: os valores de gêneros retornados pelo seletor da linha 3.
Finalmente, para finalizar esse help, tem-se entre as linhas 13 e 17 um simples percorrimento dos dois vetores (sendo o vetorGenero, especialmente, um vetor de vetores vetorTema), imprimindo seus índices string e o valor inicializado.
Espero que esse pequeno help ajude algum iniciante em JavaScript e jQuery!!! Em breve postarei mais exemplos, talvez mais complexos, sobre essa linguagem e framework, focando na grande variedade de seletores suportados.
Abaixo seguem os links de download referentes aos trechos usados para esse help.
Veja o Exemplo em Execução
Baixe os Arquivos Utilizados
Nenhum comentário:
Postar um comentário