• Save

Loading…

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

Like this presentation? Why not share!

Diversamente Javascript: si.. può.. fare! (di Mirko Ravaioli)

on

  • 1,588 views

Un'analisi di javascript dalle origini all'utilizzo del linguaggio in modalità object oriented.

Un'analisi di javascript dalle origini all'utilizzo del linguaggio in modalità object oriented.

http://fromthefront.it

Statistics

Views

Total Views
1,588
Slideshare-icon Views on SlideShare
1,556
Embed Views
32

Actions

Likes
1
Downloads
0
Comments
0

1 Embed 32

http://fromthefront.it 32

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

CC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Diversamente Javascript: si.. può.. fare! (di Mirko Ravaioli) Diversamente Javascript: si.. può.. fare! (di Mirko Ravaioli) Presentation Transcript

    • JavaScript
      Si…può…fareee!!!
      Mirko Ravaiolimirko.ravaioli@unibo.it 346.6635057
    • 2
      Modena 18 Novembre 2010
      Obiettivo di questo breve ma intenso talk:
      Spunti per un utilizzo non comune delle potenzialità del linguaggio JavaSript
      NON parleremo di sintassi stretta del linguaggio
      NON parleremo dei vari framework nati negli ultimi anni basati sul linguaggio JavaScript (prototype, jquery, extjs…)
      Metteremo il focus sull’ingegnerizzazione del codice
    • 3
      Modena 18 Novembre 2010
      Cos’è JavaScript?
      • JavaScript è un linguaggio di scripting sviluppato per dare interattività alle pagine HTML
      • Può essere inserito direttamente nelle pagine Web ed è in pratica lo standard client-side
      • Il suo nome ufficiale è ECMAScript
      • E’ diventato standard ECMA (ECMA-262) nel 1997
      • E’ anche uno standard ISO (ISO/IEC 16262)
      • Sviluppato inizialmente da Netscape da BrendanEich (il nome originale era Mocha poi LiveScript) e introdotto in Netscape 2 nel 1995
      • In seguito anche Microsoft ha lavorato sul linguaggio producendo una sua variante chiamata JScript
      • L'ultimo standard, del dicembre 1999, è ECMA-262 Edition 3, e corrisponde a JavaScript 1.5
      • L’ultima versione 27 Luglio 2010, è 1.8.5 (supportato da MozillaFirefox 4 e Explorer 9)
    • 4
      Modena 18 Novembre 2010
    • 5
      Modena 18 Novembre 2010
      JavaScript e Java
      • Al di la del nome Java è JavaScript sono due cose completamente diverse
      • L’unica similitudine è legata al fatto di aver entrambi adottato la sintassi del C
      • Esistono profonde differenze
      • JavaScript è interpretato e non compilato
      • JavaScript è object-based ma non class-based
      • Esiste il concetto di oggetto
      • Non esiste il concetto di classe
      • JavaScript è debolmente tipizzato (weaklytyped):
      • Non è necessario definire il tipo di una variabile
      • Attenzione però: questo non vuol dire che i dati non abbiano un tipo (sono le variabili a non averlo in modo statico)
      • JavaScript è debolmente orientato ad oggetti
    • 6
      Modena 18 Novembre 2010
      Tipi primitivi: numeri e booleani
      • Javascript prevede pochi tipi primitivi: numeri, booleani e stringhe (forse! ☺)
      • Numeri (number):
      • Sono rappresentati in formato floatingpoint a 8 byte (64bit, formato IEEE)
      • Non c’è distinzione fra interi e reali
      • Esiste il valore speciali NaN (not a number) per le operazioni non ammesse
      • Esiste il valore infinite (ad esempio per la divisione per zero)
      • Booleani (boolean): ammettono i valori true e false
      • Non esistono né tipi interi né il tipo carattere
    • 7
      Modena 18 Novembre 2010
      Oggetti
      • Ogni cosa in JavaScript è o un valore primitivo o un oggetto.
      • Gli oggetti sono entità dotate di unicità (sono uguali solo a sé stessi) e che associano nomi di proprietà a valori
      • Definendo un costruttore, è possibile definire oggetti.
      • JavaScript è un linguaggio orientato a oggetti basato su prototipi.
      • Ciò significa che l'eredità è fra oggetti, non fra classi (JavaScript non ha classi).
      • Gli oggetti ereditano le proprietà dai loro prototipi.
    • 8
      Modena 18 Novembre 2010
      Oggetti
      • Le proprietà non sono definite a priori: possono essere aggiunte dinamicamente
      • Vengono creati usando l’operatore new
      var o = newObject()
      Attenzione:Object() è un costruttore e non una classe
      • Un oggetto appena creato è completamente vuoto: non ha né proprietà né metodi
      • Gli oggetti in realtà sono array associativi: strutture composite con i cui elementi sono accessibili mediante un indice di tipo stringa (nome) anziché attraverso un indice numerico
    • 9
      Modena 18 Novembre 2010
    • 10
      Modena 18 Novembre 2010
      Stringhe? Oggetti o cosa?
      • Potremmo dire che mentre in Java sono oggetti che sembrano dati di tipo primitivo in JavaScript sono dati di tipo primitivo che sembrano oggetti
      • Sono sequenze arbitrarie di caratteri in formato UNICODE a 16 bit e sono immutabili come in Java
      • Esiste la possibilità di definire costanti stringa delimitate da apici singoli ('ciao') o doppi ("ciao").
      • E’ possibile la concatenazione con l’operatore +
      • E’ possibile la comparazione con gli operatori < > >= <= e !=
      • Possiamo invocare metodi su una stringa o accedere ai suoi attributi
      • Non sono però oggetti e la possibilità di trattarli come tali nasce da due caratteristiche:
      • Esiste un tipo wrapperString che è un oggetto
      • JavaScript fa il boxing in automatico come C#
    • 11
      Modena 18 Novembre 2010
      Tipi valore e tipi riferimento
      • Si può tentare di interpretare il sistema dei tipi di JavaScript usando una logica simile a quella di C#
      • Si può quindi distinguere fra tipi valore e tipi riferimento
      • Numeri e booleani sono tipi valore
      • Array e Oggetti sono tipi riferimento
      • Per le stringhe abbiamo ancora una situazione incerta: Pur essendo un tipo primitivo sono un tipo riferimento
      • Le stringhe Javascript sono l’equivalente informatico dell’ornitorinco!
    • 12
      Modena 18 Novembre 2010
      Funzioni, costanti funzione, costruttureFunction
      • Ammettono parametri che sono privi di tipo
      • Restituisce un valore il cui tipo non viene definito
      • La mancanza di tipo è coerente con la scelta fatta per le variabili
      • Le funzioni possono essere definite utilizzando la parola chiave function
      • Esistono costanti funzione (functionliteral) che permettono di definire una funzione e poi di assegnarla ad una variabile con una sintassi decisamente inusuale:
      varsum = function(x,y) { returnx+y; }
      • Una funzione può essere anche creata usando un costruttore denominato Function (le funzioni sono quindi equivalenti in qualche modo agli oggetti)
      varsum = newFunction("x","y","returnx+y;");
    • 13
      Modena 18 Novembre 2010
      Costruttori
      • Un costruttore è una funzione che ha come scopo quello di costruire un oggetto
      • Se viene invocato con new riceve l’oggetto appena creato e può aggiungere proprietà e metodi
      • L’oggetto da costruire è accessibile con la parola chiave this
      varobj = newObject();
      obj.x = 12;
      obj.y= 3;
      obj.somma = function() {returnthis.x +
      this.y};
    • 14
      Modena 18 Novembre 2010
      Costruttori
      • Un costruttore è una funzione che ha come scopo quello di costruire un oggetto
      • Se viene invocato con new riceve l’oggetto appena creato e può aggiungere proprietà e metodi
      • L’oggetto da costruire è accessibile con la parola chiave this
      functionRectangle(w, h) {
      this.w= w;
      this.h= h;
      this.area= function()
      { return this.w*this.h; }
      this.perimeter= function()
      { return 2*(this.w+this.h);}
      }
      var r = newRectangle(5,4);
      alert(r.area());
    • 15
      Modena 18 Novembre 2010
      Costanti oggetto
      • Le costanti oggetto (objectliteral) sono racchiuse fra parentesi graffe e contengono un’elenco di attributi nella forma nome: valore
      varnomeoggetto = {prop1: val1;
      prop2: val2...}
      • Usando le costanti oggetto creiamo un oggetto e le proprietà (valorizzate) nello stesso momento
      varobj = {
      x : 12,
      y : 3,
      tot : 15
      }
      varobj = newObject();
      obj.x = 12;
      obj.y = 3;
      Obj.tot = 15;
    • 16
      Modena 18 Novembre 2010
      Programmazione ad Oggetti
      La programmazione orientata agli oggetti (OOP, ObjectOrientedProgramming) è un paradigma di programmazione, che prevede la definizione di oggetti software che interagiscono gli uni con gli altri attraverso lo scambio di messaggi.
      In genere, un linguaggio di programmazione è definito a oggetti quando permetta di implementare i tre meccanismi seguenti:
      • Incapsulamento
      • Ereditarietà
      • Polimorfismo
    • 17
      Modena 18 Novembre 2010
      function prova()
      {
      this.prop1 = 12;
      this.prop2 = ‘valore’;
      this.azione = function() {
      }
      }
    • 18
      Modena 18 Novembre 2010
      var Prova = {
      prop1: 10,
      prop2: ‘valore’,
      metodo1: function() {
      },
      metodo2: function() {
      }
      }
    • 19
      Modena 18 Novembre 2010
      var Prova = function() {
      var _prop1 = 1;
      var _prop2 = 2;
      function _metodoPrivato1() {
      }
      function _metodoPrivato2() {
      }
      return {
      metodo1: function() {
      _metodoPrivato1();
      },
      metodo2: function() {
      _metodoPrivato2();
      }
      }
      }
    • 20
      Modena 18 Novembre 2010
      var Prova = Class.create({
      prop1 : 10,
      prop2 : 'valore',
      metoto1 : function() {
      },
      metoto2 : function() {
      }
      });
    • 21
      Modena 18 Novembre 2010
      Cerchio
      Triangolo
      Rettangolo
      Trapezio
      .perimetro()
      .area()
      obj.perimetro()
      obj.area()