Semana 1 - Dúvidas

[impjs]

Semana 1 - Dúvidas

[crissilvaeng]

Olá, tudo bem?

Estou seguindo o roteiro utilizando o livro Javascript: O Guia Definitivo - 6ª Edição de David Flanagan e por hoje estou encerrando minha porção de estudos diária.

Acompanhando os exemplos do livro, fiquei com questões idiotas em mente.

Dúvidas:

• 1. Em algumas linhas, o autor não usa ; ao final da instrução. Quando em Javascript é dispensável esse elemento?

Respondida por @fdaciuk.
Solução no cápitulo 02 do livro Javascript: O Guia Definitivo - 6ª Edição - David Flanagan.

x = 0;
x   

• 2. Se refere a um objeto dentro de um objeto? Ou da criação de uma nova propriedade chamada "contents" sem nenhum valor atribuído dentro do objeto "books"?

Respondida por @fdaciuk.
Entre suas propriedades Objetos podem possuir outros objetos dentro deles, e por sua vez, a estes também podem ser atribuidas propriedades.

var book = {                    
    topic: "Javascript";            
    fat: true;              
};                      
book.topic              
book["fat"]             
book.author = "Flanagan";   
book.contents = {};

• 3. O autor utiliza um exemplo muito confuso de "arrays e objetos" e suas composições. Alguém tem um exemplo mais claro?

Respondida por @fdaciuk.
Arrays sempre serão um conjunto só de valores, enquanto que objetos são conjuntos do tipo chave/valor. Arrays podem conter objetos.e objetos podem conter propriedades do tipo array. Inclusive, o elemento de um array pode ser outro array.

• 4. Na declaração de arrays e objetos, quando deve-se utilizar {} ou []?

Respondida por @fdaciuk.
Array sempre serão declarados entre [] e objetos entre {}.

var points = [                  
    {x:0, y:0},             
    {x:1, y:1}
];
var data = {                    
    trial1: [[1,2], [3,4]],         
    trial2: [[2,3], [4,5]],         
};

• 5. É logico pensar que comandos como count /= 2 e count -= 2 também são validos?

Respondida por @fdaciuk.
Instruções como count /= 2 e count -= 2 são validas em Javascript.

var count = 0;                  
count++;                    
count--;                    
count += 2;                 
count *= 3;                 

• 6. O Javascript utiliza a tabela ASCII para saber a ordem alfabética?

Respondida por @fdaciuk.
O Javascript utiliza Unicode, e pela posição do caractere na tabela consegue fazer comparações.

"two" > "three" 

• 7. Em Javascript quando uma variável é declarada dentro de uma função ela fica oculta para as demais funções?

Respondida por @fdaciuk.
O Javascript utiliza o conceito de variáveis locais, utilizada dentro de funções, classes, e outras estruturas, e globais, dispostas em qualquer altura do código podendo ser utilizada por qualquer estrutura daquele ponto em diante.

function factorial(n) {             
    var product = 1;                
    while (n > 1) {                 
        product *= n;               
        n--;                        
    }                               
    return product;                 
}
factorial(4);                       
function factorial2(n) {            
    var i, product = 1;             
    for (var i = 2; i <= n; i++) {  
        product *= i;               
    }
    return product;                 
}
factorial2(5);

• 8. Ao declarar uma variável sem atribuir nenhum valor, como o Javascript saberá a que tipo ela pertence?

Respondida por @fdaciuk.
O Javascript não é uma Linguagem Tipada.

var i, product = 1;

Código Completo

Obrigada pela atenção.

[fdaciuk]

Olá @CristinaSilvaEng!

Respondendo suas dúvidas:

1 - No capitulo 2 vc encontra a resposta.

2 - Um objeto dentro de outro objeto.

3 - Array sempre será um conjunto só de valores:

[1, 2, 3, 4]

Objetos são conjuntos do tipo chave/valor:

{chave1: "valor1", chave2: "valor2"}

4 - Para indicar arrays, vc sempre irá usar [].

E para objetos, sempre {}.

Arrays podem conter objetos como seu valor:

var arr = [
  {chave1: "valor1"},
  {chave2: "valor2"}
]

Que podem ser acessados da seguinte forma:

arr[0]; // {chave1: "valor1"}
arr[0].chave1; // "valor1"
arr[0]["chave1"]; // "valor1"

5 - Sim.

