您的位置：首页 > Web前端 > JavaScript

js数组循环的一种算法

2017-10-23 10:17 447 查看

数组循环的一种算法

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<title>数组循环算法</title>
<link rel="stylesheet" href="./bootsrap.3.3.7.css">
<style>
.btn-group {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
}
</style>
</head>

<body>
<!--    <div class="btn-group" role="group" aria-label="...">
<button type="button" class="btn btn-default" onclick="clickMe('prev');">prev</button>
<button type="button" class="btn btn-default" onclick="clickMe('next');">next</button>
</div> -->
<div class="btn-group" role="group" aria-label="...">
<button type="button" class="btn btn-default" onclick="clickMeTrandition('prev');">prev</button>
<button type="button" class="btn btn-default" onclick="clickMeTrandition('next');">next</button>
</div>
<script>
// 数组循环 两种方法
var arr = [0, 1, 2, 3, 4, 5],
index = 0;

//1. 传统方式
function clickMeTrandition (param) {
if (param === 'next')
index ++;
else if (param === 'prev')
index --;

if (index >= arr.length)
index = 0;
else if (index < 0)
index = arr.length-1;

console.log("arr",arr[index]);
}

//2. 另一种方式: 可以少一个判断
function clickMe(param) {
if (param === "next")
index = (index + 1) % arr.length;
else if (param === "prev")
index = (index - 1 + arr.length) % arr.length;

console.log("arr", arr[index]);
}
</script>
</body>

</html>

总结

传统方式较于新的方式会多出一判断，理解上去会简单些。新的方式代码更加简洁。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： javascript

相关文章推荐

新的分享

章节导航