JavaScript 内置对象

内置对象：

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>内置对象</title>
    <script>
        /* Math   内置对象 */

        var pi = Math.PI; //圆周率。PI: 3.141592653589793
        console.log(Math);

        //向下取整
        var num = Math.floor(32.123);
        //向上取整
        var num2 = Math.ceil(32.123);
        //四舍五入
        var num3 = Math.round(34.234);
        //取绝对值
        var num1 = Math.abs(-1244);
        //取最大值:传入的是伪数组，argments
        var num4 = Math.max(1, 2, 3, 4, 5, 6);
        //随机[0,1]之间的数
        var ran = Math.random();



        /* Date时间的内置对象 */
        var date = new Date();//得到一个当前时间
        console.log(date);//Tue Sep 08 2020 08:36:35 GMT+0800 (中国标准时间)
        //得到指定的时间
        var date2 = new Date('20200-09-09');
        console.log(date2);//Mon Sep 08 20200 00:00:00 GMT+0800 (中国标准时间)
        var date3 = new Date('20200/9/08');
        console.info(date3);//Mon Sep 08 20200 00:00:00 GMT+0800 (中国标准时间)

        //获取年:
        console.info(date.getFullYear());
        //获取月份:0-11；所以使用还要加1
        console.info(date.getMonth() + 1);
        //获取天数
        console.info(date.getDate());
        //获取星期
        console.info(date.getDay());//0-6 0标识星期天
        //获取小时
        console.info(date.getHours());
        //获取分钟
        console.info(date.getMinutes());
        //获取秒
        console.info(date.getSeconds());

        //获取时间戳1970-1-1起的毫秒数。。
        //1.原始获取方式
        console.log(date.valueOf())
        console.log(date.getTime())
        // 2. 简单写可以这么做
        var now1 = + new Date();
        // 3. HTML5中提供的方法，有兼容性问题
        var now2 = Date.now();

        //输入当前格式化好的日期
        //格式化时间
        function xingqi(date) {
            let xingqi = date.getDay();
            if (!(date instanceof Date)) {
                return '传递的不是时间';
            }
            switch (xingqi) {
                case 0: return '天';
                case 1: return '一';
                case 2: return '二';
                case 3: return '三';
                case 4: return '四';
                case 5: return '五';
                case 6: return '六';
            }
        }
        var strdate = `${date.getFullYear()}年${date.getMonth() + 1}月${date.getDate()}日    星期 ${xingqi(date)}`;
        alert(strdate);

        //倒计时:利用时间戳。。。。
        function dateTime() {


            var dateend = new Date('2020-09-08 9:18:00');
            var nowopen = Date.now();
            var time = dateend - nowopen;//时间戳之差
            time = parseInt(time / 1000);//得到秒数
            var d = parseInt(time / 60 / 60 / 24); // 计算天数

            var h = parseInt(time / 60 / 60 % 24) // 计算小时

            var m = parseInt(time / 60 % 60); // 计算分数

            var s = parseInt(time % 60); // 计算当前秒数
            console.log("倒计时：" + `${d}天数${h}小时${m}分钟${s}秒`);
            // setTimeout(dateTime(), 1000);
        }
        //
        dateTime();
        var arr = [1, 23];
        var obj = {};
        console.log(Array.isArray(arr));   // true
        console.log(Array.isArray(obj));   // false
        console.log(arr instanceof Array); // true
        console.log(obj instanceof Array); // false

        /* 数组对象的操作：Array */
        var arryes = [1, 23];
        //尾部插入与删除
        //尾部插入push
        var len = arryes.push(12, 34, 65, 76, 9);//返回数组长度
        console.log(`数组长度：${len}`);
        printArray(arryes);
        //尾部删除pop
        var ele = arryes.pop();
        console.log(`被删除的是：${ele}`);
        printArray(arryes);
        //头部插入 unshift
        len = arryes.unshift(-22, 231);
        console.log(`数组长度：${len}`);
        printArray(arryes);
        //头部删除
        ele = arryes.shift();
        console.log(`被删除的是：${ele}`);
        printArray(arryes);

        //数组排序
        arryes.sort();//转化为字符串：按照UTF-16排序。。。。不是我们想要的结果
        //所以需要定制排序
        arryes.sort(function (a, b) {
            return b - a;//a-b:小到大，b-a大到小。
        });
        //js的lambda表达式：箭头函数
        arryes.sort((a, b) => b - a);

        printArray(arryes);
        //数组反转
        arryes.reverse();
        printArray(arryes);


        //查找字符串子串:也可以对数组使用
        var strs = "ailucSdgeuavcuilluehicljoixcnaewivnlgicrhexnwcbuzsvgnhceoj";
        var index = strs.indexOf('c');//返回子串下标
        console.log(index);
        //从后往前查找
        var index = strs.lastIndexOf('c');//返回子串下标
        console.log(index);
        //js也可以使用流的操作
        //forEach(callbackfn: (value: number, index: number, array: number[]) => void, thisArg?: any): void
        //arryes.forEach((value,index,array)=>console.log(value,index));//遍历
        arryes.forEach((value) => console.log(value));//遍历
        //filter(callbackfn: (value: number, index: number, array: number[]) => value is number, thisArg?: any): number[]
        //会返回一个数组
        var filter = arryes.filter(value => value > 50);
        console.log(filter);
        //(key: any): boolean
        arryes.includes(65)//查看数组是否包含某个数。。。返回Boolean值
        //迭代器遍历
        var iterator = arryes.values();
        for(var value of iterator){
            console.log(value);
        }
        //数组自带的转化为字符串toString()
        //join方法如果不传入参数，则按照 “ , ”拼接元素

        //打印数组
        function printArray(array) {
            var str = '[';
            for (let index = 0; index < array.length; index++) {
                str += array[index] + ',';
            }
            console.log(str + "]");
        }


    </script>
