Dart und JavaScript

Dart
und JavaScript

Christian Grobmeier
www.grobmeier.de
@grobmeier

JavaScript „false“:

false, 0, „“, undefined,
null

Batterien selbst besorgen.

jQuery ist Pflicht.

Segen oder Fluch?

Keine Typen

1000 und 1 Möglichkeit

Vererbung

Jeder Browser
ist ein Individuum.

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

Einer für alle.
if(a === null ||
a === undefined){}

Fallstricke.
'' == '0' // false
0 == '' // true
0 == '0' // true
false == 'false' // false
false == '0' // true
false == undefined // false
false == null // false
null == undefined // true
' trn ' == 0 // true

Dart
VM

Dart
Source

JavaScript
dart2js
Engine

Überall.

JS -> Dart
Roadcrew.js
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>

.js
function Roadcrew() {
// Constructor
}

Roadcrew.prototype = {
// Prototyp
};

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

Roadcrew.another = function () {
// Static Function
};

class RoadcrewController {
var pages;

RoadcrewController() {
// Constructor
}

void act(e) {
// Method
}

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

.js

Properties kopieren
Framework extend

class RoadcrewController
extends C {
...
}

class C {
...
}

class A implements B {
...
}
abstract class B {
...
}

.js

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

var act = function () {
console.log(test);
};

library Roadcrew;

import 'dart:html';

part ,RCController.dart';
part 'RCInterceptor.dart';
part 'RCException.dart';

.js

var myobj = (function() {
var name = „CG“;
return {
getName = function() {
return name;
}
}
}());

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

.js

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

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

.js

function RcErr(m,c,r){}

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

try {
interceptor(d, data);
} catch (error) {
...
}

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

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

.js

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

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

.js

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

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

import 'dart:isolate';

echo() {
port.receive((msg, reply) {
reply.send('I received: $msg');
});
}

main() {
var sendPort = spawnFunction(echo);
sendPort.call('Hello').then((reply) {
print(reply);
});
}

constructor="CountComponent" extends="div">

<template>
<button
on-click=”inc()">Click</button>

<span>{{count}}</span>
</template>

</element>

constructor="CountComponent" extends="div”>

<script type="application/dart”>
class CountComponent
extends WebComponent {
int count = 0;
void inc() { count++; }
}
</script>
</element>

Mehr?
I/O
JSON
Mirrors
Logging
...

Danke!
Christian Grobmeier
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)

Dart und JavaScript

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (7)

Dart und JavaScript