前端开发:JS中关于八皇后算法的使用

news2024/11/17 0:02:27

前言

在前端开发过程中,关于算法的使用也是非常常见的操作,尤其是处理一些复杂的业务场景,还有就是前端获取到后端返回的复杂结构的数据,所以说前端开发中处处都有算法使用的场景。开发者从接触编程开发开始,就与算法脱不了干系了,算法又和数学分不开,总归到底还是对逻辑思维和数学计算知识的使用。但是大部分开发者没有去深度的针对算法领域去深入,而且有时候太深奥的算法也不常用,往往就忽略了。但是作为程序开发人员,无算法无编程,经典的算法还是要掌握的,本篇博文就来分享一下关于八皇后算法在前端领域的运用,记录一下,方便后期查阅使用。

什么是八皇后问题?

诞生:八皇后问题(Eight queens),是由国际象棋棋手马克斯·贝瑟尔于1848年提出的问题,是回溯算法的典型案例。

八皇后问题表述:在8×8格的国际象棋上摆放8个皇后,使其不能互相攻击,即任意两个皇后都不能处于同一行、同一列或同一斜线上,问有多少种摆法。

高斯认为有76种方案。1854年在柏林的象棋杂志上不同的作者发表了40种不同的解,后来有人用图论的方法解出92种结果。如果经过±90度、±180度旋转,和对角线对称变换的摆法看成一类,共有42类。

八皇后问题解题思路分析

第一个皇后先放在第一行第一列;

第二个皇后放在第二行第一列,然后判断是否0K,如果不OK, 继续放在第二列、第三列,依次把所有列都放完,直到找到一个合适的为止;

第三个皇后,以此尝试放在第一列、第二列…,直到第八个皇后也能放在一个互不冲突的位置,最后就算是找到了一个正确解。

当得到一个正确解时,在栈回退到上一个栈的时候,就会开始回溯,也就是将第一个皇后,放到第一列的所有正确解,全部得到;

然后回过头继续第一个皇后放第二列,后面的操作继续循环执行1、2、3的步骤即可。

解释说明:理论上应该创建一个二维数组来表示棋盘,但是实际上可以通过算法用一个一维数组即可解决问题。

如array[8]={0,4,6,1,7,5,2,3}表示一个正解,对应array的下标表示第几行,即第几个皇后,array[i]=val , val表示第i+1个皇后,放在第i+1行的第val+1列。

注意:使用这种方式的效率可能比较低,可以使用其他算法对其进行优化,如贪心算法。

JS解决八皇后问题

通过JS来实现解决八皇后问题的方法,具体代码如下所示。

//方法一

function queen(array, current) {

    if (current==array.length) { 

        console.log(array); 

        return; 

    }

    for (var i = 0; i < array.length; i++) {

        array[current] = i;

        var flag = true;

        for (var j = 0; j < current; j++) {

            var ab = i - array[j];

            if (array[j]==i||(ab>0?ab:-ab)==current-j) { 

                flag=false; 

                break

            };

        };

        if (flag) { 

            queen(array,current+1); 

        }

    };

};

queen([1,1,1,1,1,1,1,1],0);

运行效果如下所示:

 

//方法二

function eightQueen(){

var array=[];

var n=8; //8x8格子

function queen(row){//行

if(row>n){ //判断皇后数量

var result=array.map(item=>item.y)

console.log(result);

}

for(var i=1;i

if(row===1||count(row,i)){//首次循环进来的时候,第一个皇后的位置就是1,1

array[row-1]={x:row,y:i}//保存满足条件的皇后坐标

queen(row+1)

}

}

}

function count(e,f){

for(var a=1;a

if(f==array[a-1].y||Math.abs(e-array[a-1].x)==Math.abs(f-array[a-1].y))

return false;

}

return true;

}

queen(1)

}

//调用方法

eightQueen();

运行结果如下所示:

 结论:需要枚举所有的搜索路径,当发现不满足求解条件的时候,就回溯到上一步,这也是为什么八皇后算法属于回溯算法的典型案例。

最后

