提升开发效率的js内置对象

227 阅读4分钟

js中的对象分为3中:自定义对象内置对象浏览器对象

  • 自定义对象内置对象 是js基础内容,属于 ECMAScript
  • 浏览器对象属于js独有的

今天我就来简单介绍一下js的内置对象

内置对象最大的优点就是帮助我们快速开发

js提供了多个内置对象:MathDataArrayString

1、Math 对象

Math%C2%A0数学对象(1).png

1.1 max()min() 最大值最小值

  • Math.max():最大值
  • Math.min():最小值

最大值最小值的参数必须是若干个 单个的数值

console.log(Math.max(1, 4, -7, 10.5, 5)); // 10.5
console.log(Math.min(1, 4, -7, 10.5, 5)); // -7
console.log(Math.max('abc')); // NaN

之前在讲this章节的时候说过,apply可以用来修改this的指向,基于它的特性(传入的参数是数组),因此可以用apply来查找数组的最大值最小值

let arr = [1, 4, -7, 10.5, 5]
console.log(Math.max.apply(Math, arr)); // 10.5

console.log(Math.min.apply(Math, arr)); // -7

1.2 floor() 向下取整

Math.floor(x):向下取整,就是 返回小于或等于这个数的最大整数

记住两点:

  • 返回的值小于或等于原本的数
  • 返回的值是整数
console.log(Math.floor(1.5));  // 1
console.log(Math.floor(1.9));  // 1
console.log(Math.floor(-1.5));  // -2

1.3 random() 随机数

Math.random():默认返回 [0, 1) 之间的随机数

记住:是大于等于0,小于1的数,不包括1

console.log(Math.random());  // 0.7619574163174425

随机产生一个truefalse

console.log(Math.random() < 0.5 ? true : false);

随机返回数组中的一个数

var arr = ['一等奖', '二等奖', '三等奖', '四等奖']
var random = Math.floor(Math.random() * arr.length);  // 随机获取0~3的一个整数
console.log(arr[random]);

1.4 round() 四舍五入

Math.round() 四舍五入

  • 0.5 比较特殊,它往大的取
console.log(Math.round(1.5));  // -2
console.log(Math.round(-1.8));  // -2
// 往大的取就是 -1
console.log(Math.round(-1.5));  // -1

小案例:猜数

// 返回一个随机数
function getRandom(min, max) {
    return Math.floor(Math.random() * (max - min) + 1) + min
}
var Random = getRandom(0, 10)
var random = prompt('请输入一个数')
var i = 1
while (true) {
    if (i === 3) {
        alert('很遗憾,你的次数已用完')
        break
    }
    if (random > Random) {
        alert('输入的数值较大')
        var Random = prompt('请输入一个数')
        } else if (random < Random) {
            alert('输入的数值较小')
            var Random = prompt('请输入一个数')
            } else {
                alert('恭喜你,猜对了')
            }
    i++;
}

2、Date() 日期对象

Date() 是一个构造函数,必须使用 new 来调用我们的日期对象

// 打印当前的时间
var date = new Date()
console.log(date); // Sat Apr 10 2021 09:25:04 GMT+0800 (中国标准时间)

// 打印指定的时间
var date1 = new Date('2021-4-10 9:26:00')
console.log(date1);  // Sat Apr 10 2021 09:26:00 GMT+0800 (中国标准时间)

Date() 对象为我们提供了一些方法:

Date(+)日期对象.png

方法名说明
getFullYear()获取当前年份
getMonth()获取当前月份(0~11)
getDate()获取当前日期
getDay()获取星期几
getHours()获取当前小时
getMinutes()获取当前分钟
getSeconds()获取当前秒钟

获取 年 月 日

// 括号里面没有写任何数值,默认打印当前时间
var date = new Date();
var year = date.getFullYear(); // 返回当前年份 
var month = date.getMonth() + 1;  // 月份
var dates = date.getDate();  // 几号
var day = date.getDay();  // 星期几
var arr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
console.log('今天是:' + year + '年' + month + '月' + dates + '日 ' + arr[day]);
// 今天是:2020年10月20日 星期二

获取小时、分钟、秒

var h = date.getHours()
h = h < 10 ? '0' + h : h
var m = date.getMinutes()
m = m < 10 ? '0' + m : m
var s = date.getSeconds()
s = s < 10 ? '0' + s : s
console.log(h + ':' + m + ':' + s);  // 09:51:49

小案例:计算一下距离五一假期还要多久

function countDown(time) {
    var nowTime = +new Date();  // 统计总的毫秒数
    var inputTime = +new Date(time);  // time那个时候的总毫秒数
    var times = (inputTime - nowTime) / 1000;  // 差的秒数

    var d = parseInt(times / 60 / 60 / 24); // 剩余的天数
    d = d < 10 ? '0' + d : d;
    var h = parseInt(times / 60 / 60 % 24);
    h = h < 10 ? '0' + h : h;
    var m = parseInt(times / 60 % 60);
    m = m < 10 ? '0' + m : m;
    var s = parseInt(times % 60);
    s = s < 10 ? '0' + s : s;

    return d + '天' + h + '小时' + m + '分钟' + s + '秒';
}

console.log(countDown('2021-5-1 00:00:00')); // 20天14小时04分钟52秒

+new Date():我们当前的时间距离1970年1月1日的总毫秒数


3、数组

数组在之前那一章已有了详细的描写,这里就不再作一些冗余的秒数

在这里说一下数组的排序

数组排序.png

这两个方法都有一个共同的特点:在原数组上修改

3.1 reverse() 颠倒数组

var arr = [10, 2, 4, 5, 20, 40, 50]
console.log(arr.reverse());  // [ 50, 40, 20, 5, 4,  2, 10]

3.2 sort() 升序/降序

sort() 语法

// 默认是升序排序
arr.sort([func])

来体验一下:

var arr = [9, 8, 7, 6, 5, 4, 3, 2, 1]
console.log(arr.sort());  // [ 1, 2, 3, 4, 5, 6, 7, 8, 9]

var arr = ['George', 'John', 'Thomas', 'James', 'Adrew', 'Martin']
console.log(arr.sort()); // [ 'Adrew', 'George', 'James', 'John', 'Martin', 'Thomas' ]

针不戳,但是你来看看下面

var arr = [10, 8, 5, 2, 20, 1]
console.log(arr.sort()); // [ 1, 10, 2, 20, 5, 8 ]

很明显,这个排序错误了

那是因为**sort() 是按照最高位的数来开始排序的**,所以才会导致10在2前面,20在5前面

这时候就需要传入一个函数作为参数,来辅助sort()来判断

// 升序
var arr = [10, 8, 5, 2, 20, 1]
arr.sort(function(a, b) {
    return a - b
});
console.log(arr);  // [ 1, 2, 5, 8, 10, 20 ]

// 降序
arr.sort(function(a, b) {
    return b - a
});
console.log(arr); // [ 20, 10, 8, 5, 2, 1 ]

4、字符串对象

请看这篇文章:这就是字符串对象