Dart Language

Dart is a new web programming language with libraries, a virtual machine, and tools. Dart helps developers build structured modern web apps. Dart compiles to JavaScript to run across the entire modern web. Dart is inspired by a range of languages such as Smalltalk, Strongtalk, Erlang, C#, and JavaScript.

Dart language

Dart web language chart sheet

Features of Dart Language:

  • Object oriented.  Everything is an object including primitives and nulls
  • Optionally typed.  You can add type annotations which static checking tools can use to help you find errors in your code, but you don’t have to use them.
  • Interpreted.  Dart is run in a VM, but it is not compiled first.  Round-trip time for making changes is very short.
  • Compatible with JavaScript.  You can compile your Dart code to JavaScript and run Dart applications in any modern browser.
  • FAST!  Dart is very fast, much faster than JavaScript in just about every test.
  • Mixins.  Instead of using inheritance, you can use a mixin to add functionality to a class without directly inheriting from another class.
  • Isolates.  Instead of threads, the Dart language uses isolates for concurrency.  Isolates can’t actually share any memory, they pass information though messages.  It is very hard to shoot yourself in the foot.
  • Simplified built-in types.  Numbers can be either int or double, and you can just use num, if you don’t care.  Lists and maps can be declared as literals.  An array is just a special case of a list.
  • Functions are first-class objects.  You can pass them around just like any other object.  There is even a lambda-like short-hand for creating a one-liner function.
  • Top level functions and variables.  Don’t want to put a function or variable in a class?  Good, you don’t have to.  In the Dart language, you can declare them anywhere you want.
  • Simplified classes.  There is short-hand for declaring constructors that assign parameters to class members.  Class members don’t have protected, private, public.  Member variables are automatically properties.
  • String interpolation.  No more string format methods, just use the $variableName in a string to have its value expanded.

Creating your first Dart language App

Step 1:

Go to File –> New Application.

Fill in your application name without space. (for ex: i used “helloworld”)

Leave “Generate sample content” checked.

Select “Web application.”

dart_helloworld_app

Step 2:

Open the helloworld.html file and clear out everything in the body element except for the two script tags at the bottom.

The first script tag imports our actual Dart file, just like you would use to add JavaScript to a page.

The second script adds Dart support to the browser.

Step 3:

Add the following HTML to the body tag in the helloworld.html file:

1
2
<button id="theButton" >Click Me</button>
<div id="resultDiv"></div>

This will just create a button and a div.  We are going to add some Dart code to respond to a button click and populate the div with some text.

dart_helloworld

Step 4:

Open the helloworld.dart file and clear out everything in main() and delete the reverseText function.

Notice that there are only two things we really will need in our .dart file.  Just an import ‘dart:html’, to import that html library for Dart, and the main function, which executes as soon the DOM content is loaded on the page.

Step 5:

Edit the helloworldweb.dart file to make it look like this:

1
2
3
4
5
6
7
8
9
10
11
import 'dart:html';
void main() {
  var button = query("#theButton");
  button.onClick.listen(addResult);
}
void addResult(Event e) {
  var resultDiv = query("#resultDiv");
  resultDiv.text = "You clicked the button";
}

This code simply gets the button using a CSS selector.  It uses the query function to do this.

dart_helloworld_apptips

Then we register the addResult function as an event handler for the onClick event for the button.

In the addResult function, we simply query for the resultDiv and change its text.

After you run this example, you should see a result like this:

helloworlddartop

Step 6:

Now change the Dart code to look like this:

1
2
3
4
5
6
7
8
import 'dart:html';
void main() {
  query("#theButton")
    .onClick.listen(
        (e) => query("#resultDiv").text = "You clicked the button!"
    );
}

< content @courtesy oreilly >

Dart is a source code VM

The Dart VM reads and executes source code, which means there is no compile step between edit and run. As with other popular scripting languages, it’s very quick to iterate with Dart. The Dart VM runs on the command line and servers, and can be embedded into browsers. Just point the VM at Dart source code and you’re up and running!

Dart is optionally typed

Dart understands that sometimes you just don’t feel like appeasing a ceremonial type checker. Dart’s inclusion of an optional type system means you can use type annotations when you want, or use dynamic when that’s easier.

For example, you can explore a new idea without having to first think about type hierarchies. Just experiment and use var for your types. Once the idea is tested and you’re comfortable with the design, you can add type annotations.

Here is a comparison between code that uses type annotations, and code that uses var for dynamic. Both of these code snippets have the same runtime semantics:

