Nice surprises in Dart M1
I'm a big typed JS fan, and when Dart came out last year I was very happy.
Now that TypeScript was introduced, the toolbox of the typed client side developer is just as good as it ever was.
3 interesting things I found out using the default app template in the new M1 release of the Dart Editor
import 'dart:html';
import 'package:js/js.dart' as js;
num rotatePos = 0;
void main() {
query("#text")
..text = "Click me!"
..on.click.add((Event event){
rotatePos += 360;
query("#text").style
..transition = "1s"
..transform = "rotate(${rotatePos}deg)";
});
js.scoped(() {
var j = js.context;
j.alert('Hello from Dart via JS');
j.$("#text").html("foo");
});
}
-
Double dot notation
used for chaining, the first . is operating on the "Click me!" string,
however the 2nd one is referencing the query Element
surprisingly I couldn't find reference to it (I'm sure its well documented) but it surprised me -
Multiline anonymous function
In the previous release of Dart, I couldn't find a way to create multi line anonymous functions, it wasn't in the examples (only ()=>... form) or the documentation, and I just assumed it's not supported.
Whether it was supported or not, I was happy to discover it supports them indeed, and in a very intuitive way (as in the above example of the click handler)
-
JS Interoperability works, note the js.scoped wrapper, and the call to a jquery method by simply invoking it on the context object.
This might be a little less convenient than just writing JavaScript as you would in TypeScript, but this is a very close workaround that makes Dart relevant much more.
Have more things that are perhaps documented but still was surprised to find out about? have other some td;lr show and tell about Dart? feel free to comment
Written by Eran Medan
Related protips
1 Response
The double-dot notation is called cascading. Some references:
http://www.dartlang.org/articles/m1-language-changes/#cascades
http://news.dartlang.org/2012/02/method-cascades-in-dart-posted-by-gilad.html
Have a fresh tip? Share with Coderwall community!
JavaScript on a page runs with the privileges of that origin. One altered library, tag manager, or snippet can read inputs, change what people see, and call your APIs as the user.
Security insights from Cside