Landing : Athabascau University

Group members: this is the place for your learning diary. Use this to post your zipped-up site at least once each unit, and your reflections as often as you wish (at least once per unit). Please write your reflections directly in the post, not as attached files. Where you do need to attach documents, such as for unit 1 designs, use PDF, PNG or JPG formats. You can attach files using the 'Embed content' link in the editor.

QUICK COURSE LINKS:  Add blog post - Read latest group postsFAQs: Course process : Site design : HTML : CSS : JavaScript : JQuery : AJAX : MiscPodcasts for each unit

Updated resource pages:  Unit 1 - Unit 2  - Unit 3Units 4 & 5 - Unit 6 - Unit 7

Unit 5 - JavaScript & Learning Diary (Design)

  • Public
By Zahid Mirza in the group COMP 266 November 9, 2023 - 8:02pm

Athabasca_Flow_Add.drawio (2).pngAthabasca_Flow_Remove.drawio (2).png

There are two flow diagrams here: one for adding values to a data structure, and another is for removing values from a data structure. 

For the design:

Variables: Variable Name -> Description -> Scope

  • data_struct -> Data Structure -> Global variable (note: for dictionaries the data_struct will be of type dictionary. For Linked Lists the data_struct will be of type Node. For Binary Trees and BSTs the data_struct will be of type TreeNode. For Heap it'll be of type Heap. For all other data structures they can be represented using JavaScript arrays)
  • element_to_add -> Element To Add to Data Structure ->  Private to addElementToDataStructure()
  • element_to_remove -> Element to Remove from Data Structure -> Private to removeElementFromDataStructure()

Functions: Function Name -> Description -> When is this function executed

  • addElementToDataStructure() -> Adds element to data_struct-> Executed when the "Add to Data Structure" button is clicked
  • removeElementFromDataStructure() -> Removes element from data_struct -> Executed when the "Remove from Data Structure" button is clicked
  • receiveElementFromTextbox() -> Receives element from textbox and checks if the value is of the right data type -> Called in addElementToDataStructure() and removeElementFromDataStructure()
  • dataStructIsFull() -> Checks if data_struct is full -> Called in addElementToDataStructure()
  • generateVisualRepresentationOfDataStructure() -> Generates visual representation of data structure -> Called in addElementToDataStructure() and removeElementFromDataStructure()


  • Node (only used if the data structure is a linked list)
  • TreeNode (only used for Binary Trees and BSTs)
  • Heap (used for heaps)




These comments are moderated. Your comment will not be visible unless accepted by the content owner.

Only simple HTML formatting is allowed and any hyperlinks will be stripped away. If you need to include a URL then please simply type it so that users can copy and paste it if needed.