前端javascript总结笔记(二)--其他知识点(日期、Math、数组、对象)

前言

本笔记是：日期、Math、数组、对象、几个高度。

题目：

1.获取2019-09-19格式的日期

    function formatDate(dt){
        if(!dt){
            dt = new Date()
        }
        var year = dt.getFullYear()
        var month = dt.getMonth() + 1
        var date = dt.getDate()
        var hour = dt.getHours()//获取系统时间
        var minute = dt.getMinutes() //分
        var second = dt.getSeconds()//秒
        if(month<10){
            month = '0' + month
        }
        if(date<10){
            date = '0'+ date
        }


        return year+'-'+month+'-'+date+'-'+second
    }
    console.log(formatDate(new Date()))

2.获取随机数，要求是长度一直的字符串格式

3.写一个能遍历对象和数组的通用forEach函数

知识点：

1.日期

见https://www.w3school.com.cn/js/jsref_obj_date.asp

2.Math

//常用的有
var a = 1.1;
var b = 3.8;
console.log(Math.random());//返回 0 ~ 1 之间的随机数。
console.log(Math.max(a,b));//返回a b中最大值
console.log(Math.min(a,b));//返回a b中最小值
console.log(Math.floor(a));//对a进行下舍入1.1=1
console.log(Math.ceil(a));//对a进行上舍入1.1=2

 

3.数组API

1，forEach:遍历所有元素

2，every:判断所有元素是够都符合条件

3，some:判断是否有至少一个元素符合条件

4，sort:排序

5，map:对元素重新组装，生成新的元素

6，filter:过滤符合条件的元素

代码：

var arr = [520,234,147,531,721,981,687,886];

//forEach
arr.forEach(function(item,index){
    //遍历所有数组元素
    console.log(index,item);
    // 0 520
    // 1 234
    // 2 147
    // 3 531
    // 4 721
    // 5 981
    // 6 687
})

//every
arr.every(function(love){
//判断所有元素是够都符合条件
    console.log(love>0);
    //true
})

//some
arr.some(function(item,index){
// 判断是否有至少一个元素符合条件
    if(item>900){
    //一个个遍历，只要有一个符合条件就返回true
        console.log(true);//返回1个true
    }
})

//sort
var arr1 = arr.sort(function(a,b){
// 设置arr1避免改变原数组
//排序
    return a - b;
    //从小到大
    // return b - a;
    //从大到小
})
console.log(arr1);//[147, 234, 520, 531, 687, 721, 886, 981]

//map
var arr2 = arr.map(function(item,index){
// 设置arr2避免改变原数组
// 对元素重新组装，生成新的元素 
    return "Hansen" + item + "<girlfrend>";
})
console.log(arr2);
// ["Hansen147girlfrend", "Hansen234girlfrend", "Hansen520girlfrend", "Hansen531girlfrend", "Hansen687girlfrend", "Hansen721girlfrend", "Hansen886girlfrend", "Hansen981girlfrend"]

//filter
var arr3 = arr.filter(function(item,index){
    //通过某一个条件过滤数组
    if(item >= 600){
        return true;
    }
})
console.log(arr3);//[687, 721, 886, 981]

 

4.对象API

    var obj = {
        x:100,
        y:200,
        z:300
    }
    var key
    for(key in obj){
        if(obj.hasOwnProperty(key)){
            console.log(key,obj[key]);
        }
    }
    //x 100
    // y 200
    // z 300

5、下面是js的几个常用高度

//滚动条触发事件
    window.onscroll = function(){
    // 下面这三个是比较重要的高
    // 屏幕可视区高度
    var h1 = document.documentElement.clientHeight;
    // 滚动条的高度，总高度
    var h2 = document.documentElement.scrollHeight;
    //卷起高度document.body.scrollTop用于IE，document.documentElement.scrollTop用于谷歌，兼容问题
    var h3 = document.body.scrollTop || document.documentElement.scrollTop;
    //元素距离上顶端高度
    var h4 = hh.offsetTop;
    //获取元素高度
    var h5 = hh.offsetHeight;
    console.log('可视区高度',h1,',滚动条总高度',h2,',卷起高度',h3,'元素距离上顶端高度',h4);
    }