JavaScript 图
TypeScript方式实现源码
// 图的遍历算法
// 算 法 数据结构 描 述
// 深度优先搜索 栈 通过将顶点存入栈中,顶点是沿着路径被探索的,存在新的相
// 邻顶点就去访问
// 广度优先搜索 队列 通过将顶点存入队列中,最先入队列的顶点先被探索
// 当要标注已经访问过的顶点时,我们用三种颜色来反映它们的状态。
// 白色:表示该顶点还没有被访问。
// 灰色:表示该顶点被访问过,但并未被探索过。
// 黑色:表示该顶点被访问过且被完全探索过。
// 广度优先搜索算法会从指定的第一个顶点开始遍历图, 先访问其所有的相邻点, 就像一次访
// 问图的一层
class Graph {
vertices = [];
adjList = new Dictionary();
public addVertex(v) {
this.vertices.push(v);
this.adjList.set(v, []);
}
public addEdge(v, w) {
this.adjList.get(v).push(w);
this.adjList.get(w).push(v);
}
public initializeColor() {
let color = [], length = this.vertices.length;
for (var i = ; i < length; i++) {
color[this.vertices[i]] = 'white';
}
return color;
}
/**
* 宽度优先搜索
* @param v
* @param callback
*/
public bfs(v, callback) {
let color = this.initializeColor(),
queue = new Queue();
queue.enqueue(v);
while (!queue.isEmpty()) {
let u = queue.dequeue(),
neighbors = this.adjList.get(u);
color[u] = 'grey';
for (let i = ; i < neighbors.length; i++) {
let w = neighbors[i];
if (color[w] === 'white') {
color[w] = 'grey';
queue.enqueue(w);
}
}
color[u] = 'black';
if (callback) {
callback(u);
}
}
}
/**
* 寻找最短路径
* @param v
*/
public BFS(v) {
let color = this.initializeColor(),
queue = new Queue(),
d = [],
pred = [];
queue.enqueue(v);
for (var i = ; i < this.vertices.length; i++) {
d[this.vertices[i]] = ;
pred[this.vertices[i]] = null;
}
while (!queue.isEmpty()) {
let u = queue.dequeue(),
neighbors = this.adjList.get(u);
color[u] = 'grey';
for (let i = ; i < neighbors.length; i++) {
let w = neighbors[i];
if (color[w] === 'white') {
color[w] = 'grey';
d[w] = d[u] + ;
pred[w] = u;
queue.enqueue(w);
}
}
color[u] = 'black';
}
return {
distances: d,
predecessors: pred
}
}
public toString() {
let s = '';
for (let i = ; i < this.vertices.length; i++) {
s += this.vertices[i] + ' -> ';
let neighbors = this.adjList.get(this.vertices[i]);
for (var j = ; j < neighbors.length; j++) {
s += neighbors[j] + ' ';
}
s += '\n';
}
return s;
}
}
var graph = new Graph();
var myVertices = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I']; //{7}
for (var i = ; i < myVertices.length; i++) { //{8}
graph.addVertex(myVertices[i]);
}
graph.addEdge('A', 'B'); //{9}
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());
function printNode(value) {
console.log('Visited vertex:' + value);
}
graph.bfs(myVertices[], printNode);
var shortestPathA = graph.BFS(myVertices[]);
console.log(shortestPathA);
JavaScript方式实现源码
var Graph = (function () {
function Graph() {
this.vertices = [];
this.adjList = new Dictionary();
}
Graph.prototype.addVertex = function (v) {
this.vertices.push(v);
this.adjList.set(v, []);
};
Graph.prototype.addEdge = function (v, w) {
this.adjList.get(v).push(w);
this.adjList.get(w).push(v);
};
Graph.prototype.initializeColor = function () {
var color = [], length = this.vertices.length;
for (var i = ; i < length; i++) {
color[this.vertices[i]] = 'white';
}
return color;
};
/**
* 宽度优先搜索
* @param v
* @param callback
*/
Graph.prototype.bfs = function (v, callback) {
var color = this.initializeColor(), queue = new Queue();
queue.enqueue(v);
while (!queue.isEmpty()) {
var u = queue.dequeue(), neighbors = this.adjList.get(u);
color[u] = 'grey';
for (var i_1 = ; i_1 < neighbors.length; i_1++) {
var w = neighbors[i_1];
if (color[w] === 'white') {
color[w] = 'grey';
queue.enqueue(w);
}
}
color[u] = 'black';
if (callback) {
callback(u);
}
}
};
/**
* 寻找最短路径
* @param v
*/
Graph.prototype.BFS = function (v) {
var color = this.initializeColor(), queue = new Queue(), d = [], pred = [];
queue.enqueue(v);
for (var i = ; i < this.vertices.length; i++) {
d[this.vertices[i]] = ;
pred[this.vertices[i]] = null;
}
while (!queue.isEmpty()) {
var u = queue.dequeue(), neighbors = this.adjList.get(u);
color[u] = 'grey';
for (var i_2 = ; i_2 < neighbors.length; i_2++) {
var w = neighbors[i_2];
if (color[w] === 'white') {
color[w] = 'grey';
d[w] = d[u] + ;
pred[w] = u;
queue.enqueue(w);
}
}
color[u] = 'black';
}
return {
distances: d,
predecessors: pred
};
};
Graph.prototype.toString = function () {
var s = '';
for (var i_3 = ; i_3 < this.vertices.length; i_3++) {
s += this.vertices[i_3] + ' -> ';
var neighbors = this.adjList.get(this.vertices[i_3]);
for (var j = ; j < neighbors.length; j++) {
s += neighbors[j] + ' ';
}
s += '\n';
}
return s;
};
return Graph;
}());
JavaScript 图的更多相关文章
- 使用JavaScript在项目前台开发的58种常用小技巧
oncontextmenu="return false" :禁止右键 onselectstart="return false" : 禁止选取 onpaste = ...
- javascript实现prim算法
<script type="text/javascript"> //图的构建 function vnode() { this.visited = 0; this.ver ...
- ASP.NET MVC 5 学习教程:添加验证
原文 ASP.NET MVC 5 学习教程:添加验证 起飞网 ASP.NET MVC 5 学习教程目录: 添加控制器 添加视图 修改视图和布局页 控制器传递数据给视图 添加模型 创建连接字符串 通过控 ...
- js原型链的说明
首先需要明确的是:只有对象有__proto__属性,而函数只有prototype属性,没有__proto__属性,函数的原型有一个constructor属性,指向的是函数本身! Function是Ob ...
- Javascript的原型链图
90%的前端或者js程序员或者老师们对Javascript懂得不比这个多 给手机看的 但是这个图里的所有褐色单向箭头链就是Javascript的原型链(颜色标注对理解js原型链很关键) 这图中的各个_ ...
- 深入理解javascript作用域系列第五篇——一张图理解执行环境和作用域
× 目录 [1]图示 [2]概念 [3]说明[4]总结 前面的话 对于执行环境(execution context)和作用域(scope)并不容易区分,甚至很多人认为它们就是一回事,只是高程和犀牛书关 ...
- 跟着9张思维导图学习Javascript
学习的道路就是要不断的总结归纳,好记性不如烂笔头,so,下面将 po 出我收集的 9 张 javascript 相关的思维导图(非原创). 思维导图小tips: 思维导图又叫心智图,是表达发射性思维的 ...
- 【原】十张javascript思维导图
下面附上十张javascript思维导图,如果把里面的内容全部掌握,那就是高手了.思维导图提供给我们一个整体的知识体系,也可以说是一种工具,废话不多说,上图: 1.javascript数据类型 2.j ...
- 一张图轻松搞懂javascript event对象的clientX,offsetX,screenX,pageX区别
总是会被javascript的event对象的clientX,offsetX,screenX,pageX 弄得头晕,于是决定做个图来区分一下(画得我手那个酸呀....) 先总结下区别: event.c ...
随机推荐
- [Scala] 安装及环境配置(图文)
Window 上安装配置 1.Java(JDK)环境配置,详见 Java(JDK)环境 2.从 Scala 官网下载安装包:https://downloads.lightbend.com/scala/ ...
- DotNetCore跨平台~Json动态序列化属性
回到目录 Json动态序列化属性,主要为了解决一个大实体,在返回前端时根据需要去序列化,如果实体里的某个属性在任务情况下都不序列化,可以添加[JsonIgnore]特性,这种是全局的过滤,但是更多的情 ...
- Alpha第五天
Alpha第五天 听说 031502543 周龙荣(队长) 031502615 李家鹏 031502632 伍晨薇 031502637 张柽 031502639 郑秦 1.前言 任务分配是VV.ZQ. ...
- 201621123062《java程序设计》第九周作业总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 思维导图1:(对集合部分做了一些改动和细化) 思维导图2:(泛型) 1.2 选做:收集你认为有用的代码片段 代 ...
- Scapy实现SYN泛洪攻击
一.实验说明 1.实验介绍 本次实验将使用python3版本的Scapy--Scapy3k来实现一个简单的DDos,本次实验分为两节,本节将学习如何使用Scapy3k来实现SYN泛洪攻击. 2.知识点 ...
- 201621123031 《Java程序设计》第8周学习总结
作业08-集合 1.本周学习总结 以你喜欢的方式(思维导图或其他)归纳总结集合相关内容. 2.书面作业 1. ArrayList代码分析 1.1 解释ArrayList的contains源代码 源代码 ...
- 玩转Leveldb原理及源码--拙见1
可以说是不知天高地厚.. 可以说是班门弄斧.. 但是,我今天还就这样走了,我喜欢!!!!!! 注:后续文章,限于篇幅,不懂名词都有 紫色+下划线 超链接,有兴趣,可以查阅: 网上关于Leveldb 的 ...
- 技术文档分享_linux中生成考核用的GPT分区表结构修复
注:历史版本,后期改用python实现了 实验一: 目的:用于生成大量模拟破坏GPT分区结构案例,并生成唯一方式修复后的评判方法.故障:在一个完整的GPT分区磁盘上,丢失了GPT主分区表,或备份分区表 ...
- SAN LUN Mapping出错导致文件系统共享冲突,数据恢复成功
[用户单位] 中国联通某分公司[数据恢复故障描述] SUN 光纤存储系统,中心存储为6枚300G硬盘组成的RAID6,划分为若干LUN,MAP到不同业务的服务器上,服务器上运行SUN SOLAR ...
- 织梦cms/dedecms清理冗余废弃未引用图片方法
原理描述: 在原有织梦后台菜单中增加"清理冗余图片按钮",实现清理冗余图片的功能. 操作步骤: 1. 打开后台dede\sys_sql_query.php代码 在该文件中搜索如下代 ...