8.20 JS对象

zhzzLzh

于 2025-08-20 11:38:23 发布

阅读量625

点赞数 11

CC 4.0 BY-SA版权

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/2503_92841156/article/details/150550259

对象

javascript中的对象分为3种：自定义对象，内置对象，浏览器对象

JavaScript 中的所有事物都是对象：字符串、数字、数组、日期，等等。在 JavaScript 中，对象是拥有属性和方法的数据。

属性是与对象相关的值。

方法是能够在对象上执行的动作。

.关键词（）

举例：汽车就是现实生活中的对象。
汽车的属性：
car.name=Fiat 名称
car.model=500 型号
car.weight=850 kg 重量
car.color=white 颜色

汽车的方法
car.start() 启动
car.drive() 驾驶
car.brake() 刹车

Object对象

创建对象

var 对象名称=new Object();

设置对象属性

对象名称.属性名=值;

设置对象方法

对象名称.方法名=function(){ }

调用对象属性

 对象名称.属性名

调用对象方法

对象名称.方法名()

String对象

创建String对象

var strOb = new String(“abcefg”);

var strOb = String(“abcefg”);

var strOb = “abcefg”;

属性

length (字符串长度)
思考：字符串为什么有length长度？

【js的基本包装类型】为了方便操作基本数据类型，js提供了三个特殊的引用类型：string、，Number，Boolean

基本包装类型：就是把简单数据类型包装为复杂数据类型，这样基本数据类型就有了属性和方法

var str = 'hello';
console.log(str.length) // 5

按道理基本数据类型是没有属性和方法的，而对象才有属性和方法，但上面的代码却可以执行。这是因为js把基本数据类型包装为复杂数据类型，其执行过程如下

// 1. 声明临时变量，把简单数据类型包装为复杂数据类型
var temp = new String('hello');
// 2. 赋值给我们声明的字符串变量
str = temp;
// 3. 销毁临时变量
temp = null;

方法

子字符串位置 indexOf(string,[index]) //返回子字符串abc在字符串中第一次出现的位置（从0开始计算），不存在返回-1
string ：查找的字符串的内容，必填项

index：开始查找位置，可有可无

返回值：返回值是查找到的子字符串的位置（下标），默认情况下，返回的是第一个被查找到的内容；如果被查找的内容不存在，则返回-1
lastIndexOf(string,[index]) //返回子字符串abc在字符串中最后一次出现的位置

string ：子字符串，查找的字符串的内容，必填项

index：开始查找位置，可有可无

返回值：返回值是查找到的子字符串的位置（下标），默认情况下，返回的是第一个被查找到的内容；如果被查找的内容不存在，则返回-1

// 案例：查找 afgdtywgbfnjekagrn 字符串中有多少次 g 
var str = new String('afgdtywgbfnjekagrn');
var index = str.indexOf('g'); // 2
// 统计次数
var num = 0;
while(index !== -1){ // 查找
    num++;
    index = str.indexOf('g',index + 1);
}
console.log('g一共出现了'+num+'次');

// 封装函数 - 查找子字符串出现的次数
function counts(str,cStr){
    var index = str.indexOf(cStr);
    var num = 0; // 出现的次数
    while(index != -1){
        num++; // 每出现一次，次数+1
        index = str.indexOf(cStr,index+1);
    }
    return num;
}
var n = counts('38qhdahwdqjk24hjoiyowuierfy8','o');
alert('O一共出现了'+n+'次');

slice(start,end) 获取字符串的某个部分截取是前包含，后不包含
start 表示开始位置，从0开始到正无穷

end 表示结束位置，可以为正值，也可以为负值,end没有参数值,默认截取到末尾

