Skip to content

Sumários

Jump to bottom Edit New page
fbfreitas edited this page Oct 7, 2024 · 15 revisions

Apresentação - 9/9/2024

  • Apresentação da disciplina de Programação na Internet - PI
  • Modo de funcionamento da UC
  • Moodle
    • Informação institucional
    • Divulgação de Mensagens
    • Publicação de notas
  • Slack
    • No nome de utilizador, usar primeiro e último nome seguido da turma, entre parênteses (e.g. "Filipe Freitas (leic32d)").
    • Workspace da Unidade Curricular
  • Regras de avaliação
  • Bibliografia

Git, GitHub - 13/9/2024

  • Comandos - init, status, add, commit, push, pull

Enquadramento da UC de PI. Linguagem JavaScript - 16/9/2024

  • World Wide Web (WWW)

    • História
    • Arquitetura
      • Cliente (browser)
      • Servidor de hipertexto
      • Protocolo de interação entre cliente e servidor (Hypertext Transfer Protocol)

  • Arquitetura Cliente <=> Servidor

  • Distinção entre tecnologias Web de cliente (browser) e servidor.

    • Cliente: HTML, CSS, JavaScript
    • Servidor: Node.js, PHP, Java, .NET, C/C++, etc.

  • Evolução histórica de IPW e crescendo da importância do Javascript.

  • Evolução histórica do Javascript desde o seu aparecimento em 1995 com o objetivo inicial de uma linguagem de scripting para o browser, até à versão EcmaScript 6

  • Análise das características da linguagem de programação Javascript:

  • Scopes:

    • let e const – variáveis que NÃO podem ser usadas fora do bloco em que foram declaradas. Temporal Dead Zone
    • var - scope da função onde é declarada. Recomendação de NÃO usar.

  • Sistema de tipos EcmaScript edição 6: Object e Primitivos (todos os outros que não são Object)

  • Tipos Primitivos: Undefined, Null, Boolean, Number, String.

  • operador typeof

  • Objetos

    • Um objeto em JavaScript é um contentor de pares nome-valor!
    • Objeto Literal: { prop1: valor1, prop: valor2, …}
    • propriedades são membros de um objeto que armazenam valores.
    • Uma propriedade que armazena uma função é um método
    • 2 sintaxes para acesso a propriedades:
      • Dot notation: - obj.propName
        • Apenas pode ser usada para acesso a propriedades com nomes que são identificadores válidos
      • Subscript notation
        • Aceder a uma propriedade com nome dado por uma expressão: obj[exp]
        • Pode ser usada para acesso a propriedades cujo nome não é um identificador válido
        • Chamar um método com nome dado por uma expressão: obj[exp]()
    • Introspeção sobre objetos em Javascript :
      • Enumeração sobre nomes das propriedades de um objeto – for(let key in objRef)

  • Arrays

    • Arrays literais: [“elem1”, , “elem2”] -- a posição 1 fica com o elemento undefined
    • Não são tipificados, logo são heterogéneos.
    • Os elementos são obtidos por uma chave numérica, ou em string, tal como para as outras propriedades
    • A principal diferença para os objetos é que têm uma propriedade length.

Recursos

Eloquent Javascript - Capitulo 1

Eloquent Javascript - Capitulo 2

Eloquent Javascript - Capitulo 4

  • As funções são declaradas como literais que criam um valor função. 2 formas (existe uma 3ª forma):
    • função sem nome - definição de função - e.g. function () {} (função anónima)
    • função com nome - declaração de função - e.g. function foo() {}
  • Uma função tem uma propriedade name que guarda o nome declarado na função.
  • Funções anónimas têm a propriedade name igual a string vazia ("").
  • O número de argumentos, não tem que coincidir com o número de parâmetros
  • Arrow Functions
  • Closure de uma função:
    • Criado um novo por cada invocação da função
    • Pode ter um tempo de vida superior à execução dessa chamada à função, se ficarem acessíveis funções criadas nessa chamada

Recursos

Eloquent Javascript - Capitulo 3

