1:Math对象
Math 对象用于执行数学任务。
Math 对象并不像 Date 和 String 那样是对象的类,因此没有构造函数 Math()。您无需创建它,通过把 Math 作为对象使用就可以调用其所有属性和方法。
2:Math属性
PI:返回圆周率(约等于3.14159)。
console.log( Math.PI ) ; // 3.141592653589793
3:Math方法
Math.round(3.6); // 四舍五入。
console.log(Math.round(6.49)); // 6
Math.random(); // 返回大于等于0到小于1之间的随机数。( 范围 [0,1) )
console.log(Math.random( ));
Math.max(a, b); // 返回较大的数值。
console.log(Math.max(6, 5, 7)); // 7
Math.min(a, b); // 返回较小的数值。
console.log(Math.min(6, 5, 7)); // 5
Math.abs(num); // 返回绝对值。
console.log(Math.abs(-6.1)); //6.1
Math.ceil(3.6); // 向上取整。
console.log(Math.ceil(6.1)); // 7
console.log(Math.ceil(-6.1)); //-6
Math.floor(3.6); // 向下取整。
console.log(Math.floor(-6.1)); // -7
Math.pow(x, y); // x的y次方。
console.log(Math.pow(2, 4)); //16
注:还有一种求x的y次方得方法: x ** Y
2**4 //16
Math.sqrt(num); // 开平方。
console.log(Math.sqrt(16)); //4
4:三角函数复习
Math.sin(x); // x的正弦值,返回值在-1到1之间。
Math.cos(x); // x的余弦值,返回值在-1到1之间。
注:需把角度转换成弧度,x指的是弧度,而非角度。
1弧度 = 180度
弧度计算公式:2 * Math.PI / 360 * 角度。(Math.PI /180 * 角度) ;
var degree = 60;
var arc = Math.PI / 180 * 60;
console.log(Math.sin(arc)); // 0.5000000000000001
console.log(Math.floor(Math.cos(arc) *10)/ 10); // 0.5 (解决了js的精度问题)
5:勾股定理复习
直角边a的平方 + 直角边b的平方 = 斜边c的平方
6:随机数如何设定范围
求0-100之间随机的整数
console.log(Math.random() * 100);
console.log(Math.round(Math.random() * 100)); //解决了精度问题
求0-99之间随机的整数
console.log(Math.floor(Math.random() * 100)); // 向下取整
求1-100之间随机的整数
console.log(Math.ceil(Math.random() * 100));
求100-1000之间的随机数
0-900的随机数+100
console.log( Math.round( Math.random() * 900 ) + 100 );
封装求两个数之间的随机数的函数
function random(x, y) {
return Math.round( Math.random() * (y - x) ) + x;
}
console.log(random(4, 10));
7:10进制转16进制或8进制
(1)10 转16
console.log((255).toString(16)); // ff
(2)10 转8
console.log((255).toString(8)); // 377
应用:
1:编写一个函数,获得一个十六进制的随机颜色的字符串(例如:#20CD4F)。
2:编写生成4位数字验证码的函数,并生成10次,同时将结果存入数组。
3: 随机点名程序:
var names = ['王妍', '赵奔', '张莉', '刘创', '张瑶', '陈杭英', '王序晨', '袁瑶'];
// 随机下标的范围:0 —— name.length - 1
var index = Math.round( Math.random() * (names.length - 1));
console.log(names[index]);
1:日期对象
定义:JS DATE使用UTC(国际协调时间)1970,1,1,0,0,0,0所经过的毫秒数。
在JS中日期也是它的内置对象,所以我们要对日期进行获取和操作,必须实例化对象。
2:创建日期对象
var date=new Date( ) ;
console.log(date); // 这一刻的时间
将会包含本地时间的信息,包括年月日时分秒 星期。
可以传入参数的格式(自定义日期对象):
“时:分:秒 月/日/年”、“月/日/年 时:分:秒”、“年/月/日”等字符串。
//(1)
var date = new Date('8:8:8 8/8/2008');
console.log(date); // Fri Aug 08 2008 08:08:08 GMT+0800 (中国标准时间)
//(2)
var date = new Date('8/8/2008 8:8:8');
console.log(date); // Fri Aug 08 2008 08:08:08 GMT+0800 (中国标准时间)
//(3)
var date = new Date('2008/8/8');
console.log(date); //Fri Aug 08 2008 00:00:00 GMT+0800 (中国标准时间)
年,月,日,时,分,秒。注意不能加“”。月是从0开始算的。
var date = new Date(2008, 7, 8, 8, 8, 8);
console.log(date); //Fri Aug 08 2008 08:08:08 GMT+0800 (中国标准时间)
时间戳 : 时间戳:从1970年1月1号8点0分0秒0毫秒到某一个时间点所经历的毫秒数。
var date = new Date(1522736028701 - 60 * 1000);
console.log(date);
3:日期对象获取信息的方法
注:月份和星期都是从0开始计算的。
周一 ~ 周六 (1 ~6) 周日(0)
getDate():从 Date 对象返回一个月中的某一天 (1 ~ 31)。
var date = new Date(1522736517796 - 48 * 60 * 60 * 1000);
console.log(date);
getMonth():从 Date 对象返回月份 (0 ~ 11)。
var date = new Date();
var month = date.getMonth();
console.log(month); //3
getFullYear():从 Date 对象以四位数字返回年份。
var date = new Date();
var year = date.getFullYear();
console.log(year); //2018
注:getYear():请使用 getFullYear() 方法代替。由 getYear() 返回的值不总是 4 位的数字!对于介于 1900 与 1999 之间的年份,getYear() 方法仅返回两位数字。对于 1900 之前或 1999 之后的年份,则返回 4 位数字!ECMAscript已经不再要求使用该函数
getDay():从 Date 对象返回一周中的某一天 (0 ~ 6)。 其中0代表星期日。
getHours():返回 Date 对象的小时 (0 ~ 23)。
var date = new Date();
var hours = date.getHours();
console.log(hours); // 17
getMinutes():返回 Date 对象的分钟 (0 ~ 59)。
var date = new Date();
var minutes = date.getMinutes();
console.log(minutes);
getSeconds():返回 Date 对象的秒数 (0 ~ 59)。
date = new Date();
var seconds = date.getSeconds();
console.log(seconds);
getMilliseconds():返回 Date 对象的毫秒(0 ~ 999)。
date = new Date();
var milli = date.getMilliseconds();
console.log(milli);
getTime():返回 1970 年 1 月 1 日至今的毫秒数。
date = new Date();
var time = date.getTime();
console.log(time);
4:日期对象设置信息的方法
setDate():设置 Date 对象中月的某一天 (1 ~ 31)。
var date = new Date();
date.setDate(9);
console.log(date); // Mon Apr 09 2018 17:38:26 GMT+0800 (中国标准时间)
setMonth():设置 Date 对象中月份 (0 ~ 11)。
var date = new Date();
date.setMonth(9);
console.log(date); //Wed Oct 03 2018 17:37:13 GMT+0800 (中国标准时间)
setFullYear():设置 Date 对象中的年份(四位数字)。
var date = new Date();
date.setFullYear(2017); //Mon Apr 03 2017 17:34:44 GMT+0800 (中国标准时间)
console.log(date);
setYear() 请使用 setFullYear() 方法代替。如果 year 参数是两位的数字,比如 setYear(91),则该方法会理解为 1991。如果要规定 1990 年之前或 1999 年之后的年份,请使用四位数字。 ECMAscript已经不再要求使用该函数。
setHours():设置 Date 对象中的小时 (0 ~ 23)。
var date = new Date();
date.setHours(18);
console.log(date); //Tue Apr 03 2018 18:40:09 GMT+0800 (中国标准时间)
setMinutes():设置 Date 对象中的分钟 (0 ~ 59)。
var date = new Date();
date.setMinutes(10);
console.log(date);
setSeconds():设置 Date 对象中的秒钟 (0 ~ 59)
var date = new Date();
date.setSeconds(10);
console.log(date);
setMilliseconds():设置 Date 对象中的毫秒 (0 ~ 999)。
var date = new Date();
date.setMilliseconds(999);
console.log(date);
setTime():以毫秒设置 Date 对象。
var date = new Date();
date.setTime(1522736517796);
console.log(date);
5:关于日期对象的常用操作
1:将日期格式化成字符串。(return yyyy-mm-dd hh:ii:ss)
function formatDateToString() {
var date = new Date();
var y = date.getFullYear();
var m = addPrefixZero(date.getMonth()+1);
var d = addPrefixZero(date.getDate());
var h = addPrefixZero(date.getHours());
var i = addPrefixZero(date.getMinutes());
var s = addPrefixZero(date.getSeconds());
return y + '-' + m + '-' + d +" " + h +':' + i +':' + s;
}
console.log(formatDateToString());
// 给时间添加前缀0
function addPrefixZero(num) {
if(num < 10) {
return '0' + num;
}else{
return num;
}
}
2:将指定格式字符串转化成日期。(eg:2018-01-01 12:23:46 ——Mon Jan 01 2018 12:23:46 GMT+0800 (中国标准时间))
function formatStringToDate(str) {
var arr =str.split(' '); //arr是:["2018-01-01", "12:23:46"]
var left = arr[0].split('-');
var right = arr[1].split(':');
//自定义日期,即给new Date传参数
var date = new Date(left[0], left[1] - 1, left[2], right[0], right[1], right[2]);
return date;
}
console.log(formatStringToDate('2018-01-01 12:23:46'));
3:日期转为毫秒数。
// 将指定格式字符串转化成日期( 格式:yyyy-mm-dd hh:ii:ss)
function formatStringToDate(str) {
var arr =str.split(' '); //arr是:["2018-01-01", "12:23:46"]
var left = arr[0].split('-');
var right = arr[1].split(':');
//自定义日期,即给new Date传参数
var date = new Date(left[0], left[1] - 1, left[2], right[0], right[1], right[2]);
return date;
}
// 日期转为毫秒数(格式:yyyy-mm-dd hh:ii:ss)
function formatStringToTime( str ) {
var date = formatStringToDate(str);
return date.getTime()
}
console.log(formatStringToTime('2018-01-01 12:23:46'));
4:计算两个日期的时间差值。
//将指定格式字符串转化成日期( 格式:yyyy-mm-dd hh:ii:ss)
function formatStringToDate(str) {
var arr =str.split(' '); //arr是:["2018-01-01", "12:23:46"]
var left = arr[0].split('-');
var right = arr[1].split(':');
//自定义日期,即给new Date传参数
var date = new Date(left[0], left[1] - 1, left[2], right[0], right[1], right[2]);
return date;
}
// 日期转为毫秒数。(格式:yyyy-mm-dd hh:ii:ss)
function formatStringToTime(str) {
var date = formatStringToDate(str);
return date.getTime()
}
console.log(formatStringToTime('2018-01-01 12:23:46'));
// 计算两个日期的时间差值。
function diffTime(str1, str2) {
var time1 = formatStringToTime(str1);
var time2 = formatStringToTime(str2);
return time2 - time1;
}
console.log(diffTime('2018-01-01 12:23:46', '2018-01-01 12:24:46'));
5:日期函数封装(dateUtil.js)(封装常见功能)
6:延时器和定时器
延时器:
语法:setTimeout(函数或者代码串,指定的时间(毫秒));
setTimeout(function () {}, delay(ms))
在指定的毫秒数后只执行一次函数或代码。
setTimeout (function () {
alert(1);
},3000)
清除延迟器:clearTimeout();
var timer = setTimeout (function () {
alert(1);
},3000);
setTimeout(function () {
clearTimeout(timer);
},2000)
定时器:
语法:setInterval(函数或者代码串,指定的时间(毫秒));
setInterval(function () {}, interval(ms));
按照指定的周期(毫秒)不断的执行函数或者是代码串。
var num = 1;
var timer = setInterval(function () {
console.log(num++);
},1000)
清除定时器:clearInterval();
var num = 1;
var timer = setInterval(function () {
console.log(num++);
if(num >= 10) {
clearInterval(timer);
}
}, 1000);
应用:
1:倒计时。
综合应用:
1:数码时钟。
![](https://i-blog.csdnimg.cn/blog_migrate/8b6a42a4082df701d055504da42f5a15.png)
<div id="box"></div>
<style>
body {
background: #000;
color: #fff;
font-weight: bold;
}
img {
vertical-align: middle;
}
</style>
<script>
function addPrefixZero(num) {
return num < 10 ? '0' + num : num;
}
var box = document.getElementById('box');
function formatDate() {
var date = new Date();
var y = date.getFullYear();
var m = addPrefixZero(date.getMonth() + 1);
var d = addPrefixZero(date.getDate());
var h = addPrefixZero(date.getHours());
var i = addPrefixZero(date.getMinutes());
var s = addPrefixZero(date.getSeconds());
var sTime = '' + y + '-' + m + '-' + d + ' ' +h + ':' + i + ':' + s;
var sHtml = '';
for(var i = 0; i < sTime.length; i++) {
var char = sTime.charAt(i);
if(isNaN(Number(char))) {
sHtml += char;
} else {
sHtml += '<img src="images/' + char + '.png">';
}
}
box.innerHTML = sHtml;
}
formatDate();
setInterval(function () {
formatDate();
}, 1000);
</script>
2:数字字母混合验证码。
![](https://i-blog.csdnimg.cn/blog_migrate/0f318a6acbb6fc8cad309604ee3ed085.png)
function createCaptcha() {
var str = 'abcdefghijklmnopqrstuvwxyz';
var captcha = '';
for(var i = 0; i < 4; i++) {
var index = Math.floor( Math.random() * str.length );
var char = str.charAt(index);
captcha += char;
}
return captcha;
}
var arr = [];
for(var i = 0; i < 10; i++) {
arr.push(createCaptcha());
}
console.log(arr);