Use JS to implement those data structures 15 (Figure 01)

In fact, in the previous introduction of the tree structure, there have been some of the relevant content of the algorithm involved. In this data structure, there will be more algorithms for graphs, such as breadth-first search, depth-first search shortest path algorithm, and so on. This is the last data structure we are going to introduce. It is also one of the most complex in this series. So let's start with a brief introduction, what is a graph?

First, the concept of the graph

Simply put, the graph is an abstract model of the network structure, which is a set of nodes (or vertices) connected by edges . Any binary relationship can be represented by a graph. such as our map, subway line map, etc. are practical applications of graphs.

Then we look at some of the relevant concepts and terminology of the graph.

A figure G = (v,e) consists of the following elements:

V: A set of vertices.

E: A set of edges that links the vertices in V.

Before we go on, let's take a picture and continue our view.

See, let's explain some of the concepts.

1. Vertices connected by one edge are called adjacent vertices. For example, A and B,a and C,a and D are all adjacent, but a and e are not contiguous.

2, the degree of a vertex depends on the number of its neighboring vertices. That is, how many vertices are connected to each other, and how much is it in degrees? For example, the degree of a is 3,d is 4.

3, the path is vertex v1,v2 ..... A continuous sequence of vn, where VI and vi+1 are adjacent. For example, the Acdg,abei is a path.

4. Simple path requirements do not include duplicate fixed points. For example, ADG is a simple path.

5. To remove the last vertex (because it is the same as the first vertex), the ring is also a simple path, such as ADCA.

6, if the diagram does not exist ring. Then the graph is non-ring .

7. If there is a path between each of the two vertices in the graph, the graph is connected .

For the sake of comparison, I took another picture.

It's almost the same as the first picture, except we put something on the path.

8, the figure can be directed (side has direction) or is non -directional (side no direction). For example, if we add a direction on the edge, we become a directed graph.

9, if there is a path between each of the two vertices in the diagram, the graph is strongly connected. For example, we can say that C and D are strongly connected. A and B are not strongly connected. But not a strong connectivity graph. Because not every two points have a bidirectional path.

10, the figure can also be either not weighted or weighted . The number added on the edge is the weighted value. (The weighted meaning can be simply understood as the weight in the CSS selector.) ）

Second, the representation method of the graph

There are a lot of ways we can represent graphs. Depending on the type of problem we want to solve and the type of diagram. We can choose different methods to represent the graph. Here we will briefly describe two ways to represent a diagram.

1, adjacency matrix. Each node is associated with an integer that is indexed as an array. We use a two-dimensional array to represent the connection between each vertex. For example, the node with index I and the node with index j is adjacent, it is represented as arrya[i][j]=1. otherwise arrya[i][j]=0.

　　

The adjacency matrix looks like this. Note that the adjacency matrix above simply indicates whether the two vertices are contiguous. We also need an array to store all the vertices.

However, there are some performance issues with the adjacency matrix. For example, we will use a lot of space to represent some non-existent edges. Like all the 0. For example, we want to find the vertices of a vertex, even if the a vertex has only one adjacent vertex. We also have to traverse the entire array to find it.

　　2, adjacency table, in view of the above problems. The graph we use in this article is represented by the adjacency table. The adjacency table is made up of the list of adjacent vertices for each vertex in the diagram. We can use arrays, lists, maps or HashMap to implement adjacency tables.

The adjacency table looks like this.

So we know some of the basic concepts of graphs and the representations of the graphs we want to use. Let's finish the shelves of our graph class first.

function Map () {//... Various other methods, see the previous dictionary section}//code is very simple, but still want to explain.    The function Graph () {//vertices array holds all the vertices in our graph var vertices = []; Adjlist Store our adjacency table.    Adjlist uses vertices as keys, adjacency vertex list as value var adjlist = new Map ();    The method for adding vertices.        This.addvertices = function (v) {//stored in the vertex array vertices.push (v);    Generate a map that does not have a list of adjacency vertices, because at this point we have vertices, so we want to generate the Adjlist.set (v,[]) to be used. }//Here's a little detail we need to be aware of, oh yes, this is the way to add edges to the diagram.    Note that, in fact, in the code, we do not have a thing (a variable or anything else) to represent the edge. We add an edge between two vertices and actually just add each other to the adjacency table for the two vertices.    This means that the two vertices are adjacent.        This.addedge = function (v,w) {//The graph we are implementing here is an graph, so we need to add each of the adjacency tables corresponding to the two vertices.        And if there is a directed graph, just need to add one according to the direction you can.        Adjlist.get (v). push (W);    Adjlist.get (W). push (v);    }//In order to facilitate observation, we can then implement a ToString method//Nothing to say, a double loop traversal of two arrays.        this.tostring = function () {var s = ""; for (var i = 0;i < www.baohuayule.net www.taohuayuan178.com vertices.length;i++) {s + = Vertices[i] + "-"            ;            var neighbors = Adjlist.get (Vertices[i]); For (var j = 0; www.120xh.cn J www.baohuayule.com < Neighbors.length; J + +) {s + = Neighbors[jwww.feifanyu            Le.cn] + ';        } s + = ' \ n ';    } return s; }}//let's try var graph = new Graph (www.255055.cn/), var verticesarray = [' A ', ' B ', ' C ', ' D ', ' E ', ' F ', ' G ', ' H ', ' I '];for (var I = 0; i < verticesarray.length; i++) {graph.addvertices (verticesarray[i]);} Graph.addedge (' A ', ' B '); Graph.addedge (' A ', ' C '); Graph.addedge (' A ', ' d '); Graph.addedge (' C ', ' d '); Graph.addedge (' C '), ' G '); Graph.addedge (' d ', ' G '); Graph.addedge (' d ', ' H '); Graph.addedge (' B ', ' E '); Graph.addedge (' B ', ' F '); Graph.addedge (' E ', ' I '); Console.log (graph.tostring ());/*a->b C D b->a E F c->a D G d->a C g H e->b I F-&gt ; B g->c D h->d i->e */

So we've implemented the simplest part of the graph class--how to add vertices and edges. Will everyone feel a little bit simpler. Hey..... The fun is still in the back, don't worry ...

Well, then here's the end of this article. In the next article, we will continue to learn the traversal of graphs.

Use JS to implement those data structures 15 (Figure 01)

Use JS to implement those data structures 15 (Figure 01)