美文网首页
js常用内置对象

js常用内置对象

作者: 骑着蜗牛去攻城 | 来源:发表于2021-12-25 01:21 被阅读0次

    1.Math对象

    是一个内置对象,它拥有一些数学常数属性和数学函数方法。Math 不是一个函数对象。

    1.1最大值

    Math.max() 函数返回一组数中的最大值。

    1.2最小值

    Math.min() 返回零个或更多个数值的最小值。

    1.3绝对值

    Math.abs(x) 函数返回指定数字 “x“ 的绝对值。

    1.4向下取整

    Math.floor() 返回小于或等于一个给定数字的最大整数。

    1.5向上取整

    Math.ceil() 函数返回大于或等于一个给定数字的最小整数。

    1.6四舍五入

    Math.round()四舍五入版 就近取整 注意 -3.5 结果是 -3

    1.7随机数

    Math.random()方法可以随机返回一个小数,其取值范围是 [0,1),左闭右开 0 <= x < 1

    扩展:得到一个两数之间的随机整数,包括两个数在内

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

    2.日期对象

    Date 对象和 Math 对象不一样,他是一个构造函数,所以我们需要实例化后才能使用

    var now = new Date();
    console.log(now);
    

     如果Date()不写参数,就返回当前时间
     如果Date()里面写参数,就返回括号里面输入的时间

    var date = new Date('2000-2-5 5:5:5');
    console.log(date);
    

    2.1 日期格式化

    image.png

    例:输出当前日期

     var date = new Date();
            console.log(date.getFullYear()); // 返回当前日期的年  
            console.log(date.getMonth() + 1); // 月份 返回的月份小1个月   记得月份+1 
            console.log(date.getDate()); // 返回的是 几号
            console.log(date.getDay()); // 3  周一返回的是 1 周六返回的是 6 但是 周日返回的是 0
            // 我们写一个 2019年 5月 1日 星期三
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var dates = date.getDate();
            var arr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
            var day = date.getDay();
            console.log('今天是:' + year + '年' + month + '月' + dates + '日 ' + arr[day]);
    

    输出当前时间

      // 格式化日期 时分秒
            var date = new Date();
            console.log(date.getHours()); // 时
            console.log(date.getMinutes()); // 分
            console.log(date.getSeconds()); // 秒
            // 要求封装一个函数返回当前的时分秒 格式 08:08:08
            function getTimer() {
                var time = new Date();
                var h = time.getHours();
                h = h < 10 ? '0' + h : h;
                var m = time.getMinutes();
                m = m < 10 ? '0' + m : m;
                var s = time.getSeconds();
                s = s < 10 ? '0' + s : s;
                return h + ':' + m + ':' + s;
            }
            console.log(getTimer());
    

    2.2获取日期的总的毫秒形式(时间戳)

    Date 对象是基于1970年1月1日(世界标准时间)起的毫秒数

    // 实例化Date对象
    var now = new Date();
    // 1. 用于获取对象的原始值
    console.log(date.valueOf())
    console.log(date.getTime())
    // 2. 简单写可以这么做
    var now = + new Date();
    // 3. HTML5中提供的方法,有兼容性问题
    var now = Date.now();
    

    注:new Date()的()里如果为空的话返回的是当前时间总的毫秒数,如果不为空的话返回的是用户输入时间总的毫秒数;

    2.3倒计时

     // 倒计时效果
            // 1.核心算法:输入的时间减去现在的时间就是剩余的时间,即倒计时 ,但是不能拿着时分秒相减,比如 05 分减去25分,结果会是负数的。
            // 2.用时间戳来做。用户输入时间总的毫秒数减去现在时间的总的毫秒数,得到的就是剩余时间的毫秒数。
            // 3.把剩余时间总的毫秒数转换为天、时、分、秒 (时间戳转换为时分秒)
            // 转换公式如下: 
            //  d = parseInt(总秒数/ 60/60 /24);    //  计算天数
            //  h = parseInt(总秒数/ 60/60 %24)   //   计算小时
            //  m = parseInt(总秒数 /60 %60 );     //   计算分数
            //  s = parseInt(总秒数%60);            //   计算当前秒数
            function countDown(time) {
                var nowTime = +new Date(); // 返回的是当前时间总的毫秒数
                var inputTime = +new Date(time); // 返回的是用户输入时间总的毫秒数
                var times = (inputTime - nowTime) / 1000; // times是剩余时间总的秒数 
                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('2019-5-1 18:00:00'));
            var date = new Date();
            console.log(date);
    

    3.数组对象Array

    3.1检测是否为数组
     instanceof 运算符,可以判断一个对象是否属于某种类型
     Array.isArray()用于判断一个对象是否为数组,isArray() 是 HTML5 中提供的方法

    var arr = [1, 23];
    var obj = {};
    console.log(arr instanceof Array); // true
    console.log(obj instanceof Array); // false
    console.log(Array.isArray(arr)); // true
    console.log(Array.isArray(obj)); // false
    

    3.2添加删除数组元素方法


    image.png
    // 添加删除数组元素方法
            var arr = [1, 2, 3];
            // 1. push() 在我们数组的末尾 添加一个或者多个数组元素   push  推
            arr.push(4, 'pink');
            // (1) push 是可以给数组追加新的元素
            // (2) push() 参数直接写 数组元素就可以了
            // (3)  arr.push()完毕之后,返回的结果是 新数组的长度 
            // (4) 原数组也会发生变化
    
            // 2. unshift 在我们数组的开头 添加一个或者多个数组元素
            console.log(arr.unshift('red', 'purple'));
            // (1) unshift是可以给数组前面追加新的元素
            // (2) unshift() 参数直接写 数组元素就可以了
            // (3) unshift完毕之后,返回的结果是 新数组的长度 
            // (4) 原数组也会发生变化
    
            // 3. pop() 它可以删除数组的最后一个元素  
            console.log(arr.pop());
            // (1) pop是可以删除数组的最后一个元素 记住一次只能删除一个元素
            // (2) pop() 没有参数
            // (3) pop完毕之后,返回的结果是 删除的那个元素 
            // (4) 原数组也会发生变化
    
            // 4. shift() 它可以删除数组的第一个元素  
            console.log(arr.shift());
            // (1) shift是可以删除数组的第一个元素 记住一次只能删除一个元素
            // (2) shift() 没有参数
            // (3) shift完毕之后,返回的结果是 删除的那个元素 
            // (4) 原数组也会发生变化
    

    3.3数组排序


    image.png
    var arr = [1, 64, 9, 6];
    //arr.sort();在进行个位数和十位数排序的时候会有一些小问题,所以用以下方法
    arr.sort(function(a, b) {
    return b - a; // 降a序
    // return a - b; // 升序
    });
    console.log(arr);
    

    3.4数组索引方法


    image.png

    案例:数组去重

       // 数组去重 ['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b'] 要求去除数组中重复的元素。
            // 1.目标: 把旧数组里面不重复的元素选取出来放到新数组中, 重复的元素只保留一个, 放到新数组中去重。
            // 2.核心算法: 我们遍历旧数组, 然后拿着旧数组元素去查询新数组, 如果该元素在新数组里面没有出现过, 我们就添加, 否则不添加。
            // 3.我们怎么知道该元素没有存在? 利用 新数组.indexOf(数组元素) 如果返回时 - 1 就说明 新数组里面没有改元素
            // 封装一个 去重的函数 unique 独一无二的 
            function unique(arr) {
                var newArr = [];
                for (var i = 0; i < arr.length; i++) {
                    if (newArr.indexOf(arr[i]) === -1) {
                        newArr.push(arr[i]);
                    }
                }
                return newArr;
            }
    
        var demo = unique(['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b'])
    

    3.5数组转换为字符串


    image.png

    3.6其他


    image.png
    concat() 方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。
    var num1 = [1, 2, 3],
        num2 = [4, 5, 6],
        num3 = [7, 8, 9];
    var nums = num1.concat(num2, num3);
    console.log(nums);
    // results in [1, 2, 3, 4, 5, 6, 7, 8, 9]
    var nums2 =num1.concat(100,num2);
    console.log(nums);
    // results in [1, 2, 3, 100,4, 5, 6]
    
    slice() 方法返回一个新的数组对象,这一对象是一个由 begin 和 end 决定的原数组的浅拷贝(包括 begin,不包括end)。原始数组不会被改变。
    const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];
    
    console.log(animals.slice(2));
    // expected output: Array ["camel", "duck", "elephant"]
    
    console.log(animals.slice(2, 4));
    // expected output: Array ["camel", "duck"]
    
    console.log(animals.slice(1, 5));
    // expected output: Array ["bison", "camel", "duck", "elephant"]
    
    console.log(animals.slice(-2));//begin为负数,则表示从原数组中的倒数第几个元素开始提取
    // expected output: Array ["duck", "elephant"]
    
    console.log(animals.slice(2, -1));//end为负数, 则它表示在原数组中的倒数第几个元素结束抽取。
    // expected output: Array ["camel", "duck"]
    
    
    splice() 方法通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。
    写法:array.splice(start,deleteCount(可选),item1, item2, ... (可选))
    start:指定修改的开始位置(从0计数)。如果超出了数组的长度,则从数组末尾开始添加内容;如果是负值,则表示从数组末位开始的第几位(从-1计数,这意味着-n是倒数第n个元素并且等价于array.length-n);如果负数的绝对值大于数组的长度,则表示开始位置为第0位。
    deleteCount: 可选. 整数,表示要移除的数组元素的个数。如果 deleteCount 被省略了或者它的值大于等于array.length - start,那么start之后数组的所有元素都会被删除;如果 deleteCount 是 0 或者负数,则不移除元素。这种情况下,至少应添加一个新元素。
    item1, item2, ...: 可选,要添加进数组的元素,从start 位置开始。如果不指定,则 splice() 将只删除数组元素。
    
    var myFish = ['angel', 'clown', 'trumpet', 'sturgeon'];
    var removed = myFish.splice(0, 2, 'parrot', 'anemone', 'blue');
    // 运算后的 myFish: ["parrot", "anemone", "blue", "trumpet", "sturgeon"]
    // 被删除的元素: ["angel", "clown"]
    
    var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
    var removed = myFish.splice(-2, 1);
    // 运算后的 myFish: ["angel", "clown", "sturgeon"]
    // 被删除的元素: ["mandarin"]
    

    相关文章

      网友评论

          本文标题:js常用内置对象

          本文链接:https://www.haomeiwen.com/subject/oezkqrtx.html