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>
作业:
1- 判断时间阶段
-
题目描述:
用户输入几点弹出问候信息;
如用户输入12点中午好;
用户输入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}$/ -
个性签名:独学而无友,则孤陋而寡闻。做一个灵魂有趣的人!
如果觉得这篇文章对你有小小的帮助的话,记得在右下角点个“推荐”哦,博主在此感谢!
Java入门到入坟
万水千山总是情,打赏一分行不行,所以如果你心情还比较高兴,也是可以扫码打赏博主,哈哈哈(っ•̀ω•́)っ✎⁾⁾!
浙公网安备 33010602011771号