SlideShare a Scribd company logo
Dart != JavaScript
       Christian Grobmeier
     http://www.grobmeier.de
            @grobmeier
Was ist falsch
an JavaScript?
JavaScript „false“:


   false, 0, „“,
 undefined, null


#1
Batterien selbst besorgen.


 jQuery et al ist
    Pflicht.


#2
Segen oder Fluch?


 Keine Typen


#3
1000 und 1 Möglichkeit


 Vererbung


#4
Patterns helfen:


 Namespace


#5
Jeder Browser
ist ein Individuum.



#6
Nicht nett.
var a1 = new Array(1,2,3,4,5);
    var a2 = new Array(5);




#7
Einer für alle.
if( a === null || a === undefined)




#8
Fallstricke.
'' == '0'            //   false
0 == ''              //   true
0 == '0'             //   true
false == 'false'     //   false
false == '0'         //   true




#9
false == undefined   //   false
false == null        //   false
null == undefined    //   true
' trn ' == 0      //   true
Darwin wusste es.



#10
Verkaufs-
argumente
Native VM


Dart Source

                           JavaScript
                 dart2js
                            Engine




              Überall.
Dart != JavaScript
Pub
Nix neues.
Viele Libs.
Isolates.
Serverseitig.
JS -> Dart
Roadcrew.js
(https://github.com/grobmeier/Roadcrew.js
Use Case
<div class="page" id="tablePage">
   <h1>Table Page</h1>
   <a href="#otherPage">Other</a>
</div>

<div class="page" id="otherPage">
   <h1>Other Page</h1>
   <a href="#tablePage">Table</a>
</div>
function Roadcrew() {    JavaScript
   // Constructor
}

Roadcrew.prototype = {
   // Prototyp
};

Roadcrew.prototype.act = function () {
   // Function




Prototype
};

Roadcrew.another = function () {
   // Static Function
};
class RoadcrewController {
  var pages;
                              Dart
    RoadcrewController() {
       // Constructor
    }

    void act(e) {
       // Method




              Class
    }

    void static another() {
      // Static method
    }
}
JavaScript

 Properties kopieren
 Framework extend


Vererbung
Dart
class RoadcrewController
   extends C {
   ...
}

class C {

Vererbung
}
   ...
Dart
class A implements B {
    ...
}

abstract class B {


Interfaces
   ...
}
JavaScript
function Roadcrew() {
    test = „blub“;
    var xyz = „bla“;
}

var act = function () {

Namespace
 console.log(test);
};
Dart
library Roadcrew;

import 'dart:html';

part ,RoadcrewController.dart';
part 'RoadcrewInterceptor.dart';



Namespace
part 'RoadcrewException.dart';
JavaScript
var myobj = (function() {
  var name = „CG“;
  return {
    getName = function() {
      return name;
    }


    Privacy
  }
}());
Dart

class Roadcrew {
  var _name = „CG“;
  _getTest() => name;
}



    Privacy
JavaScript


var test = „Christian“;
test = true;
test = 10.32;



      Types
Dart

class Roadcrew {
  String _name = „CG“;
  String _getTest() => name;
  List<DivElement> pages;
}


      Types
JavaScript
function RcErr(m,c,r){}

RcErr.prototype = new Error();
RcErr.prototype.constructor = RcErr;

try {
  interceptor(d, data);


Exception
} catch (error) {
   ...
}
Dart
class RcEx {
  String msg = "An error...";
  int c;
  RcEx(this.msg, [this.c = 1] );
}

try {


Exception
  interceptors[pageId].act(d);
} on RcEx catch(e) { }
JavaScript


pages = $('.page');
page = $('#myPage');



     DOM
Dart

pages = queryAll('.page');
page = query('#myPage');




     DOM
JavaScript

$("a").live(
  'click',
  $.proxy(this, 'goto'));


     DOM
Dart

queryAll('a').forEach((el) {
  el.on.click.add((e) {
    goto(e);
  });


     DOM
});
Batterien
beigelegt
import 'dart:isolate';            Dart
echo() {
  port.receive((msg, reply) {
    reply.send('I received: $msg');
  });
}

main() {
  var sendPort = spawnFunction(echo);




     Isolates
  sendPort.call('Hello').then((reply) {
    print(reply);
  });
}
Mehr?
          Dart

  I/O
 JSON
Mirrors
Logging
   ...
Wo steht Dart?
 Diskussion
Danke!

  Christian Grobmeier
http://www.grobmeier.de
       @grobmeier
Image Credits
    Omikuji: Flickr (jessleecuizon)
     Dollars: Flickr (401(K) 2012)
        Pub: Flickr (ell brown)
        Dog: Flickr (joshme17)
      Package: Flickr (lemonhalf)
   Threads: Flickr (The Big Quack)
     Server: Flickr (getButterfly)
     School Bus: Flickr (loop_oh)
    Batteries: Flickr (scalespeeder)
Discussing Monks: Flickr (wonderlane)

More Related Content

What's hot (20)

PDF
ECMA2015 INSIDE
Jun Ho Lee
 
KEY
jQuery for designers
Johan Ronsse
 
PDF
Java Script - Object-Oriented Programming
intive
 
PDF
用 Javascript 實現你的想像
Anna Su
 
PDF
jQuery PLUGIN
blueweb_sk
 
PPTX
Jquery ui, ajax
Ricardo Cavalcanti
 
PPT
Web App Mvc
Will Gunn
 
PDF
Collection pipeline par Mathieu Godart
CocoaHeads France
 
PDF
詳説WebAssembly
祐司 伊藤
 
PPTX
JavaScript Assíncrono
Natã Barbosa
 
PPTX
JS programowanie obiektowe
Piotr Czajkowski
 
PDF
Prototype UI
Sébastien Gruhier
 
PDF
ECMAScript 6 im Produktivbetrieb
Sebastian Springer
 
PDF
Clase 7 el modelo
hydras_cs
 
PDF
Primeiros passos-com-docker
Renan Martins Pimentel
 
PDF
Javascript Funcional - TDC Florianópolis 2017
Taller Negócio Digitais
 
PDF
Introduction to Service Worker
Shogo Sensui
 
PDF
Working With Ajax Frameworks
Jonathan Snook
 
PPTX
GRUNT - The JavaScript Task Runner
Larry Nung
 
PDF
TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...
tdc-globalcode
 
ECMA2015 INSIDE
Jun Ho Lee
 
jQuery for designers
Johan Ronsse
 
Java Script - Object-Oriented Programming
intive
 
用 Javascript 實現你的想像
Anna Su
 
jQuery PLUGIN
blueweb_sk
 
Jquery ui, ajax
Ricardo Cavalcanti
 
Web App Mvc
Will Gunn
 
Collection pipeline par Mathieu Godart
CocoaHeads France
 
詳説WebAssembly
祐司 伊藤
 
JavaScript Assíncrono
Natã Barbosa
 
JS programowanie obiektowe
Piotr Czajkowski
 
Prototype UI
Sébastien Gruhier
 
ECMAScript 6 im Produktivbetrieb
Sebastian Springer
 
Clase 7 el modelo
hydras_cs
 
Primeiros passos-com-docker
Renan Martins Pimentel
 
Javascript Funcional - TDC Florianópolis 2017
Taller Negócio Digitais
 
Introduction to Service Worker
Shogo Sensui
 
Working With Ajax Frameworks
Jonathan Snook
 
GRUNT - The JavaScript Task Runner
Larry Nung
 
TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...
tdc-globalcode
 

More from Christian Grobmeier (6)

PDF
The "Why Should You Talk" Talk
Christian Grobmeier
 
PDF
Zen Programming
Christian Grobmeier
 
PDF
Go Mobile with Apache Cordova, Zagreb 2014
Christian Grobmeier
 
PDF
Apps with Apache Cordova and Phonegap
Christian Grobmeier
 
PDF
Dart @ JUG Saxony
Christian Grobmeier
 
PDF
World of Logging
Christian Grobmeier
 
The "Why Should You Talk" Talk
Christian Grobmeier
 
Zen Programming
Christian Grobmeier
 
Go Mobile with Apache Cordova, Zagreb 2014
Christian Grobmeier
 
Apps with Apache Cordova and Phonegap
Christian Grobmeier
 
Dart @ JUG Saxony
Christian Grobmeier
 
World of Logging
Christian Grobmeier
 
Ad

Dart != JavaScript

Editor's Notes