JavaScript定义及输出螺旋矩阵的方法详解


Posted in Javascript onDecember 01, 2017

本文实例讲述了JavaScript定义及输出螺旋矩阵的方法。分享给大家供大家参考,具体如下:

昨晚无意看到这样一个算法题目,然后就想着用js来实现。
昨晚草草写完后感觉代码很丑,很臭,于是今晚又花点时间重构了一下,感觉变得优雅了。

什么是螺旋矩阵

螺旋矩阵是指一个呈螺旋状的矩阵,它的数字由第一行开始到右边不断变大,向下变大,向左变大,向上变大,如此循环。

如图:

JavaScript定义及输出螺旋矩阵的方法详解

实现效果

JavaScript定义及输出螺旋矩阵的方法详解

实现代码

(function() {
  var map = (function() {
    function map(n) {
      this.map = [], this.row = 0, this.col = -1, this.dir = 0, this.n = n;
      // 建立个二维数组
      for (var i = 0; i < this.n; i++) { this.map.push([]); }
      // 定义移动的顺序为 右,下,左,上
      var order = [this.right, this.bottom, this.left, this.up];
      i = 0;
      do {
        // 能移动则更新数字,否则更改方向
        order[this.dir % 4].call(this) ? i++ : this.dir++;
        // 赋值
        this.map[this.row][this.col] = i;
      } while (i < n * n);
    }
    map.prototype = {
      print: function() { for (var i = 0; i < this.n; i++) { console.log(this.map[i].join(' ')) } },
      // 向该方向移动
      left: function() { return this.move(this.row, this.col - 1); },
      right: function() { return this.move(this.row, this.col + 1); },
      up: function() { return this.move(this.row - 1, this.col); },
      bottom: function() { return this.move(this.row + 1, this.col); },
      // 如果坐标在范围内,并且目标没有值,条件满足则更新坐标
      move: function(row, col) {
        return (0 <= row && row < this.n) && (0 <= col && col < this.n) && !this.map[row][col] && (this.row = row, this.col = col, true);
      },
    };
    return map;
  })();
  new map(6).print();
})();

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript正则表达式中参数g(全局)的作用
Nov 11 Javascript
jQuery 1.5最新版本的改进细节分析
Jan 19 Javascript
js页面跳转的常用方法整理
Oct 18 Javascript
最精简的JavaScript实现鼠标拖动效果的方法
May 11 Javascript
Jquery实现顶部弹出框特效
Aug 08 Javascript
关于JavaScript限制字数的输入框的那些事
Aug 14 Javascript
概述BootStrap中role=&quot;form&quot;及role作用角色
Dec 08 Javascript
详解自动生成博客目录案例
Dec 09 Javascript
EasyUI为Numberbox添加blur事件的方法
Mar 05 Javascript
Vue.directive自定义指令的使用详解
Mar 10 Javascript
jQuery zTree树插件动态加载实例代码
May 11 jQuery
JavaScript执行环境及作用域链实例分析
Aug 01 Javascript
react-navigation 如何判断用户是否登录跳转到登录页的方法
Dec 01 #Javascript
利用babel将es6语法转es5的简单示例
Dec 01 #Javascript
微信小程序实现鼠标拖动效果示例
Dec 01 #Javascript
原生JS实现ajax与ajax的跨域请求实例
Dec 01 #Javascript
浅谈angular4实际项目搭建总结
Dec 01 #Javascript
JS实现的ajax和同源策略(实例讲解)
Dec 01 #Javascript
微信小程序表单验证功能完整实例
Dec 01 #Javascript
You might like
海贼王:最美的悬赏令!
2020/03/02 日漫
php+mysqli数据库连接的两种方式
2015/01/28 PHP
WordPress中注册菜单与调用菜单的方法详解
2015/12/18 PHP
PHP数组生成XML格式数据的封装类实例
2016/11/10 PHP
JavaScript 事件属性绑定带参数的函数
2009/03/13 Javascript
js鼠标点击事件在各个浏览器中的写法及Event对象属性介绍
2013/01/24 Javascript
使用js实现雪花飘落效果
2013/08/26 Javascript
nodejs如何获取时间戳与时间差
2016/08/03 NodeJs
js防阻塞加载的实现方法
2016/09/09 Javascript
js初始化验证实例详解
2016/11/26 Javascript
vue拦截器Vue.http.interceptors.push使用详解
2017/04/22 Javascript
JS实现动态给标签控件添加事件的方法示例
2017/05/13 Javascript
js实现本地时间同步功能
2017/08/26 Javascript
Bootstrap Table 搜索框和查询功能
2017/11/30 Javascript
vue-cli中的babel配置文件.babelrc实例详解
2018/02/22 Javascript
详解Node 定时器
2018/02/26 Javascript
React降级配置及Ant Design配置详解
2018/12/27 Javascript
vue踩坑记录之数组定义和赋值问题
2019/03/20 Javascript
浅谈Vue组件单元测试究竟测试什么
2020/02/05 Javascript
Angular利用HTTP POST下载流文件的步骤记录
2020/07/26 Javascript
[56:20]LGD vs VP Supermajor 败者组决赛 BO3 第三场 6.10
2018/07/04 DOTA
浅谈Python中列表生成式和生成器的区别
2015/08/03 Python
Python爬取qq空间说说的实例代码
2018/08/17 Python
Python3 安装PyQt5及exe打包图文教程
2019/01/08 Python
python实现定时压缩指定文件夹发送邮件
2020/12/22 Python
Python实现迪杰斯特拉算法过程解析
2020/09/18 Python
python 生成器需注意的小问题
2020/09/29 Python
详解Selenium 元素定位和WebDriver常用方法
2020/12/04 Python
全球采购的街头服饰和帽子:Urban Excess
2020/10/28 全球购物
伊莱克斯(Electrolux)俄罗斯网上商店:瑞典家用电器品牌
2021/01/23 全球购物
空指针到底是什么
2012/08/07 面试题
西门豹教学反思
2014/02/04 职场文书
机电专业大学生职业规划书范文
2014/02/25 职场文书
夫妻房产协议书的格式
2014/10/11 职场文书
家长意见书
2015/06/04 职场文书
vue router 动态路由清除方式
2022/05/25 Vue.js