Explore the logic. Run the code. Investigate the results.

How does an algorithm work—and how does its logic become executable code? What happens when the input changes? Why is one data structure a better choice than another?

This interactive book helps students explore these questions by connecting explanations, visual algorithms, JavaScript implementations, and computational experiments.

The DRAKON visual language makes the flow of an algorithm explicit and easier to follow. Together with the JavaScript code generated from the diagrams, it provides a bridge between understanding an algorithm and examining its implementation.

The book covers fundamental data structures and algorithms, including sorting, searching, trees, and graphs. You can work through the explanations, follow the diagrams, study the code, and then launch experiments directly from the relevant sections.

Take an active role in learning:

The experiments provide a starting point for your own investigations. What changes when the input is already sorted? How does the order of insertion affect a tree? Which properties of a graph matter for the problem you want to solve?

The book also develops the engineering judgment needed to choose data structures and algorithms. Beyond theoretical complexity, it considers the frequency of operations, memory organization, computing resources, and the constraints of the execution environment.

Designed primarily for students studying Data Structures and Algorithms, this book invites you to connect visual reasoning with executable programs—and build understanding through experimentation.

Choose a topic, launch an experiment, and begin exploring.

SECTION 1 reveals the meaning of the main concepts in the discipline Data Structures and Algorithms: data, data type, abstract data types, algorithms. A high level of competence in the development of efficient algorithms is necessary for every programmer, not only when solving practical problems related to the use of IT technologies. Knowledge in the field of data structure and algorithms is the most important component in an interview when applying for a job in a large IT company.

SECTION 2 describes the basics of the JavaScript programming language in sufficient amount for acquaintance and practical mastery of knowledge and skills in the field of data structure and algorithms. Of course, basic concepts and a certain level of programming are assumed for reading this chapter.

SECTION 3 gives a brief description of the visual language DRAKON, which allows for the representation of complex algorithms in the form of a DRAKON-diagram using icons, corresponding to the basic constructions of the JavaScript language. The technology of automated transformation of the DRAKON-diagram into the program code is given in the editor DrakonTech, with subsequent implementation in the shell of Visual Studio Code. Actually, this is a hybrid, two-stage approach: in the first step a DRAKON-diagram is made, the icons of which are filled with constructions of the language JavaScript, on the second step - automatically generated software code, implemented in any software environment

SECTION 4 presents JavaScript language constructs that implement the basic abstract data types described in Section 1: array, slice, list etc. Explanations are given regarding the use of appropriate JavaScript language constructs.

SECTION 5 provides basic insights into the analysis of algorithm complexity and the evaluation and effectiveness of algorithms from the perspective of computer memory (space) and time costs. Theoretical ideas about estimating the complexity of algorithms are decisive when choosing the most effective one.

SECTION 6 deals with basic sorting algorithms. Each algorithm is represented by a corresponding DRAKON-diagram, accompanied by necessary explanations about the processing process and estimation of complexity.

SECTION 7 discusses basic algorithms for searching elements in different data structures (slices, lists). In addition, the section includes a description and DRAKON-diagram of hash algorithms that significantly reduce search time by reducing the number of element value comparisons.

SECTION 8 provides conceptual information about binary trees – nonlinear data structures, including binary search trees and self-balancing trees. This section describes the basic DRAKON-diagrams of algorithms for inserting new ones, finding nodes with specified values and deleting nodes.

SECTION 9 provides basic information about the most complex data structures – graphs. Basic concepts of graph theory and their basic types are given. Algorithms of representation of graphs, their traversal, choice of path between vertices are considered.

SECTION 10 brings together the preceding material through an engineering approach to selecting data structures and algorithms. It presents a five-step selection procedure that connects application requirements and operation profiles with the capabilities and limitations of candidate structures. It then examines how data is represented in computer memory, explaining the practical significance of memory hierarchy, cache behavior, and data locality, with attention to JavaScript. The section helps readers assess the resources available to them and understand why theoretical complexity alone is insufficient to predict practical performance.