// 基础使用
var str = 'hello wolrd';
console.log(str.slice(3,5));
console.log(str.slice(3,-1));
// 案例：使用slice和定时器，实现内容的输出
var str = '我的名字叫张三，我今年十三岁了';
var oBox = document.querySelector('#box');
var i = 0;
function show(){
    if(i<str.length){
        oBox.innerHTML += str.slice(i,++i); // 方法一
        oBox.innerHTML += str.charAt(i++); // 方法二
        setTimeout(show,100);
    }
}
show();

截取 substr(起始位置,[截取长度]) //截取不写则代表截取到字符串未尾
起始位置：可以自定义，从0开始

截取长度：可以是一个数字，还可以不写；如果不写长度，表示截取到字符串的末尾

返回值：截取出来的字符串
substring(起始位置,[结束位置]) //不包括截取结果的右边界字符
起始位置：是一个下标值，不能为负值

结束位置：是一个下标值，不能为负值（不包括截取结果的右边界字符）

// 需求：判断图片是什么类型； 照片的格式必须是 png/jpg txt
// 获取文件名的后缀 - 后缀名开始的下标 - lastIndexOf / substr
function getSuffix(){
   var file = document.getElementById('files');
   var pic = file.value;// 图片的路径
   // var pic = '.././images/banner/one.txt';
   var suffix = pic.substr(pic.lastIndexOf('.')+1);
   if(suffix=='png'||suffix=='pneg'||suffix=='jpg'||suffix=='jpeg'){
       alert('图片格式正确');
   }else{
       alert('格式不正确！');
    }
}

<!-- 上传文件，判断文件格式是否正确 -->
<input type="file" id='file'>
<button id='btn'>提交</button>
<script>
    var oBtn = document.querySelector('#btn');
    var oFile = document.querySelector('#file');
    oBtn.onclick = function(){
        var res = getStr(oFile.value);
        if(res){
            alert('上传成功')
        }else{
            alert('图片格式不正确')
        }
    }
</script>

替换 replace(‘子字符串1’,‘子字符串2’) //将字符串中子字符串1替换为子字符串2,

在替换的时候要注意有些字符是需要加转移字符\，不然会把它认为成其他字符。

例如“ *”在替换的时候要注意有些字符是需要加转移字符\，不然会把它认为成其他字符。

var str='My name is apple. So I like to eat apple very much!';
// 1. 普通替换
alert(str.replace('apple','banana'));
alert(str.replace(/apple/g,'banana'));
// 2. 将所有的数字替换为 空格
var str2 = '张三1李四2王五3马六';
alert(str2.replace(/[0-9]/g,' '));
// 3. 将所有的小写字母替换为空格
var str2 = '张三w李四f王五n马六';
var newStr2 = str2.replace(/[a-zA-Z]/g,' '); 
console.log(newStr2);
//  4. 将所有的字母 替换为 空格【不区分大小写】
var str2 = '张三w李四F王五n马六';
// var newStr2 = str2.replace(/[a-zA-Z]/g,' '); 
var newStr2 = str2.replace(/[a-z]/gi,' '); 
console.log(newStr2);

获取指定位置的字符 charAt(n) 默认为第一个字符 n 表示的是下标，范围是 0-正无穷，不能使用负值
获取指定字符的ASCII编码 str.charCodeAt()

String.fromCharCode() 根据ascii返回对应的字符

var str1 = 'helloworld';
var getStr1 = str1.charCodeAt(2);
console.log(getStr1);
var num = 97;
console.log(String.fromCharCode(num)) // a

转换大小写 toLowerCase() toUpperCase()

<!-- 登录验证码效果 -->
<input type="text" id='inp'><span>tR4wC</span><br/>
<button id='btn'>按钮</button>
<script>
    // 模拟验证码的规则
    // 1. 找到按钮
    var oBtn = document.querySelector('#btn');
    // 3. 获取input里面的内容
    var oInp = document.querySelector('#inp');
    // 4. 获取span里面的内容
    var oSpan = document.querySelector('span');
    // 2. 添加点击事件
    oBtn.onclick = function(){
        // 5. 将input里面的内容转为大写
        var inp = oInp.value.toUpperCase();
        // 6. 将span里面的内容转为大写
        var yanzheng = oSpan.innerText.toUpperCase();
        if(inp == yanzheng){
            console.log('验证成功');
        }else{
            console.log('验证失败');
        }
    }