</head>

<body>
    <div id="time">

    </div>

</body>

</html>

dom前言：

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>显示隐藏密码</title>
    <style>
        img {
            height: 2.5%;
            width: 2.5%;
        }

        div {
            text-align: center;
            margin: 100px auto;
        }
    </style>
</head>

<body>
    <div>
        <input type="password" name="" id="pwd"><span><img src="./lock.png" alt="" id="img" onclick="imgsss()" /></span>
    </div>
    <script>
        var img = document.getElementById('img');
        var inp = document.getElementsByTagName('input')[0];
        var x = 0;
        function imgsss() {
            if (x == 0) {
                img.src = "./unlock.png";
                inp.type = "text";
                x = 1;
            } else {
                img.src = "lock.png";
                inp.type = "password";
                x = 0;
            }
        }
    </script>
</body>

</html>

作业：

每日作业-JavaScript

1- 判断时间阶段

题目描述：

用户输入几点弹出问候信息；

如用户输入12点中午好；

用户输入18点弹出傍晚好；

用户输入23点弹出深夜好；

题目提示：

通过比较运算符判定输入的时间的范围，弹出相应的问候信息

  <script>
        var time = prompt("输入当前的时间：24小时制")
        var timenumber =parseInt(time)
        if(timenumber >=23 && timenumber<=24){
            alert("深夜好");
        }else if(timenumber>=18){
            alert("傍晚好");
        }else if(timenumber>12){
            alert("下午好");
        }else if(timenumber==12){
            alert("中午好");
        }else if(timenumber>=6){
            alert("早上好");
        }else{
            alert("半夜好");
        }

    </script>

2 - 比较两个数的最大值

题目描述：

用户依次输入2个值，最后弹出最大的那个值

题目提示：

通过比较运算符弹出最大值

 <script>
        var time = prompt("输入两个数：逗号隔开")
        var strarr = time.split(',');//将字符串转化为字符串的数组
        var arr = strarr.map(w => parseInt(w))//将字符串数组转化为number数组
        arr.sort((a, b) => a - b);//从小到大
        console.log(arr.toString())
        alert(arr.toString() + "中最大的是：" + arr[1]);

    </script>

3 - 判断奇偶性

题目描述：

用户输入一个数，判断是奇数还是偶数

题目提示：

通过%运算符可以得出数字的奇偶性

var time = prompt("输入一个数")
        var num = parseInt(time);
        if(num%2==0){
            alert("偶数")
        }else{
            alert('基数')
        }

4 - 判断星期

题目描述：

假设这个月1号是星期三，提示用户输入本月的日期（即1日-31日），返回用户输入的那一天是星期几

题目提示：

利用%和7取余，再判定是星期几

  var time = prompt("输入本月天数：1日-31日")
        var num = parseInt(time);
        //1号是星期三
        var ele = num % 7 ;
        alert(`今天是星期${xingqi(ele)}`)
         //星期
         function xingqi(ele) {
            switch (ele) {
                case 0+1: return '三';
                case 1+1: return '四';
                case 2+1: return '五';
                case 3+1: return '六';
                case 4+1: return '七';
                case 5+1: return '一';
                case 0: return '二';
            }
        }

5 - 请客吃饭

题目描述：

接收班长口袋里的钱数？

若大于等于2000，请大家吃西餐。

若小于2000，大于等于1500，请大家吃快餐。

若小于1500，大于等于1000，请大家喝饮料。

若小于1000，大于等于500，请大家吃棒棒糖。

否则提醒班长下次把钱带够

题目提示：

