一个异步的js类库,应用价值不大,所以代码也没在维护了。在做h5特效或者游戏动画方面有点用处。

  $await是Windjs的核心api。具体可以check 浅谈Jscex的$await语义及异步任务模型

  具体使用demo:

var A = eval(Wind.compile("async", function () {
  console.log("Start A");
  $await(Wind.Async.sleep(3000));
  console.log("Finish A");
}));

var B = eval(Wind.compile("async", function () {
    console.log("Start B");
    $await(Wind.Async.sleep(5000));
    console.log("Finish B");
}));

var C = eval(Wind.compile("async", function () {
    console.log("Start C");
    console.log("Finish C");
}));

var run = eval(Wind.compile('async', function() {
  $await(A());
  $await(B());
  $await(C());
}));

run().start();

  简单地说就是将线程挂起了。我们可以试着用Windjs画一个圆,在大部分平台上编写这样的程序并没有太大困难,只要在绘制出图形之后短暂地阻塞线程就行了。可惜,在JavaScript中我们只能“一蹴而就”,要暂停的话,只能使用setTimeout进行回调了。不过,这也正是Windjs的用武之地,用Windjs编写的代码需要“暂停”,只需要简单地调用sleep异步方法,一切都很直接。js里$await方法一定要封装在eval中。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> </title>
<script src="http://files.cnblogs.com/files/zichi/wind-all-0.7.3.js"></script>
<script>
window.onload = function() {
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var x = 250;
var y = 250;
var r = 100;
var frontX = x - r;
var frontY = y;

var drawAsync = eval(Wind.compile('async', function() {
for(var i = x - r; i <= x + r; i++) {
var tempY = Math.sqrt(r * r - (x - i) * (x - i));
ctx.beginPath();
ctx.lineWidth = 5;
ctx.moveTo(frontX, frontY);
ctx.lineTo(i, y+ tempY);
$await(Wind.Async.sleep(10));
ctx.stroke();
frontX = i;
frontY = y + tempY;
}

for(var i = x + r; i >= x - r; i--) {
var tempY = Math.sqrt(r * r - (x - i) * (x - i));
ctx.beginPath();
ctx.lineWidth = 5;

ctx.moveTo(frontX, frontY);
ctx.lineTo(i, y - tempY);
$await(Wind.Async.sleep(10));
ctx.stroke();
frontX = i;
frontY = y - tempY;
}
}));
drawAsync().start();
};
</script>
</head>
<body>
<canvas id='canvas' width=500 height=500 >
</canvas>
</body>
</html>

//

Windjs应用的更多相关文章

  1. observejs改善组件编程体验

    传送门 observejs:https://github.com/kmdjs/observejs 本文演示:http://kmdjs.github.io/observejs/list/ 本文代码:ht ...

  2. AMD and CMD are dead之JS工程化终极解决方案KMD.js版本0.0.1发布

    回顾 经过两天晚上疯狂的开发调试,伴随着大量掉落的头发和酸痛的颈椎,KMD.js赢来了第一个稳定版本.在此期间KMD规范也有所修改和完善. 这两天主要完成的功能有: 按需加载 版本控制 模块管理 便捷 ...

  3. 用nodejs,express,ejs,mongo,extjs实现了简单了网站后台管理系统

    源代码下载地址:http://download.csdn.net/detail/guoyongrong/6498611 这个系统其实是出于学习nodejs的目的而改写的系统. 原来的系统前端使用了ex ...

  4. 用async 解放你的大脑

    在js中,代码嵌套和代码回调非常常见,不仅编写麻烦而且异常反人类.让我等码农很是头痛 function () {     function () {         function () {     ...

  5. Hive原理总结(完整版)

    目录 课程大纲(HIVE增强) 3 1. Hive基本概念 4 1.1 Hive简介 4 1.1.1 什么是Hive 4 1.1.2 为什么使用Hive 4 1.1.3 Hive的特点 4 1.2 H ...

  6. matlab矢量场数值可视化(动态数值模拟)

    https://blog.csdn.net/eric_e/article/details/81294092 D3.js实现数据可视化 三维可视化 风场可视化(数据插值):风场是动态变化的,实时刷新的, ...

  7. html5引擎开发 -- 引擎消息中心和有限状态机 - 初步整理 一

    一 什么是有限状态机        FSM (finite-state machine),又称有限状态自动机,简称状态机,是表示有限个状态以及在这些状态之间的转移和动作等行为的数学模型.他对于逻辑以及 ...

随机推荐

  1. HttpModule

    HttpModule是如何工作的 当一个HTTP请求到达HttpModule时,整个ASP.NET Framework系统还并没有对这个HTTP请求做任何处理,也就是说此时对于HTTP请求来讲,Htt ...

  2. php框架laravel:数据库建立:artisan

    aravel 迁移是一种数据库的版本控制.迁移通常和 结构生成器 配对使用来管理您应用程序的数据库结构. 配置数据库 我们安装wamp,并且使用mysql方式.用wamp自带的phpMyAdmin添加 ...

  3. 用自己的算法实现startsWith和endsWith功能。

    String str=new String(); str="erty"; Scanner sc= new Scanner(System.in); System.out.printl ...

  4. 【转】ETL增量抽取——通过时间戳方式实现

    这个实验主要思想是在创建数据库表的时候, 通过增加一个额外的字段,也就是时间戳字段, 例如在同步表 tt1 和表 tt2 的时候, 通过检查那个表是最新更新的,那个表就作为新表,而另外的表最为旧表被新 ...

  5. Linux磁盘管理之创建磁盘分区05

    一.磁盘基础知识 磁盘安装在计算机上后,在系统读取到硬盘后并不能直接使用,必须经过分区.格式化才能够正确使用.这一次主要是针对磁盘分区进行简单总结,存储设备类型:U盘.光盘.软盘.硬盘.磁带. 硬盘接 ...

  6. TCP/UDP常见端口参考

    著名端口 端口号码 / 层 名称 注释 1 tcpmux TCP 端口服务多路复用 5 rje 远程作业入口 7 echo Echo 服务 9 discard 用于连接测试的空服务 11 systat ...

  7. 聚合数据董铭彦:小程序开发的兴起将带火API数据交易

    2016中关村大数据日活动近日在京举办,今年新进驻北京的聚合数据受邀参与,在13日举行的大数据交易专场论坛上,聚合数据副总裁董铭彦与参会嘉宾以"共筑数据交易产业生态,共享大数据时代红利&qu ...

  8. Medusa引擎开源了

    首先贴出 Github地址 然后博客地址 相比于市面上其他的著名游戏引擎,例如Unity,cocos2dx,Unreal,Medusa游戏引擎目前还非常的简陋,目前实现的功能还集中在2D部分,3D的虽 ...

  9. Stanford机器学习笔记-10. 降维(Dimensionality Reduction)

    10. Dimensionality Reduction Content  10. Dimensionality Reduction 10.1 Motivation 10.1.1 Motivation ...

  10. url 特殊字符

    URL中的特殊字符 有些符号在URL中是不能直接传递的,如果要在URL中传递这些特殊符号,那么就要使用他们的编码了.编码的格式为:%加字符的ASCII码,即一个百分号%,后面跟对应字符的ASCII(1 ...