</script>

将字符串分割为数组 split(分割符,[返回数组的最大长度])
分隔符：是一个字符串类型或者是正则表达式
返回值：数组

// 基础案例
var str = 'I am student my name is jack'; 
console.log(str.split()); // 将整个字符串分割为一个整体
console.log(str.split(' ')); // 按照空格进行分割
console.log(str.split('')); // 将字符串中的每个字符都进行分割
var str1 = '张三*20211203*10';
console.log(str1.split('*')); // 按照*进行分割
var str1 = "jack1Rose2Box3Tom4Jerry";
console.log(str1.split(/[0-9]/)); // 按照数字进行分割
var str1 = "张三t里斯r王五p马六";
console.log(str1.split(/[a-z]/)); // 按照字母进行分割

显示字符串效果
bold() 加粗

italics() 斜体

strike() 删除

fontcolor(‘#f00’) 字符串颜色

fontsize(1-7) 字符串大小

sup() 上标标签

sub() 下标标签

var oFont = document.getElementById('font');
var val = oFont.innerText;
oFont.innerHTML = val.big().fontcolor('red').strike().fontsize(18);
// oFont.innerHTML = val.sub()
console.log(val.sub());

设为超链接 link(url)

var oBox = document.querySelector('#box');
oBox.innerHTML = str.strike().fontsize(7).fontcolor('red').italics().link('http://www.baidu.com');

includes【ES6方法】

案例：string方法相关案例

如何判断一个文件是否是图片（截取图片文件的后缀名）

function getFileExtension2(filename) {
    return filename.split('.').pop();
}

面试题：编写一个函数，按下面的输入内容和输出接结果编写

function strChange(title){
  // 此次编写代码
}
var resultStr = strChange("Hello*Books*world*hello");
console.log(resultStr ) // 返回 “hello-books-world-world”

str=“one two thr for fiv six”
将字符串中所有的f换成F，并将字符串转成数组
扩展：创建一个按钮，点击上传图片，判断上传的文件是否是一张图片
将一大串数字转为xxx,xxx,xxx这种有间隔的方法【难】

function numberFormate(num) { // 数字格式化为x,xxx,xxx,xxx
    // 1. 将num专为数字类型
    num = parseFloat(num);
    // 2. 判断是否是一个数字
    if (!Number.isNaN(num)) {
        // 3. 将数字按照.进行分割（主要是针对浮点数）
        let str = Math.abs(num).toString().split('.');
        // 4. 整数部分按照3个一组，看可以分为几组
        const a = Math.ceil(str[0].length / 3);
        // 5. 不够3个一组的，自动补充0
        str[0] = str[0].padStart(a * 3, '0');
        const numArr = [];
        // 6. 将数字按照3个一组进行截取
        for (let i = 0; i < a; i++) {
            numArr.push(str[0].substring(i * 3, (i + 1) * 3));
        }
        // console.log(numArr);
        // 7. 将数组中的第一个值中前面补充的0去除
        numArr[0] = parseInt(numArr[0]);
        // 8. 将数组中的数字按照逗号进行拼接，并且拼接上小数点后面的值
        const formateStr = numArr.join(',') + (str[1] ? '.' + str[1] : '');
        // 9. 判断初始值是正值还是负值，需不需要添加-
        return num < 0 ? "-" + formateStr : formateStr;
    } else {
        throw new TypeError("传入的参数必须是数字");
    }
}
console.log(numberFormate(1123456789.2234)); // 结果为1,123,456,789.2234

Date对象

创建Date对象

var dateObj=new Date();

方法

1. 将日期转为字符串

toLocaleString()  
toLocaleDateString() 
toLocaleTimeString()

toLocaleString特殊用法：可以将一串数字转为xxx,xxx,xxx这种有间隔的方法

console.log((123264849.12).toLocaleString('en-US')); // 123,264,849.12

2. 获取年、月、日、小时、分、秒

1.getYear() //两位的年(2000年前)或三位的年[1900] 获取两位数的年，从1900年开始计算，现在这个方法基本上已经没弃用

console.log(d.getYear());

2.getFullYear() //四位的年获取完整的四位数的年，使用的比较多

console.log(d.getFullYear());

3.getMonth() //月份+1 获取月份，返回值为0-11，表示1月到12月，所以获取到月份之后需要+1

console.log(d.getMonth()+1); // 当前月+1

4.getDate() //日获取天，返回值为今天是几号
获取每月有多少天 var max = new Date(2023,10,0).getDate()

console.log(d.getMonth()+1); // 当前月+1

5.getHours() //小时

console.log(d.getHours()); // 当前月+1

6.getMinutes() //分钟

console.log(d.getMinutes()); // 当前分钟

7.getSeconds() //秒

console.log(d.getMinutes()); // 当前秒钟

8.getTime() //1970 年 1 月 1 日至今的毫秒数时间戳专门用来计算时间的差值，或者倒计时等功能

var d = new Date();
// 1. 通过getTime获取
console.log(d.getTime()); // 当前秒钟
// 2. 通过valueOf获取
console.log(d.valueOf());
// 3. H5新增的获取毫秒树的方式
console.log(Date.now());
// 4. 添加+号[把日期对象转为数字类型]
console.log(+new Date());

3. 定时器 setInterval(函数体,时间（毫秒）,参数（传递给函数的参数）

// 时间跳动案例
function getT(){
        // 获取时间
        var d = new Date();
        var year = d.getFullYear();
        var month = d.getMonth()+1;
        var day = d.getDate();
        var h = d.getHours();
        var m = d.getMinutes();
        var s = d.getSeconds();
        var ms = d.getMilliseconds();
        var oTime = document.getElementById('times');
        oTime.innerHTML = year+'-'+month+'-'+day+' '+h+':'+m+':'+s+' '+ms;
}
function stop(){
        // 清除某个定时器  clearInterval(定时器的名称);
        clearInterval(myTime);
}

4. 怎么计算时间差使用时间戳【UNIX时间戳，timestamp】

计算时间差

2021-9-5 10:30:20 -> 1630809020000

2020-8-9 12:30:45 -> 1596947445000

差多少年，天，小时，分钟，秒钟时间戳

参照时间： 1970/1/1 0:0:0(格林威治时间) 1970/1/1 8:0:0（北京时间）

时间戳：d.getTime(); 单位是毫秒数

计算公式

d = parseInt(总秒数/60/60/24) // 天数

h = parseInt(总秒数/60/60%24) // 小时

m = parseInt(总秒数/60%60) // 分钟

s = parseInt(总秒数%60) // 秒

    var aTime = new Date('2021-9-5 10:30:20'); // 指定的某个时间
    var bTime = new Date('2021-8-5 8:20:10');  //
    var cha = aTime.getTime() - bTime.getTime();
    if(cha<=0){
        console.log('时间输入有误！');
    }else{
        var miao = cha / 1000; // 秒的单位
        var s = miao % 60; // 秒
        var fen = parseInt(miao / 60); // 分钟的单位
        var m = fen%60;// 分钟
        var hour = parseInt(fen / 60); // 小时的单位
        var h = hour % 24; // 小时
        var day = parseInt(hour / 24); // 天
        var d = day % 365;
        var y = parseInt(day/365); // 年
        console.log('两个时间相差：'+y+'年，'+d+'天，'+h+'小时，'+m+'分钟，'+s+'秒钟');
    }

![[11f15ee1-865a-461b-bc46-8abbc33a0c6d.png]]

1. 设置时间

1.设置年月日，时分秒

new Date() 获取当前时间

new Date(字符串 / 时间戳 / 值); 获取指定时间

字符串：“2021-2-3 12:23:34”

时间戳：1617589820000

值： 2012,5,6,12,30,00

var d = new Date('2009-11-12 08:20:30'); // 正常字符串时间的表示方式
var d = new Date('Jan 1 2001 05:20:10'); // 日期时间对象返回的格式
var d = new Date(2020,10,10,10,20,30); // js的时间格式
var d = new Date(1607061589000); // 时间戳

2.简单设置时间 set… [用的不多]

setMonth(); setDate(); setFullYear();

案例1：

某人从2008-8-8号过起了三天打鱼两天筛网的日子，问：今天该打鱼还是筛网，明天呢？明年的今天呢？

// 2008-8-8 张三 打鱼晒网的日期 - 三天打鱼两天筛网
// 今天该打鱼还是筛网 - 获取今天日期
// 经历了多少天：new Date - 2008-8-8
var now = new Date(); // 当前
var start = new Date('2008-8-8');
var cha = now - start; // 单位 ms
var s = parseInt(cha/1000);
var m = parseInt(s/60);
var h = parseInt(m/60);
var d = parseInt(h/24);
var yu = d % 5;
if(yu<3){
  console.log('晒网');
}else{
  console.log('打鱼');
}

案例2：输入年份生成日历

<style>
  body {
    text-align: center;
  }

  .box {
    margin: 0 auto;
    width: 880px;
  }

  .title {
    background: #ccc;
  }

  table {
    height: 200px;
    width: 200px;
    font-size: 12px;
    text-align: center;
    float: left;
    margin: 10px;
    font-family: arial;
  }
</style>
<script>
  var year = parseInt(prompt('输入年份：', '2022')); // 制作弹窗输入年份，默认为2022年
  document.write(calendar(year));//调用函数生成指定年份的年历

  function calendar(year){
    var html = "<div class='box'>";
    for(var m=0;m<=11;m++){
      // 获取每月的第一天的星期
      var w = new Date(year,m).getDay();
      html += 
<table><tr class="title"><td colspan='7'>${year}年${m}月</td></tr>
;
      html += 
<tr><td>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr>
;
      // 获取每月的天数
      var max = new Date(year,m,0).getDate();
      html += '<tr>'
      for(var d=1; d <= max; d++){
        //如果该月的第1天不是星期日，则填充空白
        if (w && d == 1) {
          html += '<td colspan ="' + w + '"> </td>';
        }
        html += '<td>' + d + '</td>';
        if (new Date(year,m,d).getDay()==6) {//如果星期六不是该月的最后一天，则换行
          html += '</tr><tr>';
        } else if (d == max) {//该月的最后一天，闭合</tr>标签
          html += '</tr>';
        }
      }
      html += '</tr>'
    }

    html += '</table></div>';
    return html;
  }
</script>

案例3：时钟效果

Array对象

导语：页面中的数据，都是从数据库读取出来的，如果返回的数据多，一般情况下会以数组或者对象的形式来进行返回，如果想要删除或者添加数据，就可以使用数组中的方法

如图所示，我们可以通过表单添加数据，还可以在点击按钮的时候删除数据，后面会围绕实现当前功能，介绍对应的知识点

创建数组对象

var arrOb=new Array(值,…)

var arrOb=Array(值,…)

var arrOb=[值,…]

var arrOb=new Array(n);

arrOb[0]=值1; arrOb[1]=值2; …

属性

length //数组中元素的数目

方法

1. 转为字符串 String() //将数组转换为字符串，以逗号连接 Array.toString(进制) // 将某个数字专为对应的进制

// toString的特殊用法 - 将某个值转为对应的进制
var num = 10;
console.log(num.toString(16)); // a

parseInt(string, 十进制); // 从任意进制转换为10进制

2. join(‘连接符’) //将数组元素连接成字符串

var arr = ['云南','九寨沟','拉萨','西双版纳','三亚','少林寺'];
console.log(arr.toString());
console.log(arr.join('')); // 链接数组中的内容，没有连接符号
console.log(arr.join('*'));
var str = arr.join('-');
console.log(str.split('-'));

3. concat

连接多个数组，返回新数组 concat(字符串/数组/数字) //连接多个数组，返回新数组

拼接的内容可以是数字，字符串，或者数组
如果是数组，会把数组中的每个值拆分开再进行拼接

// 基础用法
var arr = ['云南','九寨沟','拉萨'];
var newArr = arr.concat('郑州') // 将数组和字符串拼接在一起
console.log(newArr);
var newArr2 = newArr.concat('西安','深圳');
console.log(newArr2);
var newArr3 = arr.concat(['橘子洲','迪士尼'],['雷峰塔','泸州']);
console.log(newArr3);

4. unshift

  追加元素,并返回新数组长度

  unshift(value,......) 将新项添加到数组的开头，并返回新的长度

5. push(value,…)

追加元素,并返回新数组长度
向数组的末尾添加一个或多个元素
添加成功：返回值是添加成功之后数组的长度

6. Shift

删除第一个元素，删除元素并返回该元素

7. pop

删除最后一个元素，删除元素并返回该元素

8. delete arr【2】

删除指定下标的值，返回值为boolean
删除成功之后，返回的是被删除的内容

var arr = ['云南','九寨沟','拉萨','西双版纳','三亚','少林寺'];
arr.unshift(123);
arr.push(456);
arr.push(789);
arr.shift();
var a = arr.pop();
var b = arr.pop();
console.log(arr);
console.log(a);
console.log(b);
delete arr[2]
console.log(delete arr[2]); // true
console.log(arr); // 删除之后的数组

9. splice

删除元素或删除并插入新元素 arr.splice(startindex，length,item,item) 直接对原数组进行删除，添加或者修改

startindex：从什么地方开始删除

length：删除的长度

item:添加的新内容 返回值：被删除的内容

splice函数有非常强大的功能，可以实现删除，替换，添加等功能

删除：splice(开始删除的位置，删除的长度)
替换：splice(开始删除的位置，删除的长度，删除之后添加的新内容)
添加：splice(开始删除的位置，0，添加的新内容)

10. sort

将数组元素升序排序 sort(回调函数)
arr.sort(function(a,b){
return a-b // 正序
 return b-a // 倒序
  })

11. reverse

颠倒数组中的元素 reverse()

var arr = ['云南','九寨沟','拉萨','西双版纳','三亚','少林寺'];
console.log(arr.reverse());

12. 其他方法字符串中的indexOf，lastIndexOf，slice都可以在数组中使用 isArray 判断是否是一个数组

13. 展开运算符 …

ES6中新增了展开运算符，也可以实现数组的拼接

var arr = [1,2,3];

var arr2 = [4,5,6];

var arr3 = […arr,…arr2]

console.log(arr3);

面试题：在js中怎么实现数组的拼接；

案例：数组方法相关案例

随机返回1-100的随机数，返回10个，值不能重复

var arr=[];
for(var i=0;i<10;i++){
  var num=Math.floor(Math.random()*100);
  arr.push(num);
}

// 案例：要求将数组中的0项去掉
var arr = [4, 0, 7, 9, 0, 0, 2, 6, 0, 3, 1, 0];

点击按钮将下面图片进行排序

var aInp = document.getElementsByTagName('input');
var aSpan = document.getElementsByTagName('span');
var aImg = document.getElementsByTagName('img');
var arr = [1,2,3,4,5,6,7,8];
// 正序
aInp[0].onclick = function () {
  arr.sort( function (a,b){return a - b})
  fn();
}
// 倒序
aInp[1].onclick = function () {
  arr.sort( function (a,b){return b - a})
  fn();
}
function fn(){
  for(var i=0; i<aImg.length; i++){
    aImg[i].src = 'img/'+ arr[i] +'.jpg';
    aSpan[i].innerHTML = arr[i];
  }
}

封装一个方法，用于查找数组中的某一项出现的次数

function getNum(arr,str) {
  var index = arr.indexOf(str);
  var num = 0;
  while (index !== -1){
    //每次找到 num加一
    num++;
    //下次从上次找到的地方后面开始找
    index = arr.indexOf(str, index + 1);
  }
  return num
}
var arr = [2, 3, 3, 4, 4, 3, 3, 1];
console.log(getNum(arr,4));

实现tab切换【排他思想】

<div class="content">
  <div class="top">
    <span class="sactive">话费</span>
    <span >机票</span>
    <span >酒店</span>
  </div>
  <div class="bottom">
    <div class="phone active">话费</div>
    <div class="ticket">机票</div>
    <div class="hotel">酒店</div>
  </div>
</div>
<script>
    var btn = document.getElementsByClassName('top')[0].getElementsByTagName('span');
    var show = document.getElementsByClassName('bottom')[0].getElementsByTagName('div');
    console.log(show);
    // 给按钮添加点击事件
    for(var i=0;i<btn.length;i++){
        // 存下标
        btn[i].index = i;
        btn[i].onclick = function(){
            // 排他思想
            // 1. 先让所有的div隐藏
            for(var j=0;j<show.length;j++){
                show[j].style.display = 'none';
                btn[j].className = ''; // 元素添加class类名，使用className
            }
            // 2. 只让点击的按钮对应的div显示
            show[this.index].style.display = 'block';
            btn[this.index].className = 'sactive';
        }
    }
</script>

Math对象

Math对象属于Javascript内置对象，无需实例化（不需要添加new ），可以直接使用

属性

Math.PI

方法

Math.round(number) //四舍五入整数 Math.ceil(number) //向上取整 Math.floor(number) //向下取整 Math.random() //随机返回0.0~1.0之间的数 Math.max(x,y) //求最大值 Math.min(x,y) //求最小值 Math.pow(x,y) //求xy

console.log(Math.PI); // PI
console.log(Math.round(8.5)); // 四舍五入
console.log(Math.abs(-10)); // 四舍五入
console.log(Math.round(6.4));
console.log(Math.ceil(6.4)); // 向上取整
console.log(Math.floor(6.9)); // 向下取整
console.log(Math.max(1,7,6,4,9,2)); // 最大值
console.log(Math.min(1,7,6,4,9,2)); // 最小值
console.log(Math.pow(5,8)); // 求x的y次方
console.log(Math.sqrt(9)); // 开方
// 随机数 0-1
console.log(Math.random());
// 随机数 0-9
console.log(Math.floor(Math.random()*10));
// 随机数 0-99
console.log(Math.floor(Math.random()*100));
// 随机数 1-10
console.log(Math.floor(Math.random()*10)+1);
// 随机数 5-10
console.log(Math.floor(Math.random()*6)+5);
// 随机数 7-18
console.log(Math.floor(Math.random()*12)+7);
// 随机数公式：Math.floor(Math.random()*(max-min+1))+min
// 优雅的取随机字符串
console.log(Math.random().toString(16).substring(2));

案例：Math数学相关案例

获取指定范围的随机数

Math.floor(Math.random()*(max-min+1))+min

封装一个获取指定范围的随机数

function getRand(min,max){
  return Math.floor(Math.random()*(max-min+1)+min);
}

封装一个获取随机颜色的功能

function randColor(){
  // 将获取到的三个随机颜色，拼接在rgb颜色值中
  return 'rgb('+getRand(0,255)+','+getRand(0,255)+','+getRand(0,255)+')';
}