通过本文关于前端开发中使用JS关于八皇后算法使用的介绍,虽然在大部分实际开发中使用到上述示例的可能性不大,但是还是要掌握对应的知识点,尤其是在求职面试过程中会涉及到前端相关的算法知识使用,所以还是要学会掌握的,尤其是从事前端开发不久的开发者来说尤为重要,是一篇值得阅读的文章,且在实际开发中也是必用知识点,所以说这个知识点是必备的,重要性就不在赘述。欢迎关注,一起交流,共同进步。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/186504.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Java switch case语句详解

if…else 语句可以用来描述一个“二岔路口”&#xff0c;我们只能选择其中一条路来继续走&#xff0c;然而生活中经常会碰到“多岔路口”的情况。switch 语句提供了 if 语句的一个变通形式&#xff0c;可以从多个语句块中选择其中的一个执行。switch 语句格式switch 语句是 Jav…

44物体检测算法:R-CNN,SSD,YOLO【动手学深度学习v2】

44物体检测算法&#xff1a;R-CNN&#xff0c;SSD&#xff0c;YOLO【动手学深度学习v2】 深度学习学习笔记 学习视频&#xff1a;https://www.bilibili.com/video/BV1if4y147hS/?spm_id_from333.337.search-card.all.click&vd_source75dce036dc8244310435eaf03de4e330 目标…

使用Springboot 2.7+Websocket+js实现服务端消息实时推送

文章目录诉求相关技术相关步骤项目创建编写相关配置消息逻辑处理使用JavaScript实现Websocket的前端功能功能测试诉求 模拟服务端主动推送消息给客户端&#xff0c;同时展示客户端发送给客户端的消息以及服务端推送给客户的消息。 相关技术 Springboot(2.7.0)Websocketjavascr…

Elasticsearch7.8.0版本入门——JavaAPI操作(文档操作)

目录一、pom文件依赖二、创建实体对象类三、文档操作代码示例3.1、创建文档代码示例3.2、修改文档代码示例3.3、查询文档代码示例3.4、删除文档代码示例一、pom文件依赖 引入相关依赖 <!-- elasticsearch 依赖 --> <dependency><groupId>org.elasticsearch&l…

【Pytorch】自定义autograd函数,使用graphviz画出计算图

使用pytorch.autograd.Function构建一个自动求导层1. 手工设计一个线性运算层2. 使用pytorch.autograd.Function编码实现3. graphviz进行可视化1. 手工设计一个线性运算层 设输入为x\bold{x}x&#xff0c;参数为w\bold{w}w和b\bold{b}b&#xff0c;运算如下&#xff1a; yw⊙x…

Tips for Confluence Administrators: Part 3

上一篇Part 2中&#xff0c;我们谈到了Confluence的一些已知Bug&#xff0c;例如&#xff1a;从垃圾桶中恢复同名页面不应覆盖现有页面复制/粘贴表格单元格无法按预期工作无法复制表头嵌套表格无法调整大小请不要吝惜你的投票&#xff0c;这有助于提高Atlassian修复它们的优先级…

四、Maven详细教程

本教程相关资料&#xff1a;https://www.aliyundrive.com/s/wMiqbd4Zws6 Maven是专门用于管理和构建Java项目的工具&#xff0c;它的主要功能有&#xff1a; 提供了一套标准化的项目结构 提供了一套标准化的构建流程&#xff08;编译&#xff0c;测试&#xff0c;打包&#xf…

MacOs安装Redis并设置为开机、后台启动

前言 最近闲来无事&#xff0c;将自己的MBP系统重装里&#xff0c;导致里面原来安装的软件都需要重新安装&#xff0c;今天记录一下MacOs安装Redis并设置为开机启动、后台启动的步骤&#xff0c;安装过程略有波折&#xff0c;参考里几篇文章才搞定。 一、安装Redis 两种方式…

【JavaEE】线程池

目录 线程池概念 线程池优点 使用线程池 Executor接口&#xff1a; ThreadPoolExecutor类&#xff1a; 构造方法 Executors工厂类&#xff1a; 工厂方法 线程池中的常用方法 线程池的工作流程 线程池的状态 RUNNING SHUTDOWN STOP TIDYING TERMINATED 简单实现…

Android10 开机向导流程