使用switch或者if else if 来进行逻辑书写

 var time = prompt("班长手里的钱：")
        var timenumber =parseInt(time)
        if(timenumber >=2000){
            alert("请大家吃西餐");
        }else if(timenumber>=1500){
            alert("请大家吃快餐");
        }else if(timenumber>1000){
            alert("请大家喝饮料");
        }else if(timenumber>=500){
            alert("请大家吃棒棒糖");
        }else{
            alert("班长下次把钱带够");
        }

6 - 成绩表

题目描述：

分数转换,给一个分数，判定等级。大于等于90 A，大于等于80小于90 B，大于等于70小于80 C ，大于等于60小于70 D，小于60 E

题目提示：

使用if else if 来进行逻辑书写，当使用if else if 时注意判定大小顺序

思考：是否可以使用switch完成本题目

var time = prompt("分数百分制：")
        var timenumber = parseInt(time)

        var num = Math.floor(timenumber / 10);
        var tag = '';
        switch (num) {
            case 10:
            case 9:
                tag = 'A';
                break;
            case 8: tag = 'B';
                break;
            case 7: tag = 'C';
                break;
            case 6: tag = 'D';
                break;
            default: tag = "E"
        }
        alert(`分数${timenumber}:级别：${tag}`);

7 求100以内所有能被3和7整除的数的和

题目描述：
- 把1-100之间所有能够被3和7同时整除的数找出来，计算累加和

题目提示：

在算入累加和之前，使用%判定遍历到的数字是不是可以被3和7整除

 var num = 0;
        var str = '';
        for (let index = 1; index <= 100; index++) {
            if (((index % 3) == 0) && ((index % 7) == 0)) {
                num += index;
                str += index + ",";
            }
        }
        console.log(`1-100之间的能被3和7同时整除的是：${str}`)
        console.log(`1-100之间的能被3和7同时整除的数之和：${num}`)

8 使用for循环打印三角形

题目描述：
- 在控制台一次性打印形状如下：
  
  ☆ ☆☆ ☆☆☆ ☆☆☆☆ ☆☆☆☆☆

题目提示：

利用双重for循环

 var temp ='';
        for (let i = 1; i <= 6; i++) {
            for (let j = 1; j < i ; j++) {
                temp +="*";
            }
            console.log(temp)
            temp ="";
        }

9 使用for循环打印99乘法表

题目描述：
- 使用for循环，打印99乘法表
- 在控制台打印具体效果如下：

题目提示：

利用双重for循环

 var temp = "";
        for (let i = 1; i <= 9; i++) {
            for (let j = 1; j <= i; j++) {
                temp += i + '*' + j + '=' + (j * i) + "\t"
                // console.log(i +'*'+j+'='+(j*i))
            }
            console.log(temp)
            temp = "";
        }

10 用户登录验证

题目描述：
- 接收用户输入的用户名和密码，若用户名为 “admin” ,且密码为 “123456” ,则提示用户登录成功! 否则，让用户一直输入。

题目提示：

利用while循环或者do while 循环

 var username = prompt("用户名：")
        var pwd = prompt("密码：");
        while ((username != 'admin') && (pwd != '123456')) {
            var username = prompt("用户名：")
            var pwd = prompt("密码：");
        }
        if ((username == 'admin') && (pwd == '123456'))
            alert("登陆成功")

11 求1-100之间个位数不为3的数的累加和。

题目描述：
- 求整数1～100的累加值，但要求跳过所有个位为3的数。

题目提示：

使用%判个位数是否为3
用continue实现

  var number =0;

        for (let index = 1; index <= 100; index++) {
            if(index % 10 ==3){
                continue;
            }
            number+=index;
         }
         alert(`1-100之间个位数不为3的和：${number}`)

12 简易ATM

题目描述：
- 里面现存有 100 块钱。
- 如果存钱，就用输入钱数加上先存的钱数, 之后弹出显示余额提示框
- 如果取钱，就减去取的钱数，之后弹出显示余额提示框
- 如果显示余额，就输出余额
- 如果退出，弹出退出信息提示框
  
  操作界面如下
题目提示：
- 通过输入的数值判断用户操作

 var saveMoneySum = 0;//最开始总存钱的金额为0
        var drawMoneySum = 0;//最开始总取钱的金额为0
        var yourMoney = 100;//最开始卡里就有100块钱
        do {
            var num = +prompt('输入您要的操作:\n1.存钱\n2.取钱\n3.显示余额\n4.退出');
            // 存钱
            if (num == 1) {
                var saveMoney = +prompt('请输入要存储的金额(元):');
                saveMoneySum = saveMoneySum + saveMoney;
                alert('您的余额为:' + (saveMoneySum - drawMoneySum + 100) + '元');
            }
            // 取钱
            else if (num == 2) {
                var drawMoney = +prompt('请输入要取出的金额(元):');
                if (drawMoney <= saveMoneySum - drawMoneySum) {
                    drawMoneySum = drawMoneySum + drawMoney;
                    alert('您的余额为:' + (saveMoneySum - drawMoneySum + 100) + '元');
                } else {
                    alert('账户余额不足!');
                }
            }
            // 显示余额
            else if (num == 3) {
                alert('您的余额为:' + (saveMoneySum - drawMoneySum + 100) + '元');
            }
            // 退出
            else if (num == 4) {
                continue;
            }
            else {
                alert('系统未识别操作!请重新输入!');
            }
        } while (num != 4);

