-
Notifications
You must be signed in to change notification settings - Fork 1
Sumários
Miguel Gamboa edited this page Nov 9, 2020
·
51 revisions
Aulas
- 06-10-2020 - Aula 01 - Apresentação
- 08-10-2020 - Aula 02 - Scopes, Tipos
- 09-10-2020 - Aula 03 - Funções, Objectos e Prototype
- 13-10-2020 - Aula 04 - Constructor, Prototype e Class
- 15-10-2020 - Aula 05 - Laboratório 1 - Functional Javascript Workshop
- 15-10-2020 - Aula 06 - Laboratório 2 - Functional Javascript Workshop
- 16-10-2020 - Aula 07 - Laboratório 3 - Functional Javascript Workshop
- 20-10-2020 - Aula 08 - calling convention
- 22-10-2020 - Aula 09 - Node.js
- 22-10-2020 - Aula 10 - Sync versus Async
- 23-10-2020 - Aula 11 - Laboratório 4 - Functional Javascript Workshop
- 27-10-2020 - Aula 12 - Developing asynchronous API
- 30-10-2020 - Aula 13 - Web App and Enterprise Applications
- 30-10-2020 - Aula 14 - Service
- 31-10-2020 - Aula 15 - Laboratório 5 - TPC06
- 03-11-2020 - Aula 16 - Laboratório 6 - TPC06 e workshop Learn you Node
- 05-11-2020 - Aula 17 - Unit tests, coverage and mocks
- 05-11-2020 - Aula 18 - App Web and routing
Livro de Referência:
06-10-2020
- Apresentação da disciplina de Programação na Internet -- PI
- Regras de avaliação
- Bibliografia
- Documentação suplementar: nodeschool.io
- Evolução histórica do Javascript desde o seu aparecimento em 1995 com o objectivo inicial de uma linguagem de scripting para o browser até à sua execução no ambiente Node.js
- Papel da linguagem Javascript como: alto nível (e.g. Java, C, etc) e intermédia (e.g. bytecodes, IL).
- SLIDES: pi-52d-aula01.pdf
08-10-2020
- Análise das características da linguagem de programação Javascript como: dinâmica, untyped, e interpretada.
- Duck Typing
- Dinâmica -- Adicionar e remover propriedades em Tempo de Execução:
-
obj.nova_prop
-- adicionar uma propriedade que não existe -
delete obj.prop
-- remover uma propriedades existente
-
- Ambiente de desenvolvimento:
- Modo
use strict
- ESLint -- Javascript linter
- Editor e.g. Visual Code, Notepad, InteliJ, etc.
- Modo
- Scopes:
-
let
econst
– 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ãoObject
) - Tipos Primitivos:
Undefined
,Null
,Boolean
,Number
,String
. - operador
typeof
einstanceof
-
Objecto Literal:
{ prop1: valor1, prop: valor2, …}
- propriedades são membros de um objecto que armazenam valores.
- SLIDES: pi-52d-aula02.pdf
09-10-2020
-
Node.js:
- =
AVE
+ gestão de dependencias (bibliotecas) - =
V8
+NPM
package manager
- =
- V8 JavaScript Engine projecto open-source de uma máquina virtual da Google, parte integrante do Browser Chrome, lançado em 2008.
- V8 como um Ambiente Virtual de Execução com as mesmas características de outros ambientes como JVM, ou CLR.
- Os componentes são distribuídos em código fonte JavaScript, podendo o JavaScript ter também uma perspectiva de linguagem intermédia como target de compiladores de linguagens como o TypeScript, Python, entre outras.
- Uma propriedade que armazena uma função é um método
-
Função Construtora --- tem uma propriedade explícita
prototype
. - Objecto –––
constructor
–––> função Construtora (código) –––prototype
–––> objecto Protótipo. - O protótipo tem a semântica do padrão de desenho Prototype
- O protótipo serve de “modelo” à criação de novos objectos
- Exemplos de actualização do
prototype
e reflexo nos objectos com esseprototype
-
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
-
Funções são first-class objects -- as funções têm todas funcionalidades que tem qualquer outro objecto JavaScript:
- Podem ser atribuídas a variáveis
- Podem ser passadas por parâmetro
- Podem ter propriedades definidas pelo programador (campos ou métodos)
- Funções têm uma capacidade adicional sobre os objectos que é poderem ser invocadas.,
- Introspecção sobre objectos em Javascript (comparação com Reflexão via .Net ou Java):
- Enumeração sobre nomes das propriedades de um objecto –
for(let key in objRef)
- Aceder a uma propriedade com nome dado por uma expressão:
obj[exp]
- Chamar um método com nome dado por uma expressão:
obj[exp]()
- Enumeração sobre nomes das propriedades de um objecto –
- SLIDES: pi-52d-aula03.pdf
- TPC2
13-10-2020
- Função Construtora
- Chamada realizada com o operador prefixo
new
- O construtor retorna implicitamente o novo objecto (
this
) a não ser que haja retorno explícito - Associação de método de instância por via do Prototype
- e.g.
Point.prototype.module = function() {return Math.sqrt(this.x*this.x + this.y*this.y)}
- e.g.
- Definição equivalente com
class
em ECMAScript 6 - Os métodos correspondem a proprieades not enumerable
<=>
:
Object.defineProperty(Point.prototype, 'module', {
value: function() {
return Math.sqrt(this.x*this.x + this.y*this.y)
}
})
- Enumerar propriedades visíveis:
for(let propName in obj)
- Enumerar todas as propriedades:
for(let propName of Object.getOwnPropertyNames(obj))
- As funções são declaradas como literais que criam um valor função. 3 formas:
- função com nome e.g.
function foo() {}
- função sem nome e.g.
function () {}
(função anónima) -
arrow function e.g.
() => {}
(função anónima)
- função com nome e.g.
- 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
""
string vazia. - O nome da variável que refere uma função
!=
da propriedadename
dessa função
- Todas as funções recebem dois parâmetros implícitos:
this
earguments
-
arguments
é uma colecção com o mesmo comportamento de array mas sem os seus métodos. - O número de argumentos, não tem que coincidir com o número de parâmetros
- 4 formas de chamar uma função:
- Como uma função (sem target) =>
this
igual aundefined
- Como um método de instância --
this
igual aotarget
e.g.target.methodName()
- Como construtor --
this
igual ao objecto criado e.g.new funcName()
- com
apply()
oucall()
- Como uma função (sem target) =>
- Função Construtora
- Chamada realizada com o operador prefixo
new
- O operador
new
altera o significado dothis
que refere o objecto criado; - O construtor retorna implicitamente o novo objecto (
this
) a não ser que haja retorno explícito;
Closure:
- Por cada chamada a uma função é criado um novo conjunto de variáveis com o contexto dessa função;
- As funções internas têm acesso às variáveis locais (parâmetros, ou não);
- NESTE caso, o ciclo de vida das variáveis externas é prolongado (apenas se for usada a função interna).
package.json
npm init
-
npm install <pkg> --save
-- download módulo<pkg>
e actualizapackage.json
- repositório local
node_modules
-- Adicionar ao.gitignore
-
npm install
-- download das bibliotecas especificadas empackage.json
- CommonJS -- definição do formato dos módulos.
-
require(‘nome’)
-- incorpora um módulo Node na forma de um objecto. module.exports
-
fs = require('fs')
-- módulo file system - Exemplos de utilização da API síncrona de
sync-request
:req('GET', 'http://example.com').getBody().toString()
- Node.js: Google's V8 JavaScript engine + event loop + low-level I/O API;
- Event Loop para executar operações (na forma de callbacks) quando um evento ocorre.
- Felix Geisendörfer: “everything runs in parallel except your code.”
- Vários callbacks podem responder a um mesmo evento, mas só um é executado em cada instante – sequencialmente.
- 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 IO do Node.js podem ser executadas emsimultaneo e.g. ler ficheiros; peidos HTTP,….
- As operações de IO usam técnicas non-blocking.
github.com/maxogden/art-of-node
- Distinção entre modelo de chamada síncrono versus assíncrono. Exemplos.
- Exemplificação em Node Js de uma sequência de pedidos Http de forma Síncrona versus Assíncrona através dos módulos
sync-request
vsrequest
. -
Idiomatic Node.js callback convention --
(err, data) => void
- Características do modelo de callback do node.js:
(err, data) => void
- O callback é o último parâmetro passado a um método assíncrono.
- Idioma:
if(err) return cb(err)
- Em caso de sucesso:
cb(null, data)
github.com/maxogden/art-of-node
- SLIDES: pi-52d-aula09-node-intro.pdf
- Revisão do modelo Assíncrono baseado em Callback
- Menção a outras formas de utilização de um modelo de chamada assíncrono (tratado na UC de Programação Concorrente):
- Promises
-
async
/await
- Características do modelo de callback do node.js:
(err, data) => void
- O callback é o último parâmetro passado a um método assíncrono.
- Idioma:
if(err) return cb(err)
- Em caso de sucesso:
cb(null, data)
- Implementação de uma API assíncrona baseada em callback
- Retornar o tamanho do ficheiro e outra função que calcula o somatório dos ficheiros.
- TPC5
- SLIDES: pi-52d-aula12-dev-async-API
- Martin Fowler “Enterprise applications are about the display, manipulation, and storage of large amounts of often complex data and the support or automation of business processes with that data” [Fowler, 2003].
- Simplistic view: 📂
-->
Data Layer
-->
Domain
-->
UI
-->
👤 - 3 Layers or Tiers
- Exemplo: BD SQL
-->
JDBC-->
Model + Services-->
HTML + CSS + Css-->
🌐 - vinyl -- Desenho de uma aplicação Web para gestão de listas de bandas favoritas por utilizador.
- vinyl:
Last.fm API ---> urllib ---> lastfm \
---> vinyl ---> UI
users.json File ---> fs ---> users /
-
lastfm
- Análise da fontes de dados Last.fm API -
users
- Desenho do formato de dados para armazenar utilizadores e suas bandas favoritas
- TPC6
- SLIDES: pi-52d-aula13-services
- vinyl -- obter o top das músicas das bandas favoritas de um utilizador.
- Implementação dos módulos da aplicação vinyl: 1.
lastfm
, 2.users
e 3.vinyl
:-
lastfm
--getTopTracks(artist, cb)
-
users
--function getUser(username, cb)
-
vinyl
--function getTopTracks(username, limit, cb)
-
- Documentação da API com JSDoc
- JavaScript Testing Frameworks: nodeunit, mocha, jest, etc
- Using jest:
npm install --save-dev jest
-
npm install --save-dev @types/jest
-- To provide full typing and e.g. intellisense in VS Code -
jest --init
-- Generate a basic configuration file -
npm run test
callsjest
to run tests -
jest --coverage
to check code coverage
- Code Coverage
- Testing Asynchronous Code
- Mock - simulated objects that mimic the behavior of real objects.
- Implementing a mock for
urllib
jest.mock('urllib')
urllib.request.mockImplementationOnce(function ....)
- URIs, Resources and Representation
-
Schemes, e.g. scheme
http://
-- protocolo http - App WEB: HTTP Server; Routing; Representation (e.g. HTML, Json, CSV, other; aka Views)
-
Request Methods:
GET
,POST
,PUT
,DELETE
. - Idempotent property defined by RFC 7231.
-
PUT
<versus>
POST
- Designing routes for vinyl web application:
GET /vinyl/users/<username> => getUser()
GET /vinyl/users => getUsers()
DELETE /vinyl/users/<username> => removeUser()
PUT /vinyl/users/<username> => addUser() // unique usernames
POST /vinyl/users/<username>/artists => addArtist() // allows repetitions
-
const server = http.createServer((req, res) => ...)
- instance of HTTP server. -
server.listen(8000)
- run and listen on port. res.writeHead(statusCode[, statusMessage][, headers])
-
res.write(chunk)
- sends a chunk of the response body. -
res.end([data])
- signals that response headers and body have been sent