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 轻松支持函数重载 (Part 1 - 设计)
Aug 04 Javascript
父子窗体间传递JSON格式的数据的代码
Dec 25 Javascript
浅谈JavaScript中Date(日期对象),Math对象
Feb 05 Javascript
js传值后台中文出现乱码的解决方法
Jun 30 Javascript
jQuery+HTML5+CSS3制作支持响应式布局时间轴插件
Aug 10 Javascript
jquery插件锦集【推荐】
Dec 16 Javascript
jQuery自定义插件详解及实例代码
Dec 29 Javascript
React Router基础使用
Jan 17 Javascript
JavaScript实现星星等级评价功能
Mar 22 Javascript
jQuery实现的粘性滚动导航栏效果实例【附源码下载】
Oct 19 jQuery
nestjs返回给前端数据格式的封装实现
Feb 22 Javascript
详解Vue.js 可拖放文本框组件的使用
Mar 03 Vue.js
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上传图片进行等比缩放可增加水印功能
2014/01/13 PHP
js将json格式内容转换成对象的方法
2013/11/01 Javascript
js实现单行文本向上滚动效果实例代码
2013/11/28 Javascript
JS 操作Array数组的方法及属性实例解析
2014/01/08 Javascript
每天一篇javascript学习小结(String对象)
2015/11/18 Javascript
JavaScript、jQuery与Ajax的关系
2016/01/24 Javascript
jQuery EasyUi实战教程之布局篇
2016/01/26 Javascript
jQuery使用$.each遍历json数组的简单实现方法
2016/04/18 Javascript
jQuery插件 Jqplot图表实例
2016/06/18 Javascript
jQuery获取浏览器类型和版本号的方法
2016/07/05 Javascript
js判断radiobuttonlist的选中值显示/隐藏其它模块的实现方法
2016/08/25 Javascript
canvas滤镜效果实现代码
2017/02/06 Javascript
详解本地Node.js服务器作为api服务器的解决办法
2017/02/28 Javascript
微信小程序 后台登录(非微信账号)实例详解
2017/03/31 Javascript
深入浅析AngularJS中的一次性数据绑定 (bindonce)
2017/05/11 Javascript
JavaScript 上传文件(psd,压缩包等),图片,视频的实现方法
2017/06/19 Javascript
详解jQuery中的isPlainObject()使用方法
2018/02/27 jQuery
微信小程序实现弹出层效果
2020/05/26 Javascript
bootstrap 日期控件 datepicker被弹出框dialog覆盖的解决办法
2019/07/09 Javascript
vue实现文件上传读取及下载功能
2020/11/17 Javascript
JavaScript实现简单的计算器
2020/01/16 Javascript
vue 实现click同时传入事件对象和自定义参数
2021/01/29 Vue.js
Python版微信红包分配算法
2015/05/04 Python
Python提取网页中超链接的方法
2016/09/18 Python
TensorFlow实现简单的CNN的方法
2019/07/18 Python
Python面向对象之继承原理与用法案例分析
2019/12/31 Python
Python中itertools的用法详解
2020/02/07 Python
基于tf.shape(tensor)和tensor.shape()的区别说明
2020/06/30 Python
Scrapy实现模拟登录的示例代码
2021/02/21 Python
表单button的outline在firefox浏览器下的问题
2012/12/24 HTML / CSS
2014年幼儿园重阳节活动方案
2014/09/16 职场文书
收款授权委托书
2014/10/02 职场文书
机关作风建设剖析材料
2014/10/11 职场文书
公司总经理岗位职责
2015/04/01 职场文书
2015年大学团支部工作总结
2015/05/13 职场文书
无违反计划生育证明格式
2015/06/24 职场文书