前端笔记之JavaScript03——函数

最新推荐文章于 2022-10-29 17:07:07 发布
最新推荐文章于 2022-10-29 17:07:07 发布
阅读量238 收藏
点赞数
分类专栏： js 前端笔记 文章标签： JavaScript笔记 函数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/XIYECODE/article/details/102837509
版权 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>作业3</title>
    <!--函数封装练习-->
    <script>
        /*
        函数封装 - 生成 n ~ m 的随机数

            题目描述：使用Math对象，获取指定范围随机整数

            函数名：randomInt(min, max)

            函数参数：

          参数名  参数类型   参数描述
          min     number    随机区间的最小值
          max     number    随机区间的最大值

            函数返回值：随机整数

            题目提示：随机数用 Math.random()

            例：调用函数 randomInt(1,5)，返回结果为 1 ~ 5 之间的一个随机整数。
        */
        function randomInt(min, max){
            //同时为负值时，返回-1表示错误
            if (min < 0 && max < 0){
                return -1;
            }
            //保证max为最大值
            if (max < min){
                var temp = max;
                max = min;
                min = temp;
            }
            //获取min~max区间值
            /*while(true){
                var rand_num = Math.floor(Math.random()*(max+1));
                if (rand_num >= min){
                    return rand_num;
                }
            }*/
            if (min < 0){
                min = 0;
            }
            return Math.floor(min + Math.floor(Math.random()*(max+1)));
        }
        console.log("-5~5的随机数", randomInt(-5, 5));
        /*
        函数封装 - rgb 随机颜色封装

            题目描述：使用Math对象，获取一个 rgb 的随机颜色

            函数名：randomRGBColor()

            函数参数：无需传参

            函数返回值：rgb 随机颜色字符串

            题目提示：rgb 颜色取值范围 0 ~ 255，随机数用 Math.random()

            例：调用函数 randomRGBColor()，返回结果为  “rgb(15,25,255)”
        */
        function randomRGBColor() {
            var r = Math.floor(Math.random()*266);
            var g = Math.floor(Math.random()*266);
            var b = Math.floor(Math.random()*266);

            return "rgb("+r+","+g+","+b+")";
        }
        console.log("rgb随机颜色", randomRGBColor());
        /*
        函数封装 - 16进制随机颜色

            题目描述：使用Math对象，获取一个16进制的随机颜色

            函数名：randomHexColor()

            函数参数：无需传参

            函数返回值：十六进制随机颜色字符串

            题目提示：16进制包括 “ 0  1  2  3  4  5  6  7  8  9  A  B  C  D  E  F ”

                例：调用函数 randomHexColor()，返回结果为 “#F23A4B”
         */
        function randomHexColor() {
            var num = ["0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F"];
            var hex = "#";
            //获取六位随机码
            for (var i=0; i < 6; i++){
                var index = Math.floor(Math.random()*16);
                hex += num[index];
            }

            return hex;
        }
        console.log("16进制随机颜色", randomHexColor());
        /*
        函数封装 - 日期格式化封装

            题目描述：使用 Date 对象，获取当前日期的格式化字符串

            函数名：formatDate()

            函数参数：无需传参

            函数返回值：'yyyy-mm-dd' 日期格式字符串

            题目提示：new Date() 创建日期对象

            例：调用函数 formatDate()，返回结果为 “2019-08-24”
        */
        function formatDate() {
            var date = new Date();
            var year = date.getFullYear();
            var month = zero(date.getMonth() + 1);
            var day = zero(date.getDate());
            return year + "-" + month + "-" + day;
        }
        console.log("日期格式化", formatDate());
        /*
        函数封装 - 时间格式化封装

            题目描述：使用 Date 对象，获取当前时间的格式化字符串

            函数名：formatTime()

            函数参数：无需传参

            函数返回值：'HH-MM-SS' 时间格式字符串

            题目提示：new Date() 创建日期对象

            例：调用函数 formatTime()，返回结果为   “09:05:10”
        */
        function formatTime() {
            var date = new Date();
            var HH = zero(date.getHours());
            var MM = zero(date.getMinutes());
            var SS = zero(date.getSeconds());
            return HH+"-"+MM+"-"+SS;
        }
        console.log("时间格式化", formatTime());
        /*
        函数封装 - 小于 10 补 0

            题目描述：使用 if 分支判断，如果小于 10 的数补 0

            函数名：zero(num)

            函数参数：

              参数名  参数类型   参数描述
            num    number 数值型数据

            函数返回值：小于 10 返回 补 0 后的字符串，大于 10 返回原数据

            题目提示：if else 分支语句处理两种情况

            例： 调用函数  zero(5) 返回结果为  “05”   ，调用函数  zero(10) 返回结果还是 10
        */
        function zero(num) {
            if (!isNaN(num) && num < 10) {
                return "0"+num;
            }
            return num;
        }
        console.log("小于10补0", zero(9));
    </script>
    <!--非函数封装练习-->
    <script>
        /*1. 获取系统时间，根据获取的星期数据，在页面中输出"今天是星期几"，(如：今天是星期六）*/
        var date = new Date();
        var days = ["星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
        document.write("今天是"+days[date.getDay()]);
        /*2. 准备一个数组，存放组员名字，在调用函数的时候可以随机点名。*/
        var members = ["邓嘉明", "江玲玲", "卢杰安", "沈贵佑", "吴浩林", "吴锦业", "王荣生", "严杰雯", "周健锋", "卓毅青", "张志豪"];
        var index = Math.floor(Math.random()*members.length);
        console.log("点名点到",members[index]);
        /*3. 准备一个数组，翻转数组数据，如 [1,2,3,4] 翻转后变成 [4,3,2,1]。*/
        var data = [1,2,3,4];
        console.log("原数据", data);
        for (var i = 0; i < data.length/2; i++){
            var temp = data[i];
            data[i] = data[data.length-1-i];
            data[data.length-1-i] = temp;
        }
        console.log("翻转后数据", data);
        /*4. 准备一个数组，求数组中的最大值，如 [1,2,3,4] 的最大值为 4。*/
        var data1 = [1,2,3,4];
        var max = data1[0];
        for (var i = 1; i < data1.length; i++){
            if (data1[i] > max){
                max = data1[i];
            }
        }
        console.log("[1,2,3,4] 的最大值为", max);
        /*5. 准备一个数组，求数组中的最小值，如 [1,2,3,4] 的最小值为 1。*/
        var data2 = [1,2,3,4];
        var min = data2[0];
        for (var i = 1; i < data2.length; i++){
            if (data2[i] < min){
                min = data2[i];
            }
        }
        console.log("[1,2,3,4] 的最小值为", min);
    </script>
    <!--进阶作业-->
    <script>
        /*
        函数封装 - 数组冒泡排序

            题目描述：利用两层 for 循环，实现数组从小到大排序。
    
                函数名：arraySort(arr)
    
            函数参数：
    
              参数名  参数类型   参数描述
            arr    array  数组
    
            函数返回值：从小到大排序的数组
    
            题目提示：两层 for 循环，里层循环利用 if 分支比较大小，交换位置；外层循环让里层循环重复执行多次。
    
                例：调用函数  arraySort([5,2,3,1,4])  ，返回结果为  [1,2,3,4,5]
        */
        function arraySort(arr) {
            for (var i = 0; i < arr.length; i++){
                for (var j = i; j < arr.length; j++){
                    if (arr[i] > arr[j]) {
                        var temp = arr[i];
                        arr[i] = arr[j];
                        arr[j] = temp;
                    }
                }
            }
            return arr;
        }
        console.log("数组冒泡排序", arraySort([5,2,3,1,4]));
    </script>
</head>
<body>
</body>
</html>
协手共建美好家园
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
16进制的随机颜色
weixin_43750611的博客
09-06 1154
1、题目描述：使用Math对象，制作一个16进制的随机颜色 提示：16进制包括“0 1 2 3 4 5 6 7 8 9 A B C D E F” 如：‘#f657586’ //创建一个字符串 var col = '#'; //创建 16进制颜色的数组 var arr = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F']; for (var i = 0;
使用Math对象，制作一个16进制的随机颜色
weixin_43482295的博客
07-02 2252
使用两种初学者都能看懂的方式 1.调用两次Math函数 function getColor() { var str = '#'; for (var i = 0; i < 6; i++) { str += Math.floor(Math.random() * 16).toString(16); } return str; } var res
JavaScript:16进制随机颜色,题目描述：使用Math对象，制作一个16进制的随机颜色.
qq_47701723的博客
08-10 1955
var arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F']; function getColor() { var str = '#'; for (var i = 0; i < 6; i++) { function getRandom(min, max) { ...
通过Math.random实现产生随机的十六进制颜色代码！
qq_44777678的博客
05-05 1405
function getColor() { //定义十六进制前面#号符 var str = "#"; //定义十六进制单个码数组好进行遍历 var arr = ["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"] 通过for循环随机生成6个单码进行链接形...
1.3 16进制随机颜色，题目描述：使用Math对象，制作一个16进制的随机颜色题目提示：16进制包括 “ 0 1 2 3 4 5 6 7 8 9 A B C D E F ”例： “#f23a4
qq_57731353的博客
02-16 506
1.3 16进制随机颜色， 题目描述：使用Math对象，制作一个16进制的随机颜色 题目提示：16进制包括 “ 0 1 2 3 4 5 6 7 8 9 A B C D E F ” 例： “#f23a4b
前端学习之JavaScript（三）函数
sinat_41920065的博客
04-20 478
函数的三种定义方式 1.定义命名函数 2.定义匿名函数：匿名函数的可读性更好，做常用的方法 3.利用Function类匿名函数：可读性差 局部函数 在函数里使用var定义的变量称为局部变量，在函数外定义的变量和在函数内不使用var定义的变量则称为全局变量，如果局部变量和全局变量的变量名相同，则局部变量会覆盖全局变量。局部变量只能在函数里访问，全局变量可以在所有的函数里访问。 局部函数也在函数...
前端学习之JavaScript——函数
Jane_xxxxxy的博客
08-10 417
1. 函数的概念 在 JS 里面，可能会定义非常多的相同代码或者功能相似的代码，这些代码可能需要大量重复使用。 虽然 for循环语句也能实现一些简单的重复操作，但是比较具有局限性，此时我们就可以使用 JS 中的函数。 函数：就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复使用。 2. 函数的使用 函数在使用时分为两步：声明函数和调用函数。 2.1 声明函数 // 声明函数 function 函数名() { //函数体代码 } function 是声明函数的关键字,必须小
前端学习（四）——javascript学习笔记（二）函数
08-09
前端学习——javascript学习笔记（二）函数
狂神Java学习笔记————前端入门——html、css、JavaScript学习代码
06-17
【狂神Java学习笔记——前端入门——HTML、CSS、JavaScript学习代码】是针对初学者的一份详实的学习资料，这份笔记记录了跟随B站知名up主“遇见狂神说”的java系列视频中关于前端开发的基础内容。笔记内容不仅与视频...
JavaScript学习笔记（六）——函数
qq_56607109的博客
06-15 363
总共有三种函数定义的方式：函数声明语句、函数表达式、内置构造函数。 函数声明后不会立即执行，会在我们需要的时候调用到。小练习：定义一个求阶乘的函数。 2.函数表达式 以上函数实际上是一个 匿名函数 (函数没有名称)，函数存储于变量中，故通常不加函数名。当写递归函数时，也可加上函数名。定义一个表达式函数： 3.Function内置构造函数在以上实例中，我们了解到函数通过关键字 function 定义。函数同样可以通过内置的 JavaScript 函数构造器（Function()）定义。 这种方式不推荐，无法写
黑马程序员前端JavaScript高级——ES6学习笔记
最新发布
weixin_44566194的博客
10-29 2957
黑马程序员前端教程的PPT和代码学习笔记，里面包含了面向对象的编程思想，以及构造函数，类和对象、原型链、箭头函数、数组和字符串新增方法、函数递归、深拷贝浅拷贝、正则表达式等知识点。本文是对CSDN其他博主记录的一个补充，因为黑马也是今年才陆续补充一些知识点的视频的，本文将其收录于此，雷同勿怪。
JavaScript简餐——函数尾调用优化
igodmeetu的博客
12-05 304
文章目录前言二、尾调用优化的条件三、尾调用优化实例总结 前言 写本《JavaScript简餐》系列文章的目的是记录在阅读学习《JavaScript高级程序设计（第4版）》一书时出现的各个知识点。虽是对读书的笔记和总结，但是希望它轻量、简洁、犀利，不会引起阅读疲劳，可以在碎片化时间和闲暇之余轻巧地沐浴一下知识点。每篇文章只针对一个小部分进行讲解式的梳理，来达到个人复习总结和分享知识的目的。 # 一、认识尾调用优化 ECMAScript6规范新增了一项内存管理优化机制，让JavaScript引擎在满足条
Java数组练习之随机点名器
char_m的博客
03-18 5758
数组练习（随机点名器） 编写一个随机点名的程序，使其能够在全班同学中随机点中某一位同学的名字。点名器具备三个功能，储存全班同学姓名、总览全班同学姓名和随机点取其中一人姓名。 import java.util.Random; import java.util.Scanner; public class callName { public static void main(String[] a...
JS生成16进制随机颜色
每天一个前端小知识~
08-19 2210
问题： 16进制随机颜色 题目描述：使用Math对象，制作一个16进制的随机颜色 题目提示：16进制包括 “ 0 1 2 3 4 5 6 7 8 9 A B C D E F ” 代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>随机颜色</title> <style type="text/css">
JavaScript内置对象Math产生一个16进制的随机颜色值
weixin_30951231的博客
07-18 386
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> div { width: 300px; height: 300px; ...
使用Math对象方法，制作一个16进制的随机颜色，例如 # C4FA56
qq_40739261的博客
04-07 908
// 题目描述：使用Math对象，制作一个16进制的随机颜色 // ​ 题目提示：16进制包括 “ 0 1 2 3 4 5 6 7 8 9 A B C D E F ” // ​ 例： “#f23a4b” // 分析： 制作随机16进制颜色，需要随机获取 6 个16进制数， var arr = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D.
js的基础笔记5:js的内置对象(字符串、日期、数组、Math)
小黄呀呀呀的博客
09-17 451
1 - 内置对象 1.1 内置对象 ​ JavaScript 中的对象分为3种：自定义对象 、内置对象、 浏览器对象 ​ 前面两种对象是JS 基础 内容，属于 ECMAScript； 第三个浏览器对象属于 JS 独有的， JS API 讲解内置对象就是指 JS 语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要的功能（属性和方法），内置对象最大的优点就是帮助我们快速开发 ​ JavaScript 提供了多个内置对象：Math、 Date 、Array、String等 1
随机生成十六进制的颜色值
dsgjava的博客
08-26 738
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script&g.
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值