13 求从1 开始第35个能被7和3整除的整数数

题目描述：
- 求从1开始第35个能被7和3整除的整数

题目提示：

通过变量记录是第几个可以被3和7整除的数

  var str = '';
        var index = 1;
        var tag = true;
        while (tag) {
            index++;
            if (((index % 3) == 0) && ((index % 7) == 0)) {
                str += index + ",";
            }
            var arr = str.split(',');
            if (arr.length >= 35+1) {
                tag = false;
            }
        }

14 简易计算器

题目描述：
- 用户在弹出的输入框中选择要做的运算
- 用户选择后弹出两个输入框，让用户输入数据
- 根据用户选择的操作和输入的数据，计算出最后结果并弹出提示框显示结果
- 操作界面如下：

题目提示：

用户通过在弹出的输入框输入操作对应的数值选择需要的计算
弹出另外两个输入框，收集用户输入的参与运算的数据
把计算结果通过提示框显示出来

 do {
            var num = +prompt('简易计算器:\n1.加法运算\n2.减法运算\n3.乘法运算\n4.除法运算\n5.退出\n请输入您的操作：');

            switch (num) {
                case 1:
                    let num1 = +prompt("第一个数:");
                    let num2 = +prompt("第二个数:");
                    let temp1 = parseInt(num1) + parseInt(num2);
                    alert(`${num1} + ${num2} = ${temp1}`)
                    break;
                case 2:
                    let num11 = +prompt("第一个数:");
                    let num22 = +prompt("第二个数:");
                    let temp11 = parseInt(num11) - parseInt(num22);
                    alert(`${num11} - ${num22} = ${temp11}`)
                    break;
                case 3:
                    let num111 = +prompt("第一个数:");
                    let num222= +prompt("第二个数:");
                    let temp111 = parseInt(num111) * parseInt(num222);
                    alert(`${num111} * ${num222} = ${temp111}`)
                    break;
                case 4:
                    let num112 = +prompt("第一个数:");
                    let num212 = +prompt("第二个数:");
                    let temp112 = parseInt(num112) / parseInt(num212);
                    alert(`${num112} / ${num212} = ${temp112}`)
                    break;
                default:
                    break;
            }
        } while (num != 5)

15 替换文本

题目描述

将字符串 'cqyzsC012QzAabcd'中的acq(忽略大小写)替换为'你好'

训练目标

正则的全局替换忽略大小写
训练提示

replace gi

16 邮箱提取

题目描述

将字符串'小明：大神么么哒，正好是我想要的，我的邮箱是xiaoming@qq.com小红：我老公最爱看这个了，我想给他一个惊喜，么么么哒，邮箱是xiaohong@sina.com我：好人一生平安，邮箱是wuyou@163.com'中所有的邮箱号码提取出来
训练目标

正则表达式的提取
训练提示
```
match方法
邮箱验证:/\w+@\w+\.\w+/
```

17 表单验证

训练目标

能够理解正则的匹配

训练提示

手机号验证:/^1[3|4|5|7|8][0-9]{9}$/
QQ号验证: /^[1-9]\d{4,}$/
昵称验证:/^[\u4e00-\u9fa5]{2,8}$/
密码验证:/^[a-zA-Z0-9_-]{6,16}$/

posted on 2020-09-09 08:55 白嫖老郭阅读(392) 评论(0) 编辑收藏举报

刷新页面返回顶部

登录后才能查看或发表评论，立即登录或者逛逛博客园首页

隔壁老郭的博客

JavaScript 内置对象

内置对象：

dom前言：

作业：

每日作业-JavaScript

1- 判断时间阶段

2 - 比较两个数的最大值

3 - 判断奇偶性

4 - 判断星期

5 - 请客吃饭

6 - 成绩表

7 求100以内所有能被3和7整除的数的和

8 使用for循环打印三角形

9 使用for循环打印99乘法表

10 用户登录验证

11 求1-100之间个位数不为3的数的累加和。

12 简易ATM

13 求从1 开始第35个能被7和3整除的整数数

14 简易计算器

15 替换文本

16 邮箱提取

17 表单验证

导航

公告

搜索

常用链接

我的标签

随笔分类

随笔档案

文章分类

阅读排行榜

评论排行榜

推荐排行榜

最新评论