最近在弄开机向导&#xff0c;网上查了查&#xff0c;基本都是参照系统的​​​​​​Provision应用来做的&#xff0c;而且还要将apk打包到系统目录下的pri-app目录下&#xff0c;打包到其他目录下不行&#xff0c;参照着做是没问题&#xff0c;但是好奇为什么要这么做&#x…

esp32连接阿里云物联网平台进行MQTT通信

前提&#xff1a;IDE是采用arduino IDE&#xff0c;arduino使用的库是pubsubclient 开发板可以使用esp32&#xff08;esp8266也是一样的&#xff09; 已经学会pubsubclient库的基本使用 使用pubsubclient 库连接阿里云物联网平台 const char* ssid "........"; c…

java ssm校园勤工俭学助学志愿者兼职系统 idea maven

本论文主要论述了如何使用JSP技术开发一个校园勤工俭学兼职系统&#xff0c;本系统将严格按照软件开发流程进行各个阶段的工作&#xff0c;采用B/S架构&#xff0c;面向对象编程思想进行项目开发。在引言中&#xff0c;作者将论述校园勤工俭学兼职系统的当前背景以及系统开发的…

使用CCProxy+Proxifier实现代理

目录1.使用场景2.什么是网络代理&#xff1f;3.CCProxy3.1 说明3.2 下载安装3.3 使用说明4.Proxifier4.1 说明4.2 下载安装4.3 使用说明4.4 Proxifier CPU占用率高问题解决1.使用场景 很多时候当我们访问某个网络&#xff08;例如&#xff1a;校园网、企业网&#xff09;&#…

射频识别技术|期末考试知识点|重点题目|第1讲_RFID

课堂笔记 1.RFID技术 标签(芯片、天线、封装) 读写器 中间件和系统软件 公共服务体系 2.IC&ID

使用原始命令编译打包部署springboot-demo项目

目录简介源文件介绍编译编译restful-common编译manual-springboot打包&部署&执行jar命令介绍不打包直接运行打普通jar包&#xff0c;通过java -jar运行打fat jar通过java -jar打war&#xff0c;通过部署至tomcat运行纯手工命令开发打包部署的缺点参考简介 本文将使用j…

CUDA编程笔记(7)

文章目录前言共享内存的合理使用数组归约计算使用全局内存的计算引入线程块中的同步函数使用共享内存计算静态共享内存使用动态共享内存性能比较避免共享内存的bank冲突使用共享内存进行数组转置bank概念性能比较总结前言 cuda共享内存的合理使用。 共享内存的合理使用 共享…

TF-A移植

1.对tf-a源码进行解压 $> tar xfz tf-a-stm32mp-2.2.r2-r0.tar.gz 2.打补丁 $> for p in ls -1 ../*.patch; do patch -p1 < $p; done 3.配置交叉编译工具链 将Makefile.sdk中EXTRA_OEMAKE修改为 EXTRA_OEMAKECROSS_COMPILEarm-linux-gnueabihf- 4.复制设备树…

linux 部署jmeter

一、linux 安装jdk Java Downloads | Oracle 二、 linux上传jmeter 2.1 上传jmeter jmeter 下载地址&#xff1a; Apache JMeter - Download Apache JMeter 注意&#xff1a; 我先在我本地调试脚本&#xff08;mac环境&#xff09;&#xff0c;调试完成后&#xff0c;再在…

前端首屏优化

一. 打包分析 在 package.json 中添加命令 “report”: “vue-cli-service build --report” 然后命令行执行 npm run report&#xff0c;就会在dist目录下生成一个 report.html 文件&#xff0c;右键浏览器中打开即可看到打包分析报告。 二. 路由懒加载 component: () >…

MacOS - steam 蒸汽平台安装教程,带你躲避高仿网站的陷阱

MacOS - steam 蒸汽平台安装教程 MacOS 其实也是可以安装 Steam 平台的&#xff0c;虽然 steam 上的大多游戏暂时都不支持 MacOS&#xff0c;但还是有一些游戏可以玩的&#xff0c;而且近几年支持 MacOS 的游戏也是越来越多了。另外现在高仿网站特别多&#xff0c;所以才有了这…