jGRASP: 轻量级IDE中的数据结构动画

理论计算机科学电子笔记178（2007）101-109www.elsevier.com/locate/entcs在轻量级IDE中提供数据结构动画Dean Hendrix1 James H.十字架2Jhilmil Jain3Larry Barowski4奥本大学奥本，阿拉巴马州36849美国摘要本文介绍了一个数据结构动画工具jGRASP，它可以在底层代码开发过程中自动生成多个同步视图。IDE与教学有效的软件可视化的无缝集成使jGRASP成为教育工作者和学生的有趣工具。关键词：可视化，数据结构，IDE，jGRASP1引言虽然许多可视化技术已被证明是有效的教学，他们仍然没有被广泛采用。原因包括：缺乏自动生成可视化的合适方法;缺乏可视化之间的集成;以及缺乏与基本集成开发环境（IDE）支持的集成。为了在开发代码时有效地使用可视化，在不离开IDE的情况下自动生成多个同步视图非常有用jGRASP IDE（jgrasp.org）提供了对象查看器，可以自动生成Java中对象和原始变量的动态、基于状态的可视化。这种轻量级IDE与一组教学有效的软件可视化的无缝集成应该对软件的有用性产生积极的影响1电子邮件：hendrtd@auburn.edu2 电子邮件地址：crossjh@auburn.edu3 电邮地址： jainjhi@auburn.edu4电子邮件：barowla@auburn.edu1571-0661 © 2007 Elsevier B. V.在CC BY-NC-ND许可下开放访问。doi：10.1016/j.entcs.2007.01.039102D. 亨德里克斯等人理论计算机科学电子笔记178（2007）101在课堂环境中进行可视化。多位讲师报告了其有用性的积极轶事证据。我们进行了正式的，可重复的实验，以调查这些观众对学生表现的单链表的影响，我们发现，与使用断点的传统视觉调试方法相比，统计学上有显着的改进。类似的实验，但重点是二叉搜索树，目前正在进行中。2相关工作我们为jGRASP中基于状态的查看器所采用的方法是从用户的执行程序自动生成可视化，然后在用户以调试或工作台模式逐步查看源代码时动态更新可视化。这与Jeliot [7]中使用的方法有些相似。然而，jGRASP的目标受众明显来自Jeliot。Jeliot专注于开始的概念，如表达式求值和变量赋值在这方面，jGRASP类似于DDD[10]。DDD中的数据结构可视化显示每个对象及其字段，并显示字段指针和引用边。在jGRASP中，每个类别的数据结构（例如，链表与二叉树）具有其自己的视图和子视图集，这些视图和子视图集旨在与教科书中找到的视图和子视图集类似。虽然我们计划添加一个通用的链接结构视图，但我们从更直观的“教科书”视图开始我们特别避免了将jGRASP中的可视化基于脚本语言，这是JHAVE [8]等算法可视化系统的常用方法我们还决定不修改用户我们的理念是，为了使可视化对程序理解产生最大的影响，它们必须在日常开发过程中根据用户的实际程序生成3动机奥本大学的所有计算机科学，软件工程和无线工程专业都必须参加COMP 1210课程（Java中的对象早期数据结构和算法是抽象的概念，对本主题的理解和课堂上涵盖的材料可以分为两个层次：a）概念-学生学习操作的概念，如创建，添加，删除，排序等; b）编码-学生使用任何编程语言（我们的情况下是Java）实现数据结构及其操作。来自计算机专业的学生在CS2课程中最引人注目。我们在2004年秋季和2005年春季进行了基于纸张的调查和一对一的访谈，以了解学生发现最困难的CS2课程[4]。调查的一个结果清楚地表明，D. 亨德里克斯等人理论计算机科学电子笔记178（2007）101103找到了难以理解的基本概念，但在实现方面遇到了更多的麻烦。这一调查结果得到了课程成绩数据的支持。大约75%的学生表示，他们有适当的Java专业知识水平，以完成CS2的要求。基本的问题是，学生们很难从静态教科书概念过渡到动态编程实现[9]。因此，需要弥合从概念到执行的差距。[1] 报告说，75-80%的学生是视觉学习者。大多数学生将保留更多的信息时，它与视觉元素（图片，图表，图表等）。在编程中，视觉学习者可以从创建问题解决方案的图表中受益（例如，在编码之前，类似地，数据结构状态的可视化表示应该有助于理解数据结构。因此，有一个工具，使学生能够可视化数据结构的概念和实现方面，这将是有益的。我们调查了超过21种用于数据结构可视化的工具[5]，发现大多数工具（超过14种）专注于概念理解。我们发现，只有7个实现级别的工具，以帮助学生在程序理解和调试活动。这些实现工具都没有实现我们的所有目标，即，• 满足课堂演示和开发环境的双重目的（即可用于实验练习和作业）• 提供视图• 提供多个同步视图• 提供对可视化• 弥合抽象学习和代码实现4jGRASP对象查看器在执行过程中，Java程序通常会从用户类和库类创建各种对象。由于这些对象只在执行过程中存在，因此能够以有意义的方式可视化它们可能是程序理解的重要元素虽然这种可视化可以在头脑中对简单的对象进行，但大多数程序员可以在程序运行时看到复杂对象的更有形的表示从1.8版开始，jGRASP IDE为对象和原语提供了一系列动态查看器。这些查看器是jGRASP提供的软件可视化的最新补充。查看器的目的是提供特定类别对象的一个或多个视图。当一个类有多个关联的视图时，用户可以在同一对象上打开多个查看器，每个查看器中有一个单独的视图。这些查看器与jGRASP工作台和调试器紧密集成，并且可以从Virtual Desktop（参见图1）中为“安装”或“调试”选项卡中的任何项目打开。由于jGRASP集成调试器用于收集必要的运行时信息，104D. 亨德里克斯等人理论计算机科学电子笔记178（2007）101Fig. 1. jGRASP虚拟桌面为了呈现可视化，程序必须在调试器中或从jGRASP工作台运行，以便其数据结构被可视化。通过简单地将图标从调试器或工作台拖放到jGRASP桌面，可以为工作台或调试器选项卡上当前活动的任何原语、对象或对象的字段打开单独的查看器窗口。因此，这些查看器对于学生创建和使用它们所需的工作量是无关紧要的。所有对象都有一个基本视图，该视图与工作台和调试选项卡中显示的视图相同。此视图在可折叠层次结构中显示与对象关联的所有值。根据其数据类型，某些对象将具有其他视图。图2a和2b显示了一个整数数组（int）和一个java.util.TreeMap实例的对象查看器每个都显示在演示视图中，该视图旨在类似于教科书描述或教师可能在板上绘制jGRASP为Java集合框架中的数组、字符串和类提供了表示查看器5动画片浏览者浏览器分为两类：非验证和验证。非验证查看器假定正在查看的对象的结构是正确的，并且通常使用方法调用来详细说明结构。当一个结构超过一定的尺寸时，非验证的观察者将只检查屏幕上的结构部分正因为如此，它们可以用来检查大型结构，而不会过度减慢调试过程。非验证查看器通常用于在使用它的算法的上下文中检查结构的内容，而不是检查数据结构本身的工作。用于“内置”数据结构的查看器（例如，数组、JCF类）都是非验证的。非验证查看器在[3]中进一步详细讨论验证查看器的目的是帮助理解数据D. 亨德里克斯等人理论计算机科学电子笔记178（2007）101105（一）（b）第（1）款图二. (a)int数组的查看器。 (b)java.util.TreeMap实例的查看器结构本身，并协助发现错误，而学生正在开发自己的数据结构的实现。为了进一步实现这一预期用途，还将显示结构节点类型的任何局部变量，以及它们链接到的任何节点。显示这些局部变量节点或结构片段与主结构之间的这使得数据结构的机制，如查找，添加，移动和删除元素，可以通过单步执行代码来详细检查。作为理解数据结构机制的额外帮助，验证查看器将结构变化动画化。为了做到这一点，它们在每次更新时存储整个数据结构的表示（查看器更新发生在断点处或调试器中的一个步骤之后每次更新时，106D. 亨德里克斯等人理论计算机科学电子笔记178（2007）101上一次更新（可能与当前值相同，也可能不相同）检查是否有变化。如果结构中的任何节点已经移动，则查看器进入动画模式。在此模式下，“动画更新”会定期发生。在动画期间，显示先前的结构值和先前的局部节点位置被内插，使得它们在主结构和局部变量节点以及结构片段之内和之间从它们的旧位置平滑地移动到新位置。在动画结束时，将显示新的结构值和新的局部变量节点以及结构片段目前，通过扩展jGRASP提供的基本查看器类，可以创建数据结构的动画验证查看器。当放置在查看器目录中时，这些查看器可用于在调试或工作台模式下执行的任何程序。用户可以简单地将对象引用拖放到屏幕上的任何位置。查看器将在用户逐步执行代码时自动更新。如果为同一个类实现了多个查看器，用户只需从查看器窗口的下拉列表中进行选择。我们目前正致力于一种查看器机制，该机制将尝试识别由用户的类定义的结构的类型（如果有的话），然后将类的内部字段映射到查看器类的适当类别（例如，链表）。这将大大减少手动扩展基本查看器类的需要当用户打开查看器时，jGRASP的目标是确定对象的固有数据结构并显示最合适的视图。图3显示了由验证查看器生成的动画序列中的三个帧查看器是在CS2教科书中使用的二叉搜索树类的实例上打开的。这些帧描述了将新元素（35）插入到现有的二叉搜索树中。使用这个查看器，学生们能够看到指针（当前）沿着树节点向下移动以找到正确的插入点，然后看到新节点作为40的左子节点“滑动”到位。 所有这一切都是在他们单步执行代码时完成的，因此在类中演示的抽象行为和代码中体现的具体实现之间建立了直接联系。6评价我们目前正在进行对照实验，以测试以下假设：(i) 学生能够使用jGRASP数据结构查看器更准确地编码（错误更少）。(ii) 学生能够使用jGRASP查看器更快地发现和纠正已经进行了两个专注于链表的实验，并获得了统计学上有意义的结果[6]。从这些实验的数据分析表明，动画验证查看器提高了学生在开发和调试他们的链表代码的准确性和速度两个后续实验-D. 亨德里克斯等人理论计算机科学电子笔记178（2007）101107图3.第三章。快照从动画验证查看器的108D. 亨德里克斯等人理论计算机科学电子笔记178（2007）101刚才已经进行了一些分析，但数据分析还没有完成。这些实验集中在二叉搜索树而不是链表上。6.1树实验1正在测试的假设是，使用jGRASP数据结构查看器，学生在开发过程中将更有效率学生们被要求实现一个链接二叉搜索树的操作。本实验中使用了课堂教科书中的类LinkedBinaryTree.java向学生提供了编程作业和评分政策的详细说明学生们被要求独立完成作业，并被计时（尽管完成作业没有时间限制自变量是可视化介质（使用jGRASP查看器与不使用查看器进行编码）。因变量为：完成分配所需的时间和分配的准确性。控制组使用jGRASP可视化调试器实现了方法levelOrder（），但没有查看器。提供给这个小组的驱动程序包含一个toString（）方法，这样他们就可以打印出列表的内容，而不需要编写额外的代码。治疗组使用jGRASP可视化调试器和对象查看器实现相同的方法。由于我们的al-task for levelOrder（）遍历需要三个不同的数据结构，我们为学生提供了三个查看器（用于LinkedBinaryTree、LinkedQueue和ArrayUnorderedList）。给这个组的驱动程序不包含toString（）方法，所以受试者必须使用查看器来查看数据结构的内容。实验室中的机器设置了权限，只有治疗组才能访问查看器。6.2树实验2我们的假设是，学生能够在更短的时间内使用jGRASP查看器检测和纠正逻辑错误。提供了一个实现链接二叉查找树的Java程序。这个程序总共包含了5个逻辑错误，分别出现在以下5个方法中：addElement（）、removeElement（）、find（）、preorder（）和postOrder（）。学生们被要求找出并纠正所有的逻辑错误。自变量是可视化介质（使用jGRASP查看器与不使用查看器发现错误因变量为：发现的错误数量、正确纠正的错误数量以及在执行实验时在程序中引入的新错误数量。这两个小组首先被要求识别和记录错误。接下来，类似于实验1，对照组使用jGRASP视觉调试器在没有观察器的情况下纠正检测到的错误，治疗组使用jGRASP视觉调试器在有对象观察器的情况下纠正错误。虽然这两个实验的数据分析尚未完成，但来自学生的证据表明，链表实验的积极结果将在二叉搜索树实验中得到复制D. 亨德里克斯等人理论计算机科学电子笔记178（2007）1011097结论jGRASP对象查看器在Java中自动生成对象和原始变量动态、基于状态的可视化。IDE中的用户可以立即使用对象的多个同步可视化，包括复杂的数据结构。多位教师在CS1和CS2中使用了这些查看器，并报告了它们有用的积极轶事证据。使用链表进行的正式、可重复的实验表明，对学生的表现有统计学意义的积极结果。二叉搜索树的后续实验刚刚完成，轶事证据和学生反馈表明它们将产生类似的积极结果。引用[1] 费 尔 德 河 和 L. Silverman ， Learning and Teaching Styles in Engineering Education ， EngineeringEducation78（1988），pp. 674-681。[2] Hamer，J.，Java的轻量级可视化工具，在：Proceedings of Third Progam Visualization Workshop，2004，pp.55比61[3] Hendrix，D.，J. Cross和L. Barowski，一个在轻量级IDE中提供动态数据结构可视化的可扩展框架，在：第35届SIGCSE计算机科学教育技术研讨会论文集，2004年，pp. 387-391.[4] Jain，J.，N. Billor，D. Hendrix和J. Cross，调查数据结构理解，在：统计学，组合学，数学和应用国际会议论文集，奥本，阿拉巴马州美国，2005年。[5] Jain，J.，J. Cross和D. Hendrix，Qualitative assessment of systems facilitating visualization of datastructures，in：Proceedings of 2005 ACM Southeast Conference，Kennesaw，Georgia USA，2005。[6] Jain ，J. ， J. Cross ， D. Hendrix 和L. Barowski ， Experimental evaluation of animated-verifying objectviewers for java，in：SoftViz 2006（submitted），2006.[7] Kannusmaki ， O. ， A. Moreno ， N. Myller 和 E. Sutinen ， What a novice wants ： students usingprogramvisualization in distance programming course，in：Proceedings of Third Progam VisualizationWorkshop，2004，pp. 126比133[8] 纳普斯， Jhave：支持算法可视化， 计算机图形学与应用Sep/Oct（2005），pp. 49比55[9] Shaaner，C.，L.杨俊，以天鹅资料结构视觉化系统进行电脑科学教育，于：1996年美国电脑科学教育学会论文集，1996年，页。140-144[10] Zeller，A.，Visual Debugging with ddd，Dr. Dobb