【小黑JavaScript入门系列之脑力训练三《三阶段函数练习合集》】

发布于:2023-01-04 ⋅ 阅读:(273) ⋅ 点赞:(0)

目录

一、轻松小练习

二、进阶练习


一、轻松小练习

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>

本文含有隐藏内容,请 开通VIP 后查看

网站公告

今日签到

点亮在社区的每一天
去签到