Linguagem JavaScript: Funções Continuação - 27/9/2024

  • Higher-Order Functions

  • Função Construtora - Chamada realizada com o operador prefixo new

    • O operador new altera o significado do this que refere o objecto criado;
    • O construtor retorna implicitamente o novo objecto (this) a não ser que haja retorno explícito;

  • Prototypes

    • O protótipo tem a semântica do padrão de desenho Prototype
    • O protótipo serve de “modelo” à criação de novos objectos
    • Cada objecto tem uma propriedade implícita que refere o seu protótipo.
    • Exemplos de actualização do prototype e reflexo nos objectos com esse prototype
    • Properties Lookup (o objecto tem precedência sobre o protótipo)
      • Primeiro procura no objecto uma propriedade com o nome igual
      • Caso não encontre, então procura no prototype uma propriedade com esse nome prototype chain

  • 4 formas de chamar uma função:

    1. Como uma função -- this igual ao objeto global ou undefined (se em modo strict)
    2. Como um método -- this igual ao target e.g. target.methodName()
    3. Como construtor -- this igual ao objeto criado e.g. new funcName()
    4. com apply() ou call()

  • Modo strict

Recursos

Node.js: Introdução - 27/9/2024

  • Node.js: Google's V8 JavaScript engine + event loop + low-level I/O API;

  • Node Package Manager (npm)

    • É constituído por 3 componentes:
    • npm CLI
      • npm init -y - Cria um ficheiro package.json
      • npm install mocha chai --save-dev - instala mocha e chai como dependência de desenvolvimento.

  • ECMAScript Modules

    • "type": "module" no ficheiro package.json

  • Testes unitários com a framework Mocha

    • Executar testes
      • "scripts": { "test": "mocha"} no ficheiro package.json
      • npm run test
  • Event Loop para executar operações (na forma de callbacks) quando um evento ocorre.
  • Felix Geisendörfer: “everything runs in parallel except your code.”
  • Os callbacks NÃO são interrompidos por outros callbacks, nem correm em paralelo com outros callbacks.
  • Do ponto de vista da linguagem JavaScript o Node.js oferece um ambiente single-threaded.
  • Todas as operações de I/O do Node.js podem ser executadas em paralelo e.g. ler ficheiros; pedidos HTTP,….
  • As operações de I/O usam técnicas non-blocking.

Distinção entre os modelos:

  • single-threaded com IO bloqueante
  • multi-threaded
  • single-threaded com IO não-bloqueante assíncrono

Distinção entre modelo de chamada síncrono versus assíncrono.

  • Esquematização num diagrama de sequência que evidencia a diferença entre o modelo de chamada síncrono vs assíncrono.
  • Exemplo de bloqueio da thread principal Node.js
  • callback (err, data) => {...}

Recursos

Aula Prática - Promises - 30/9/2024

  • Modelos assíncronos:

    1. callback (err, data) => {...} -- err e data traduzem os 2 casos de sucesso ou falha.
    2. Promise é um objecto que encapsula os dois possíveis resultados: sucesso ou falha
    3. async / await -- semelhante ao idioma síncrono.

  • Uma Promise pode:

    • adicionar um callback a cada caso através de .then() ou .catch()
    • ter um dos 3 estados: pending, fulfilled , ou rejected

  • Exemplo de leitura dum ficheiro

    • Modo assíncrono com callback
    • Modo assíncrono com `Promise

Recursos

  • URI (Uniform Resource Identifier) - Identificador único de um recurso

    • URN (Uniform Resource Name) - Identifica o recurso por nome
    • URL ( Uniform Resource Locator) - Identifica o recurso indicando a forma de acesso e a sua localização

  • URL

    • Sintaxe:
    URL = scheme:[//[userinfo@]host[:port]]path[?query][#fragment]

  • HTTP (Hypertext Transfer Protocol)

    • Características do HTTP:
      • nível aplicacional
      • stateless
      • pedido-resposta
      • o protocolo subjacente deve suportar entrega fiável – e.g. TCP.

  • Demonstração de pedidos GET e resposta HTTP;

  • Gamas de códigos de estado HTTP:

    • 1xx - Resposta informativa
      • Mais relevantes: 100
    • 2xx - Sucesso
      • Mais relevantes: 200 e 201
    • 3xx - Redirecionamento
      • Mais relevantes: 301 e 302
    • 4xx - Erro de cliente
      • Mais relevantes: 400, 403 e 404
    • 500 - Erro no servidor
      • 500, 502 e 504

  • Pedidos HTTP GET usando Promises

Recursos

Add a custom footer
Add a custom sidebar

Clone this wiki locally