6 - Utiliza a Unicode (ASCII e Latin 1) - ver cap. 2.

7 - Sim.

8 - Javascript não é tipada. Mas não se preocupe com isso agora, esse assunto será visto mais à frente :)

[ericdouglas]

Na página 7, na função points.dist, de onde ele está pegando os valores?

[crissilvaeng]

Olá, tudo bem?

@ericdouglas me apontou outra questão.

Dúvida:

• 9. Na função points.this de onde estão sendo retirados os valores para p2.x, p1.x, p2.y e p1.y?

Respondida por @fdaciuk.
No código é criado um array contendo dois elementos. São esses dois elementos que, mais tarde, no método dist de points são chamados pelo objeto this que, para ser entendido, possui uma funcionamento similar ao de um ponteiro.

points.dist = function() {          
    var p1 = this[0];           
    var p2 = this[1];           
    var a = p2.x-p1.x;          
    var b = p2.y-p1.y;          
    return Math.sqrt(a*a + b*b);     
};
points.dist();

Código Completo

Obrigada pela atenção.

[fdaciuk]

Só tenho o livro em casa pra comparar.. assim que chegar eu dou uma olhada nisso xD

[crissilvaeng]

Olá, tudo bem?

@fdaciuk, ainda não ficou muito claro a solução da minha 2ª dúvida.

O objeto dentro do objeto é do tipo book ou um sub-objeto do tipo book.contents? Sendo um objeto do tipo book ele herda as propriedades do mesmo? Ou sendo um sub-objeto, é um objeto sem nenhuma propriedade?

var book = {                    
    topic: "Javascript";            
    fat: true;              
};                      
book.topic              
book["fat"]             
book.author = "Flanagan";   
book.contents = {};

Código Completo
Livro texto: Javascript: O Guia Definitivo de David Flanagan - 6ª Edição .

Obrigada pela atenção.

[fdaciuk]

@CristinaSilvaEng, contents nesse caso é uma propriedade de book. Ele é um novo objeto vazio. Na verdade, chamando de Objeto, vc talvez esteja tentando assimilar a Objetos em outras linguagens.

Objeto em Javascript é um pouco diferente. Podemos dizer que é uma coleção de dados.

Foi atribuído a book.contents um novo objeto vazio.

Agora você pode adicionar outras propriedades a book.contents. Por exemplo:

book.contents = {
  title: "Chapter 1",
  page: 2
};

Ou passando cada propriedade separadamente:

book.contents.title = "Chapter 1";
book.contents.page = 2;

Entendeu? Essa notação somente vai atribuir novas propriedades e valores a book. Para herança, é utilizado prototype, que será visto mais pra frente :)

[fdaciuk]

Sobre a dúvida do método dist no points (@ericdouglas e @CristinaSilvaEng):

Na página 5, é criado o array points, onde cada um dos elementos desse array é um objeto:

var points = [
  {x: 0, y: 0},
  {x: 1, y: 1}
];

Com o array points criado, eu posso criar métodos para ele usando a notação de objeto, chamando depois dele o nome do método precedido de ponto (página 7):

points.dist = function() { ... }

dist agora é um método de points (pois foi atribuída uma função a ele), que pode ser chamada com points.dist().

O this nesse caso, se refere a points. A variável p1 recebe o primeiro item do array points que é {x: 0, y: 0}. Se você rodar esses comandos no console, verá que, se fizer points[0], terá como retorno {x: 0, y: 0}. É daí que vem esses valores. :)

[pedronauck]

To aqui me mordendo pra ajudar mais ainda não consigo, meu livro ainda não chegou :/ hahahaha vou tentar ajudar de alguma maneira.

Vi que levantaram algumas questões sobre objetos em Javascript, principalmente a @CristinaSilvaEng. Lá no @cerebrobr estamos desenvolvendo um Guia de OOP, ainda não está completo, mas com o conteúdo que já tem acho que dá de ter uma base legal sobre o assunto: https://github.com/cerebrobr/oop-javascript

PS: quem quiser forkar e contribuir será bem vindo :)

Valeu.

[leonascimento]

@pedronauck vlw obrigado por compartilhar conhecimento o conteúdo é massa já tô devorando parabéns pela iniciativa quando o guia tiver pronto nos avisa quando for lançado! se for vendido já tá comprado se for free melhor ainda!

[pedronauck]