With type annotations:

  void advance(double dt) {
    double dx, dy, dz, distance, mag;
    int size = bodies.length;
    for (int i = 0; i < size; i++) {
        Body bodyi = bodies[i];
        // ...

Or, without type annotations:

  advance(dt) {
    var dx, dy, dz, distance, mag;
    var size = bodies.length;
    for (var i = 0; i < size; i++) {
        var bodyi = bodies[i];
        // …

Type annotations are great for the “surface area” of the code (such as method and function signatures), and the tools are getting good enough for you to consider using var inside methods and functions.

Dart supports collection literals

It’s easy to declare lists and maps with Dart. For example, here is a simple list:

var fruits = ['apples', 'oranges', 'pears'];

And here is a simple map:

var accounts = {'322532': new Account('Bob'), '43534345': new Account('Alice')};

Dart is purely object oriented

Dart’s language is clear: everything is an object. It is easy to explain how everything works without having to deal with primitives as a special case. Even calling + on two numbers is modeled as a method call. Numbers, booleans, and even null are all objects.

Dart supports top-level functions and variables

Not everything must live inside of a class. Dart’s libraries can contain top-level functions and variables. You can write whole programs without ever using a class.

Here is a simple Dart library:

library louder;

String shout(String msg) => msg.toUpperCase();

Using this library is easy:

import 'louder.dart';

main() {
  print(shout('Dart is fun!'));  // DART IS FUN!
}

Dart’s main function is terse

No more public-static-void-main-String[]-args just to start a program! Dart’s simple top-level main()function is all you need.

Here is an example:

main() {
  print('Hello, Dart!');
}

All Dart programs start at the main() function.

Dart lets you put any number of public classes into a file

Organize your project’s files and contents the way you want to. You are not forced to name the file the same as the class, and you aren’t forced to place only one public class in a file. Go ahead, put two classes into one file. Whatever works for you!

Dart has closures and lexically scoped functions

Create functions that can naturally access variables in their enclosing scope, without having to write verbose anonymous inner classes.

Here is an example of a closure in action. The makeAdder function returns a function that closes aroundmakeAdder‘s parameter.

makeAdder(int x) {
  adder(int y) => x + y;
  return adder;
}

main() {
  var add2 = makeAdder(2);
  var result = add2(3);
  print(result); // 5
}

You can use simplify makeAdder by returning an anonymous function:

makeAdder(int x) {
  return (int y) => x + y;
}

Dart has mixins

No need to pollute the inheritance hierarchy with utility classes. Use Dart’s mixins to slide in functionality that is clearly not an is-a relationship.

Classes that extend object, don’t have constructors, and don’t call super can be a mixin. Here is an example:

abstract class Persistable {
  save() { ... }
  load() { ... }
  toJson();
}

class Hug extends Object with Persistable {
  Map toJson() => {'strength':10};
}

main() {
  var embrace = new Hug();
  embrace.save();
}

Dart has operator overriding

You can add operators to your class. Here is an example:

class Point {
  num x, y;
  Point(this.x, this.y);

  Point operator +(Point other) => new Point(x+other.x, y+other.y);
}

main() {
  var p1 = new Point(1, 1);
  var p2 = new Point(2, 2);
  var p3 = p1 + p2;
}

Dart has string interpolation

It’s very easy to build a string from variables or expressions. Here is an example of implementing toString()and including the x and y fields in the output.

// Dart
class Point {
  num x, y;
  Point(this.x, this.y);

  String toString() => 'X: $x, Y: $y';
}

Dart has noSuchMethod

A class can implement noSuchMethod to handle methods that don’t explicitly exist on the class.

In the following example, the LoggingProxy logs all method calls before they are delegated. The code uses mirrors for run-time reflection and delegation, and noSuchMethod to capture the calls.

import 'dart:mirrors';

class LoggingProxy {
  InstanceMirror mirror;
  LoggingProxy(delegate)
    : mirror = reflect(delegate);

  noSuchMethod(Invocation invocation) {
    var name = invocation.memberName;
    print('${name} was called');
    return mirror.delegate(invocation);
  }
}

You can use the above code like this:

class Greeter {
  hello() => print("hello!");
}

void main() {
  var greeter = new LoggingProxy(new Greeter());
  greeter.hello();
}

// Output is:
// Symbol("hello") was called  (from the proxy)
// hello!  (from the delegate Greeter)

< content @courtesy oreilly >

Reference:
1) http://www.dartlang.org/#get-started

2) http://pluralsight.com/training/Courses/TableOfContents/introduction-building-web-applications-dart

3) http://www.dartlang.org/tools/editor/

4) http://www.dartlang.org/docs/cookbook/

5) http://www.dartlang.org/docs/dart-up-and-running/contents/ch03.html

6) http://www.dartlang.org/docs/

One thought on “Dart Language

  1. David Evans November 26, 2016 / 2:07 AM

    Nice article, where could I obtain a copy of the dart cheat sheet?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s