Dart Client Side Web Programming PDF
Dart Client Side Web Programming PDF
Dart Client Side Web Programming PDF
JPA 2.0
n
JDBC Properties
iPad
n
Access Mode
n
Mappings
n
Shared Cache
n
Additional API and more... By Mike Keith
Core Dart
CONTENTS INCLUDE:
❱ About Dart
❱ Optional Typing Explained
❱ Dart Tools The Next-Generation Client-Side Web
❱ Core Types
❱ Functions
Programming Language
❱ Classes and Interfaces... and More! By Chris Buckett
Dart will not prevent this code from running, because type annotations are
A language for the web ignored at runtime. The Dart tools, however, will report a type warning on
Core Dart: The Next-Generation Client-Side Web Programming Language
Dart is designed as a web language that can be compiled to JavaScript or the call to repeatGreeting2(), as you are trying to pass int when it expects
run in a browser-embedded virtual machine. The JavaScript that is output a String.
is targeted at modern web browsers, which makes Dart a perfect match for
HTML5. Dart can also run on a server-side version of the virtual machine, Checked Mode vs Production Mode
using evented I/O to interact with the host operating system (Windows / Although Dart will not prevent this code from running, when you run this
Mac / Linux). code through the Dart Editor, a special "Checked Mode" is enabled in the
To run the previous script in a Dart-enabled web browser, you can embed Dart VM that attempts to halt execution when it encounters these types of
it in an HTML script tag, with a mime-type of application/dart, as shown warnings. During production mode (when you convert your Dart code to
below: JavaScript, run in the browser without using the editor, or run a server-side
app on the server-side VM), checked mode is switched off.
<!DOCTYPE html>
<html>
<head></head>
<body>
Hot You can enable checked mode in the stand-alone Dart VM by
passing in the parameter --checked from the command line.
<script type=”application/dart” src=”hello.dart”>
</script>
Tip
<script src=”packages/browser/dart.js”></script>
</body>
</html> Dart Tools
The dart.js script is a JavaScript bootstrapper that detects whether the
Dart VM is embedded in the browser. The “Hello World” message is output The Dart language is made to be toolable, and as such, its tool ecosystem
to the browser’s debug console. uses optional types to validate your application’s source code to trap errors
early.
Dart’s types are often called type annotations. This is because they have
no effect on the running of the code in production; instead, they provide
information to tools and other developers about the coder’s intention. The
following function is written twice, first with no type annotations, and then
with type annotations added:
The Dart tool ecosystem encompasses the Dart Editor and “Dartium”, a
custom build of Chromium with the Dart virtual machine embedded. This Command Description
pair of tools supports features such as integrated debugging, code auto- pub update Updates dependencies, pulling the newest versions allowed
completions, and refactoring. The Dart Editor is also available as an Eclipse by the dependencies configuration (and overwriting those in
plugin from http://www.dartlang.org/eclipse/update. the pubspec.lock) file.
Behind the scenes, the Dart Editor uses the dart_analyzer tool, a static pub publish Publish your package to Google's pub repository at http://
analyzer that will quickly find type errors in your code. You can integrate pub.dartlang.org
the dart_analyzer into your continuous integration system to trap errors
when your code is committed to source control. The Dart2js tool compiles
Dart source code to JavaScript, “treeshaking” to remove dead code as it Core Types
goes, while Dartdoc outputs navigable HTML API documentation from your
code comments. Finally pub, Dart’s package manager tool, pulls in library Dart is an object-oriented language with class-based inheritance similar to
dependencies from the web. These are all available in the Dart Editor Java or C#. All types descend from the base Object class. The var keyword
menus, as stand-alone command-line tools in the dart-sdk/bin folder. declares a variable and is a substitute for a strong type annotation.
Variables must be declared before they are used (unlike JavaScript),
Using Pub and objects created by using the new keyword to invoke the object’s
When you use the Dart Editor to create a new project, you are supplied constructor:
with a pubspec.yaml file, which you use to provide configuration and
dependency information to your project, and a starting-point project layout. var myObject = new Object(); // declare myObject and
By convention, following files and folders are used: // construct the Object
print(myObject); // use the object
In addition, the following files and folders may exist in your project folder: num, int, double
num is the base numeric type, and has two implementations: int and
double. num declares the basic operators of +-/* and functions such as
File / Folder Description
abs(), ceil(), floor(), and round(), amongst others.
pubspec.lock Contains version numbers of your project's
dependencies. Useful when you want your entire team to num
be using the same version of dependencies (otherwise, Use num to declare that you want a numeric value, whether an integer or
don't commit to source control) floating-point.
/packages/ Packages subfolders are symlinked throughout your
num myNum = 123.45;
project by the pub tool to enable relative access to all the num myRounded = myNum.round();
library dependencies.
doc/ Include hand-authored documentation about your
project here. int
The int type accepts integer values of arbitrary precision:
bin/ If your app is designed to be run from the command line,
include the dart script to execute your app here. int myInt = 123;
// or
example/ If examples are useful to users, place them here
var myInt = 456;
tool/ Any helper scripts for internal use within the package go
var myIntAsHex = 0xABCDEF12345;
in the tool folder.
var myBigInt = 65498763215487654321654987654321354987;
pubspec.yaml
The pubspec.yaml file provides configuration information about your
project, and has a GUI built into the Dart Editor. The following Pub double
commands are available: The double type accepts 64-bit floating point numbers as specified in the
IEEE 754 standard:
Summary of pub commands
double myDouble = 123.45;
Command Description // or
pub install Install new dependencies (runs automatically in the editor var myDouble = 123.45;
when you edit the pubspec file). Stores dependency var myDoubleWithExponent = 1.23e4;
versions in the pubspec.lock file.
Other collections
An expression enclosed within ${…} is evaluated before it is inserted into the Other collection classes include HashSet, Queue and Set, which offer more
string, for example: specialized functionality.
var answer = “result=${1+2}”;
print(answer); // result=3 Map
Like Lists, you can create maps (comma-separated list of key:value pairs)
The expression contained within curly braces can be any valid Dart using either a map literal or a class constructor:
expression, including function calls, for example:
// Map Literal syntax
Map myMap = {“key1”:”value1”, “key2”:”value2”};
var answer = “result=${1.23.round()}”; // or
print(answer); // result=1.0 var myMap = {“key1”:”value1”, “key2”:”value2”};
var myMap = {}; // empty map
Using Generics
void sayHello(String name) {
Any type can be used as a map’s key or a value, and you can mix key and print(“Hello $name”); // no return value
value types within a map. To restrict the key or value types, you can create }
maps using Generic typing (as with Lists) num sum(num val1, num val2) {
return val1 + val2;
}
// key is String, value is any Object
var myMap = <String,Object>{}; // empty map
var myMap = new Map<String,Object>(); Function Parameters
Functions can have both mandatory and optional parameters. Mandatory
You access and insert items into a map by using a key as an indexer. If the parameters are declared first and are always positional. Optional
key does not already exist, it will be replaced. parameters are named or positional, but not both.
When you call a function, you must always provide values for the first set of
var myMap = new Map(); mandatory parameters, but not the optional parameters.
myMap[“key1”] = “value1”;
myMap[“key2”] = “value2”; Optional positional parameters must be provided in the order in which they
print(myMap[“key2”]); // value2 are defined. Optional named parameters can be provided arbitrarily as
{key1:value1,key2:value2} pairs.
Accessing a key that has not been added will return null, but you can also Here are some examples – the function bodies are omitted:
explicitly check if the key exists using the containsKey() method.
/** definition with mandatory
var myMap = {“key1”:”value1”}; * all params are mandatory
print(myMap[“key2”]); // null */
print(myMap,containsKey[“key2”]); // false void mandatoryParams(String name, int version, url) {
// snip function body
}
You can easily access a map’s keys and values properties: /** definition with mandatory and
* optional positional parameters.
* [name] is mandatory, [version] and [url] are optional.
var myMap = {“key1”:”value1”, “key2”:”value2”};
* [version] defaults to 1 if not supplied.
* [url] defaults to null if not supplied.
// access the keys
*/
for (var key in myMap.keys) {
void optionalParameters(String name,
print(key);
[int version=1, url]) {
}
// snip function body
}
// access the values
/** definition with mandatory and
for (var value in myMap.values) {
* optional named parameters
print(value);
* [name] is mandatory, [version] and [url] can be
}
* passed independently of each other
*/
You can also iterate the key:value pairs using a forEach function callback: void optionalNamed(String name, {int version:1, url}) {
// snip function body
}
var myMap = {“key1”:”value1”, “key2”:”value2”};
// calling, elsewhere in code:
myMap.forEach( (key, value) { // // mandatory parameters passed in the correct order
print(“$key = $value”); // anonymous callback mandatoryParams(“Dart”,1,”http://www.dartlang.org”);
} );
optionalParameters(“Dart”);
optionalParameters(“Dart”,1);
optionalParameters(“Dart”,1,”http://www.dartlang.org”);
Functions // optional named parameters in any order as
// key:value pairs, within braces { }
optionalNamed(“Dart”,{version:1});
Functions live in top-level scope, inside function scope, or within a class
optionalNamed(“Dart”,{url:”http://www.dartlang.org”});
declaration (where they are known as methods). optionalNamed(“Dart”,
{version: 1, url:”http://www.dartlang.org”});
Dart has both longhand and shorthand functions. Shorthand functions optionalNamed(“Dart”,
consist of a single expression, and always return the value of that {url:”http://www.dartlang.org”, version: 1});
expression, for example:
Within a function body, you can discover whether an optional parameter
sayHello(name) => print(“Hello $name”); // returns null was supplied by using using the ?paramName syntax, for example:
sum(num val1,num val2) => val1+val2; // returns result
Because you can store a function in a variable, you can also pass a
function into another function as a parameter. The following example Classes and Interfaces
passes a function as the third parameter to the getResult function, calling
the returning the calcFunction’s result. Note the use of Function as type
Dart’s class system is very similar to Java and C#. It is single-inheritance
information for the third parameter.
with multiple interfaces.
/**
* Applies the function contained within calcFunction to
Defining Classes
* the values stored in val1 and val2 An example class with a constructor, methods, fields and getters and
*/ setters is shown below. All constructors, methods, getters and setters can
num getResult(num val1, num val2, Function calcFunction) { use either longhand or shorthand function syntax, and optional parameters.
return calcFunction(val1, val2);
}
class Language {
main() { String name; // public field
// declare two functions int _version; // private field: _ underscore prefix denotes
var add = (a,b) => a+b; // add a + b // private within the same library
var subtract = (c,d) => c-d; // subtract d from c static url = “http://www.dartlang.org”; // same value
// exists across
var result1 = getResult(1,2,add); // all instances
print(result1); // 3 final awesomeness = 11; // immutable after
// constructor initialization
var result2 = getResult(100,10,subtract);
print(result2); // 90 // default constructor
} Dart() {
name = “Dart”;
_version = 1;
Using Typedef }
It is good practice to provide type annotations to your function’s
parameters, as we did with the Function type. You can be even more // named constructor with initializer to initialize
specific, though, and make the getResult() function’s third parameter only // final variables before class construction.
Dart.withExtraAwe(aweValue) : awesomeness=aweValue {
accept a function with a defined function signature. You use the typedef name = “Dart”;
keyword to define a custom function type: _verison = 1;
}
// define a function signature: // Getter and setter pair. Getters and setters are
typedef CalcType(num value1, num value2); // function type // independent of each other, so you can have one
// without the other
// Third parameter accepts a CalcType of function int get version => _version; // shorthand syntax
num getResult(num val1, num val2, CalcType calcFunction) { // returns _version
return calcFunction(val1, val2); set version(int val) { // longhand syntax
} _version = val; // sets the _version
}
main() {
// function signature matches CalcType // private method, shorthand syntax
var add = (num a,num b) => a+b; bool _isAwesome() => this.awesomeness > 10;
A B O U T th e A uthors R e comm e n d e d B oo k
Chris Buckett is a Technical Manager at Entity Group in Dart in Action introduces Google's Dart language and
the UK. He builds enterprise scale line of business web provides techniques and examples showing how to
apps with GWT, Java and .Net, and provides solutions to use it as a viable replacement for Java and JavaScript
in browser-based desktop and mobile applications. It
enterprise data problems. Chris is a Google Developer
begins with a rapid overview of Dart language and tools,
Expert in Dart, author of Dart in Action, runs http://blog.
including features like interacting with the browser,
dartwatch.com, and curates the http://DartWeekly.com optional typing, classes, libraries, and concurrency with
newsletter. He believes in using the best tool for the job, isolates. After you master the core concepts, you'll
and Dart is a great tool for building modern browser web move on to running Dart on the server and creating
applications. single page HTML5 web applications.
Free PDF
C++
Sencha Touch
Couchbase API
Git for the Enterprise
DZone, Inc.
150 Preston Executive Dr.
Suite 201
Cary, NC 27513
DZone communities deliver over 6 million pages each month to 888.678.0399
more than 3.3 million software developers, architects and decision 919.678.0300
makers. DZone offers something for everyone, including news,
Refcardz Feedback Welcome
$7.95
tutorials, cheat sheets, blogs, feature articles, source code and more.
“"DZone is a developer's dream",” says PC Magazine. [email protected]
Copyright © 2013 DZone, Inc. All rights reserved. No part of this publication may be reproduced, stored in a retrieval Sponsorship Opportunities
system, or transmitted, in any form or by means electronic, mechanical, photocopying, or otherwise, without prior
[email protected]
Version 1.0
written permission of the publisher.