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 相关文章推荐
动态表格Table类的实现
Aug 26 Javascript
jQuery中的.bind()、.live()和.delegate()之间区别分析
Jun 08 Javascript
jquery 中多条件选择器,相对选择器,层次选择器的区别
Jul 03 Javascript
jquery获取焦点和失去焦点事件代码
Apr 21 Javascript
javascript实现类似超链接的效果
Dec 26 Javascript
jquery实现标签支持图文排列带上下箭头按钮的选项卡
Mar 14 Javascript
css如何让浮动元素水平居中
Aug 07 Javascript
JS组件系列之Bootstrap table表格组件神器【终结篇】
May 10 Javascript
JS实现求数组起始项到终止项之和的方法【基于数组扩展函数】
Jun 13 Javascript
jQuery 开发之EasyUI 添加数据的实例
Sep 26 jQuery
QQ跳转支付宝并自动领红包脚本(最新)
Jun 22 Javascript
JS去除字符串最后的逗号实例分析【四种方法】
Jun 20 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
用PHP伪造referer突破网盘禁止外连的代码
2008/06/15 PHP
使用YUI+Ant 实现JS CSS压缩
2014/09/02 PHP
php短网址和数字之间相互转换的方法
2015/03/13 PHP
javascript offsetX与layerX区别
2010/03/12 Javascript
JQuery自适应IFrame高度(支持嵌套 兼容IE,ff,safafi,chrome)
2011/03/28 Javascript
document.addEventListener使用介绍
2014/03/07 Javascript
jquery中map函数与each函数的区别实例介绍
2014/06/23 Javascript
javascript删除数组重复元素的方法汇总
2015/06/24 Javascript
jquery实现点击变换导航样式的方法
2015/08/31 Javascript
javascript实现tab切换的四种方法
2015/11/05 Javascript
JavaScript学习笔记之数组的增、删、改、查
2016/03/23 Javascript
AngularJS深入探讨scope,继承结构,事件系统和生命周期
2016/11/02 Javascript
JavaScript实现翻页功能(附效果图)
2017/02/16 Javascript
Vue render深入开发讲解
2018/04/13 Javascript
谈谈React中的Render Props模式
2018/12/06 Javascript
js定义类的方法示例【ES5与ES6】
2019/07/30 Javascript
Vue学习笔记之计算属性与侦听器用法
2019/12/07 Javascript
python获取Linux下文件版本信息、公司名和产品名的方法
2014/10/05 Python
一文总结学习Python的14张思维导图
2017/10/17 Python
python生成以及打开json、csv和txt文件的实例
2018/11/16 Python
简单易懂Pytorch实战实例VGG深度网络
2019/08/27 Python
python GUI库图形界面开发之PyQt5窗口类QMainWindow详细使用方法
2020/02/26 Python
Python修改列表值问题解决方案
2020/03/06 Python
Python脚本调试工具安装过程
2021/01/11 Python
CSS3 毛玻璃效果
2019/08/14 HTML / CSS
七夕相亲活动策划方案
2014/08/31 职场文书
同意迁入证明模板
2014/10/26 职场文书
2014年财务经理工作总结
2014/12/08 职场文书
2015年学校医务室工作总结
2015/07/20 职场文书
教师个人工作总结范文2015
2015/10/14 职场文书
机关单位2016年法制宣传日活动总结
2016/04/01 职场文书
Python趣味挑战之给幼儿园弟弟生成1000道算术题
2021/05/28 Python
MySQL系列之六 用户与授权
2021/07/02 MySQL
springboot集成springCloud中gateway时启动报错的解决
2021/07/16 Java/Android
Vue鼠标滚轮滚动切换路由效果的实现方法
2021/08/04 Vue.js
德生TECSUN S-2000使用手册文字版
2022/05/10 无线电