dart --- 更符合程序员编程习惯的javascript替代者

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› 服务器相关›Dart 编码风格指南

原作者: [db:作者] 来自: [db:来源] 收藏邀请

dart是google在2011年推出的一门语言，提供较为丰富的lib，并支持将代码转变为javascript，其demo code 和 demo app 也是以web前端代码来展示的。

其语言特性较之javascript更加严谨，代码风格趋于c 和 java ，较之javascript更加优美，同时也能看到部分函数式语言的书写特性。

其开发环境也是别具一格，除了使用eclipse开发了支持桌面使用的开发IDE以外，还提供了在浏览器中使用dart进行开发的环境：chrome dev editor. 其实是一个chrome插件。https://github.com/dart-lang/chromedeveditor

图例如下：

语言在语法上相对容易上手，而且非常容易写出结构清晰的代码，兼具python的简洁和 java 的严谨。

lib/reverser.dart

library reverser;

import 'dart:html';

// Example of hooking into the DOM and responding to changes from input fields.
initReverser() {
  var output = querySelector('#out');
  var input = querySelector('#name');
  input.onKeyUp.listen((_) {
    output.text = input.value.split('').reversed.join();
  });
}

main.dart

import 'dart:html';

import 'package:HelloDart/nav_menu.dart';
import 'package:HelloDart/reverser.dart'; //引入上面的reverser.dart库
import 'package:route_hierarchical/client.dart';

void main() {
  initNavMenu();
  initReverser();

  // Webapps need routing to listen for changes to the URL.
  var router = new Router();
  router.root
    ..addRoute(name: 'about', path: '/about', enter: showAbout)
    ..addRoute(name: 'home', defaultRoute: true, path: '/', enter: showHome);
  router.listen();
}

void showAbout(RouteEvent e) {
  // Extremely simple and non-scalable way to show different views.
  querySelector('#home').style.display = 'none';
  querySelector('#about').style.display = '';
}

void showHome(RouteEvent e) {
  querySelector('#home').style.display = '';
  querySelector('#about').style.display = 'none';
}

通过以上代码可以看到其清晰的目录结构和代码风格。

ref:

1. 官方示例app : https://www.dartlang.org/codelabs/darrrt/

2. dart的web app应用angular版： https://angulardart.org/tutorial/

3. dart的web版IDE： https://github.com/dart-lang/chromedeveditor