中文编程
首发于中文编程
JavaScript实现ZLOGO: 前进方向和速度

JavaScript实现ZLOGO: 前进方向和速度

系列前文:

JavaScript实现ZLOGO子集: 前进+转向

JavaScript实现ZLOGO子集: 单层循环功能

JavaScript实现ZLOGO子集: 测试用例

JavaScript实现ZLOGO: 用语法树实现多层循环

功能上, 添加了蚂蚁图标显示当前前进方向, 并可通过修改源码实现行进速度. 并未对语言本身进行改进. 另有一点界面改进. 源码仍在: program-in-chinese/quan3

在线演示仍在: codeinchinese.com/%E5%9

演示

默认2倍行进速度(相比之前)画田字格:

中文LOGO语言画出田字格https://www.zhihu.com/video/1057120067392761856

8倍行进速度画"轮胎"(LOGO源码在github.com/program-in-c):

用中文LOGO语言画出"轮胎"https://www.zhihu.com/video/1057120114847039488

部分相关源码

下面是为添加蚂蚁和定制速度作的主要修改:

+  if (!指示方向图) {
+    指示方向图 = createImg("图标/蚂蚁头向上.png")
+    指示方向图.size(36, 34);
+  }
+
   // TODO: 提取到二阶函数
   绘制 = function() {
     var 当前序号 = 序号;
+    const 速度 = 2;
     background(255, 255, 255);
 
     for (var i = 0; i < 路径表.length; i++ ) {
@@ -33,16 +41,20 @@ const 生成指令序列 = require("./语法树处理").生成指令序列
       var 起点 = .起点;
       var 终点 = .终点;
       var 距离 = .长度;
-      if (当前序号 < 距离) {
-        line(起点.x, 起点.y, 起点.x + (终点.x - 起点.x) * 当前序号 / 距离, 起点.y + (终点.y - 起点.y) * 当前序号 / 距离);
+      if (当前序号 < 距离 / 速度) {
+        var 当前x = 起点.x + (终点.x - 起点.x) * 当前序号 * 速度 / 距离;
+        var 当前y = 起点.y + (终点.y - 起点.y) * 当前序号 * 速度 / 距离;
+        指示方向图.position(当前x + 238, 当前y - 8); // TODO: 需要对准线头
+        指示方向图.style("transform", "rotate(" + (90 - .前进角度) + "deg)")
+        line(起点.x, 起点.y, 当前x, 当前y);
         break;
       } else {
         line(起点.x, 起点.y, 终点.x, 终点.y);
-        当前序号 = 当前序号 - .长度;
+        当前序号 = 当前序号 - .长度 / 速度;
       }
     }
     
-    序号 ++;
+    序号 += 速度;
   }

可能改进

  1. 蚂蚁图标在火狐下没有对准走线, 应该是上面TODO的问题
  2. 改进蚂蚁图标, 需在开始时就显示
  3. 可在界面直接修改行进速度, 隐藏蚂蚁
  4. 部分p5js API继续汉化, 如line, background
编辑于 2018-12-15

文章被以下专栏收录

    在所有编程语言和领域中尝试编写中文代码,开发相关工具,总结经验,一致代码风格。包括中文命名,汉化现有语言,创造中文语法的编程语言等等。作为最熟悉的母语,用来编写代码会让代码更容易被自己和母语相同的其他开发者理解。基于英文的编程语言和框架中,使用中文命名有时有技术问题。希望这里为后人趟雷,填坑。多数现有API是英文的,这里也会对其中一些常用的进行汉化。当然,这里也会对基于中文的编程语言进行探讨。包括汉化基于英文的编程语言,以及创造新的编程语言。

    生成艺术/ 交互设计/ 数据可视化/ 机器学习/ 音乐可视化/ 游戏制作/ APP/ 分形艺术……