目录
一、轻松小练习
1.简单计算器
2.判断两数之间的最大值
3.判断三个数之间的最大值
4.判断用户输入的值是否为素数
5.求一个数组中所有元素为基础的的平均值
6.写一个函数使用数学对象输出一个100以内的5的倍数。
7.写一个函数,实现翻转任意数组
8.写一个函数,实现对数字数组的排序
9.写一个函数,实现任意个数的最大值
10.写一个函数,实现判断闰年
11.写一个函数,实现判断某年2月份的天数
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 1.简单计算器
do {
var x = prompt('开始计算咯输入数字1进入, 数字2退出 ')
if (x == 1) {
function calcuLator(num1, num2, char) {
var m = 0;
switch (char) {
case '+':
m = alert('两数之和等于' + (num1 + num2));
break;
case '-':
m = alert('两数之差等于' + (num1 - num2));
break;
case '*':
m = alert('两数之积等于' + (num1 * num2));
break;
case '/':
m = alert('两数相除等于' + (num1 / num2));
break;
default:
alert('您的输入有误');
break;
}
return m;
}
calcuLator(parseInt(prompt('请输入第一个数')), parseInt(prompt('请输入第二个数')), prompt('请输入符号'));
}
} while (x != 2);
// 2.判断两数之间最大值
function numMax(num1, num2) {
return num1 > num2 ? num1 : num2;
}
var max = numMax(prompt('请输入第一个数'), prompt('请输入第二个数'));
alert(max);
// 3.判断三个数之间的最大值
function numMax3(num1, num2, num3) {
var max = num1;
if (max < num2) {
max = num2;
}
if (max < num3) {
max = num3;
}
return max;
}
var max = numMax3(prompt('请输入第一个数'), prompt('请输入第二个数'), prompt('请输入第三个数'));
alert(max);
// 4.判断用户输入的一个数是否为素数
do {
function primeNum(num) {
var m = 0;
for (i = 1; i <= num; i++) {
if (parseInt(num % i) == 0) {
m++;
}
}
if (m == 2) {
return num + '素数';
} else {
return num + '不是素数';
}
}
var Prime = primeNum(prompt('请输入一个数'));
alert(Prime);
} while (parseInt(prompt('是否继续\n输入任意非0整数继续\n否则退出\n')))
//5.求一个数组中所有元素为奇数的平均值
function odd(arr) {
var sum = 0;
var od = 0;
for (i = 0; i < arr.length; i++) {
if (arr[i] % 2 == 0) {
continue;
} else {
sum++;
od += arr[i];
}
}
return od / sum;
}
var average = odd([1, 2, 3, 4, 5, 6]);
document.write('数组中奇数的平均值为' + average);
// 6.写一个函数使用数学对象输出一个100以内的5的倍数。
function five(num) {
for (var i = 1; i <= num; i++) {
if (i % 5 == 0) {
document.write(i + ',');
}
}
}
five(prompt('请输入一个多少以内的数用于被5整除'));
// 7.写一个函数,实现翻转任意数组
// 方法一:调用数组的方法
function reverse(arr) {
if (arr instanceof Array) {
return arr.reverse(); //这里不想看见逗号可以在其后加.join('')去除
} else {
alert('您输入的不是数组,请输入格式:[1,2,3,4]');
}
}
document.write(reverse([1, 2, 3, 4]));
// 方法二:自定函数封装
function reverse(arr1) {
if (arr1 instanceof Array) { //判断接收到的arr1是否为数组
var newarr = [] //定义空数组,默认值为0
for (i = arr1.length; i >= 0; i--) {
// newarr[newarr.length]= arr[i];//老方法不用数组的方法
newarr.push(arr1[i]); //使用数组的方法插入
}
return newarr + '<br>';
} else {
return '你输入的不是数组、数组格式[1,2,3]<br>';
}
}
document.write(reverse([5, 4, 3, 2, 1, 'c', 'b', 'a']));
document.write(reverse(1, 2, 3) + '<br>');
// 8.写一个函数,实现对数字数组的排序
function num(arr) {
return arr.sort(function(a, b) {
return a - b;
})
}
document.write(num([3, 2, 1]) + '<br>')
// 9.写一个函数,实现任意个数的最大值
// 方法一:调用数学方法
function Max() {
return Math.max(1, 2, 3, 4, 5, 9);
}
document.write(Max() + '<br>');
// 方法二:遍历老配方
function arrayMax(arr) {
var max = arr[0];
for (i = 1; i < arr.length; i++) {
if (max < arr[i])
max = arr[i];
}
return max;
}
var result = arrayMax([77, 8, 6666, 75, 999]);
document.write(result + '<br>');
// 10.写一个函数,实现判断闰年
function year(num) {
if (num % 400 == 0 || num % 4 == 0 && num % 100 !== 0) {
return '闰年'
} else {
return '平年'
}
}
document.write(year(prompt('请输入年份')) + '<br>');
// 11.写一个函数,实现判断某年2月份的天数
function month(year) {
if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
return '闰年:2月有29天'
} else {
return '平年:2月有28天'
}
}
document.write(month(prompt('请输入年份')) + '<br>');
</script>
</body>
</html>
二、进阶练习
案例一:提示用户输入一个数组长度,填充数组中的值,直到满足长度,最终将用户输入值组成的数组排序,并返回
案例二:编写函数实现穿件x行y列的表格输出到页面,xy值由用户输入
案例三:编写函数实现判定某个数字是不是素数(无限循环,双方法)
案例四:编写函数实现去除任意数组中重复的值
案例五:编写函数实现交换连个变量的值,并将交换的结果返回【四种方法,无限循环】
案例六:编写函数实现删除数组中用户指定的数值,没有指定数值给出提示
案例七:统计字符串中出现次数最多的字符是哪个,出现了几次
案例八:去除abcdeereeryhhssqqq中的重复字符
案例九:编写函数判定字符串是不是回文,例如‘上海自来水来自海上’
案例十:翻转字符串
案例十一:编写函数删除字符串中的数字
案例一:提示用户输入一个数组长度,填充数组中的值,直到满足长度,最终将用户输入值组成的数组排序,并返回
运行结果:
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
function arrlen(len) { //形参接收用户输入的数组总长度
var arr = []; //定义数组接收输入的数字
while (arr.length < len) { //while循环判断数组长度是否小于用户的长度,小于执行,大于等于则跳出
var num = prompt('请您再次输入数值,以填充整个数组')
if (isNaN(num)) { //使用isNaN函数判断输入的字符是否为数字,不是则提示,跳出本次循环
alert('您的输入有误,请您重新输入数值,以填充整个数组')
} else {
arr.push(num); //是的话就将当前数字插入数组里
}
}
return arr.sort(function(a, b) { //使用数组的sort方法实现从小到大排序
return a - b;
});
}
document.write(arrlen(prompt('请您输入数组的总长度谢谢'))); //接收用户输入的数组长度
</script>
</body>
</html>
案例二:编写函数实现穿件x行y列的表格输出到页面,xy值由用户输入
运行结果:输入2行,3列
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.box {
text-align: center;
}
</style>
</head>
<body>
<script>
function Table(x, y) {
document.write("<table border='1' cellspacing='0'>"); //设置表格开始,表格格式
for (var i = 0; i < x; i++) { //循环总行
document.write("<tr height='50px'>"); //设置行开始及行格式
for (var j = 0; j < y; j++) { //循环总列
document.write("<td width='100px'; style='text-align: center';>划水王</td>"); //设置列开始列格式列内容列结束
}
document.write("</tr>"); //设置行结束
}
document.write("</table>"); //设置表格结束
}
Table(prompt('请输入表格行数') * 1, prompt('请输入表格列数') * 1) //用户输入表格行列
</script>
</body>
</html>
案例三:编写函数实现判定某个数字是不是素数(无限循环,双方法)
运行结果:
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 方案一:只能被1和本身整除法(使用前记得注释方案二哦)
function isPrime(num) {
if (isNaN(num)) {
return "您的输入不是数字!"
} else {
var m = 0;
for (var i = 0; i <= num; i++) {
if (num % i == 0) {
m++;
}
}
return m == 2 ? num + "是素数" : num + "不是素数";
}
}
function isCircle() { //无限循环用户输入
var x = 1;
while (x) {
alert(isPrime(prompt('请输入一个数字')));
if (x == prompt('1继续其他退出')) {
continue;
} else {
break;
}
}
}
isCircle();
// 方案二: flag判断
function isPrime(num) {
if (isNaN(num)) {
// alert("您的输入不是数字!");
return "您的输入不是数字!";
} else {
if (num == 1) {
flag = false;
return '不是素数';
}
for (var i = 2; i < num; i++) { //这里是忽略1和本身以及其他数,只判断用户输入的数字里面从2开始到本身-1
if (num % i == 0) {
flag = false;
}
}
return flag ? '素数' : '不是素数';
}
}
function isCircle() { //不是素数则跳出循环
flag = true;
while (flag) {
alert(isPrime(prompt('请输入一个数字')));
}
}
isCircle();
</script>
</body>
</html>
案例四:编写函数实现去除任意数组中重复的值
运行结果:
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
function arrDelete(arr) {
var newArr = [];
for (var i = 0; i < arr.length; i++)
if (newArr.indexOf(arr[i]) == -1) {
newArr.push(arr[i]);
}
return newArr;
}
document.write(arrDelete([1, 7, 4, 8, 4, 6, 4]));
</script>
</body>
</html>
案例五:编写函数实现交换连个变量的值,并将交换的结果返回【四种方法,无限循环】
运行结果:输入2,3
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 记得使用每一种方法的时候注释其他方法 -->
<script>
// 方案一:第三变量数组a,b转换(思维定式)
function exChange(a, b) {
var arr = [];
var temp = a;
a = b;
b = temp;
arr.push('第一个数变成' + a);
arr.push('第二个数变成' + b);
return arr;
}
function isCircle() {
var x = 1;
while (x) {
alert(exChange(prompt('请输入第一个数'), prompt('请输入第二个数')));
if (x == prompt('1继续其他退出')) {
continue;
} else {
break;
}
}
}
isCircle();
// 方案二:数组方法置换
function exChange(arr) {
arr.reverse(); //翻转数组
return arr;
}
function isCircle() {
var x = 1;
while (x) {
alert(exChange([prompt('请输入第一个数'), prompt('请输入第二个数')]));
if (x == prompt('1继续其他退出')) {
continue;
} else {
break;
}
}
}
isCircle();
// 方案三:对象置换法
function Exchange(a, b) { //构造函数创建对象无需return返回,默认在定义的时候被new返回,思路是将用户输入第一个数字传给属性名b,第二个数字传给属性名为a;
this.a = b;
this.b = a;
}
function isCircle() {
var x = 1;
while (x) {
var obj = new Exchange(prompt('请输入第一个数'), prompt('请输入第二个数'));
alert('第一个数变成' + obj.a + '第二个数变成' + obj.b); //这里一定要给之前的对象赋给一个变量,利用变量输出
if (x == prompt('1继续其他退出')) {
continue;
} else {
break;
}
}
}
isCircle();
// 方案四: 数组特殊置换法
function exChange(a, b) {
a = [b, b = a][0]; //这里利用[]强制将输入的值转换为数组,假设a=6,b=9则有a=[9,b=a][0];a[0]=9;a=[9,b=6][0];b=6;
return [a, b];
}
function isCircle() {
var x = 1;
while (x) {
alert(exChange(prompt('请输入第一个数'), prompt('请输入第二个数')));
if (x == prompt('1继续其他退出')) {
continue;
} else {
break;
}
}
}
isCircle();
</script>
</body>
</html>
案例六:编写函数实现删除数组中用户指定的数值,没有指定数值给出提示
运行结果:自定义数组[1, 3, 5, 3, 7, 9, 2, 4, 6, 8, 10],当用户输入2为以下结果
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
function Num() {
while (1) {
var arr = [1, 3, 5, 3, 7, 9, 2, 4, 6, 8, 10];
var num = prompt('请输入一个值') * 1;
if (isNaN(num)) { //判断不是数字就弹出,跳出本次循环继续循环,否则执行下个条件
alert('你输入的数值不是数字');
continue;
} else if (arr.indexOf(num) == -1) { //判断不在数组内,就弹出提示,跳出本次循环继续循环,否则执行下个条件
alert('您输入的不在数组里请重新输入一个值');
continue;
} else {
for (var i = 0; i < arr.length; i++) {
if (arr.indexOf(num) != -1) { //如果不等于-1能够找到对应索引值,用splice函数删除
arr.splice(arr.indexOf(num), 1); //每次找到用户输入的值删除当前位置的值
}
}
}
return arr; //一定要写在while循环里面
}
}
document.write(Num());
</script>
</body>
</html>
案例七:统计字符串中出现次数最多的字符是哪个,出现了几次
运行结果:输入字符串"abcdeereeryhhssqqq"
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 1.统计字符串中出现次数最多的字符是哪个,出现了几次 str = "abcdeereeryhhssqqq" -->
<script>
function showTime(str) {
var o = {};
for (var i = 0; i < str.length; i++) {
var chars = str[i];
if (o[chars]) {
o[chars]++;
} else {
o[chars] = 1;
}
}
console.log(o);
var max = 0;
var ch = '';
for (var k in o) {
if (max < o[k]) {
max = o[k];
ch = k;
}
}
return '最大值' + ch + '最大次数' + max;
}
document.write(showTime("abcdeereeryhhssqqq"));
</script>
</body>
</html>
案例八:去除abcdeereeryhhssqqq中的重复字符
运行结果:
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 去除"abcdeereeryhhssqqq"中的重复字符 -->
<script>
function delRepeat(str) {
var newstr = [];
for (var i = 0; i < str.length; i++) {
if (newstr.indexOf(str[i]) == -1) {
newstr.push(str[i]);
}
}
return newstr.join('');
}
document.write(delRepeat("abcdeereeryhhssqqq"));
</script>
</body>
</html>
案例九:编写函数判定字符串是不是回文,例如‘上海自来水来自海上’
运行结果:
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 3.编写函数判定字符串是不是回文 , 回文示例:上海自来水来自海上 -->
<!-- 方案一 -->
<script>
function isHuiWen(arr) {
var arr2 = arr.split('').reverse().join('');
return arr2 === arr ? '是回文' : '不是回文';
}
document.write(isHuiWen(prompt('请您输入一串字符串')));
</script>
<!-- 方案二 -->
<script>
function reverseString(str) {
for (var i = 0; i < Math.floor(str.length / 2); i++) {
if (str[i] !== str[str.length - i - 1]) {
return '不是回文';
}
}
return '是回文';
}
alert(reverseString(prompt('用户输入一个字符串')));
</script>
</body>
</html>
案例十:翻转字符串
运行结果:
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 翻转字符串 -->
<script>
function reverseString(arr) {
return arr.split('').reverse().join(''); //字符串转数组,可用方法翻转数组,数组转字符串,去掉逗号
}
document.write(reverseString(prompt('用户输入一个字符串')));
</script>
</body>
</html>
案例十一:编写函数删除字符串中的数字
运行结果:
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 编写函数删除字符串中的数字 -->
<!-- 方案一:狸猫换太子 -->
<script>
function numDelete(arr) {
var newArr = [];
for (var i = 0; i < arr.length; i++) {
if (isNaN(arr[i])) {
newArr.push(arr[i]);
}
}
return newArr.join('');
}
document.write(numDelete(prompt('用户输入一个字符串')));
</script>
<!-- 方案二:偷天换日 -->
<script>
function numDelete(arr) {
for (var i = 0; i < arr.length; i++) {
if (!isNaN(arr[i])) {
arr = arr.replace(arr[i], ''); //每次最开始判断值是否存在,存在则删除
i--; //将每次删除后的数字指标索引值指回当前第一个数
}
}
return arr;
}
document.write(numDelete(prompt('用户输入一个字符串')));
</script>
</body>
</html>