Valeu @leo386386, esse guia pra mim está sendo mais aprendizado do que qualquer outra coisa hahaha Com certeza o guia será free, a hora que estiver pronto pode deixar que vou divulgar pra geral :)

[crissilvaeng]

Olá, tudo bem?

@pedronauck, obrigada pela recomendação do repositório sobre OOP. Gostaria de contribuir com a iniciativa, mas, como deu pra perceber pelas minhas perguntas, esta muito além das minhas capacidades atuais. Particularmente o tópico sobre Padronização de Código e Boas Práticas me interessa muito.

@fdaciuk , obrigada pela paciência e qualidade nas respostas, você esclareceu muita coisa, estou sendo cuidadosa em não deixar passar nada, para ter um aprendizado coeso e sem lacunas.

[fdaciuk]

Está certíssima @CristinaSilvaEng xD

Mas não se preocupe tanto com esse primeiro capítulo, ok? Ele, na verdade, é só o conteúdo "cuspido" do que será bem explicado nos próximos 4 :)

Depois de ler os próximos, poderá voltar a essa primeira parte e verá como tudo ficará mais claro ;)

[fbadaro]

Olá Galera,

Estou lendo o primeiro capitulo do livro Javascript o guia definitivo e vi que em uma parte ele diz que uma função é como se fosse um classe, e eis que me surgiu uma dúvida.

Alguém poderia me explicar a diferença entre Objetos Literais e Funções Construtoras, e em qual caso é mais interessante usar um ou o outro.

Tks!

[pedronauck]

@fbadaro, não estou lendo o livro ainda, mas vou tentar te ajudar de alguma maneira :) e para essa pergunta tem um ótimo artigo postado no tableless, eu pessoalmente custumo revisar ele constantemente... http://tableless.com.br/javascript-objetos-literais-vs-funcoes-construtoras/

Caso você queira saber um pouco mais sobre objetos @fbadaro, este repo pode te ajudar. Se você quiser aprofundar ainda mais seu estudo, pode estudar design patterns em javascript aqui neste repo ou ler esse livro do Addy Osmani.

Qualquer coisa dá um toque :)

[vitorbritto]

Vale frisar que, é importante não perder o foco do roteiro sugerido.

Além disso, nos primeiros capítulos o autor estará preparando o terreno para que a leitura dos próximos capítulos fique mais tranquila para absorver as informações. O livro é muito bem detalhado e rico em informações. Sugiro o uso da referência ao final do livro para sanar dúvidas também.

[HenriqueSilverio]

Muito bem lembrado @vitorbritto. Assuntos mais avançados como objetos, detalhes mais avançados sobre funções, padrões de projeto, entre outros, serão abordados na devida hora nas próximas semanas do roteiro. Por enquanto, não se preocupem demais com esses detalhes. =]

[fbadaro]

Tks @pedronauck vlw pelos links, vou dar uma olhada.

Vlw por lembrar @vitorbritto e @HenriqueSilverio somente foi algo que vi lá e tenho algumas dúvidas com relação a isto, então vamos seguir o roteiro =)

[andersonaap]

Alguém imagina alguma vantagem no fato do ponto e vírgula não ser obrigatório no JS além
da não necessidade de digitá-lo?

[fdaciuk]

Pra codar é sempre importante usar o ponto e virgula para evitar esses problemas citados xD

A vantagem de não precisar usar em alguns casos, é quando você minifica seu arquivo, e a ferramenta já remove os ponto e virgula desnecessários, deixando seu código menor :)

[vitorbritto]

O ponto e virgula é o elemento que finaliza um comando a ser executado em um programa. Dito isso, se você omitir o seu uso em uma linha composta por duas ou mais variáveis, o programa vai retornar um erro. Entretanto, se as suas variáveis forem declaradas em linhas separadas, o uso do ; torna-se opcional e você pode omitir este cara. Eu utilizo o ; ao final de toda instrução.

Vale lembrar também que, o não uso do ponto e vírgula em scripts minificados, precede por conta de um comportamento adequado para este compressão. Evitando, assim, que o seu programa "trave".

[andersonaap]

É. Alguns pontos e vírgulas são desnecessários possibilitando sua remoção.
Fiz um teste de minificação de um pequeno trecho no http://www.jsmini.com
Ele removeu os pontos e vírgula que antecedem fechamento de chaves }.
(também incluiu outros, mas em troca de remover quebras de linha).

Acho que não se sonhava com minificação quando o JS foi desenvolvido.