第7天-javascript内置对象

数组相关方法

concat 用来连接多个数组

 <script>
    var a = [1,2,3];
    var b = [3,4,5];
    var c = a.concat(b);
    console.log(c); // [1,2,3,3,4,5,]
 </script>

join  把数组元素拿出来，根据指定的符号连接成一个字符串

 <script>
    var a = [1,2,3];
    var b = a.join('|');
    console.log(b);    //  1|2|3
 </script>

pop 删除数组的最后一个元素

 <script>
    var a = [1,2,3];
    var b = a.pop();
    console.log(a);  // [1, 2]
    console.log(b);  //2
 </script>

push 在数组的末尾添加一个元素

 <script>
    var a = [1,2,3];
    a.push("python");
    console.log(a);  // [1, 2, 3, "python"]
</script>     

revrse 反转数组

 <script>
    var a = [1,2,3];
    console.log(a.reverse());  //[3, 2, 1]
</script>     

splice 可以添加或者删除元素

 <script>
    //splice只有1个参数时，表示从数组这个位置开始删除到最后
    var a1 = [1,2,3, 'python', 'java' ];
    console.log(a1.splice(1));  //[2, 3, "python", "java"]
    console.log(a1);  //[1] 
    
    //如果是两个参数，第1个参数表示从哪个位置开始删除，第二个删除几个
    var a2 = [1,2,3, 'python', 'java' ];
    console.log(a2.splice(1, 0));  //[]   我这里设置的0所以1个都没有删除
    console.log(a2);  //[1,2,3, 'python', 'java' ]
    
    // 从索引位置2开始删除1个
    var a3 = [1,2,3, 'python', 'java' ];
    console.log(a3.splice(2, 1));  //[3]  
    console.log(a3);  //[1, 2, "python", "java"]
    
    //如果超过2个参数，则后的参数添加
    var a4 = [1,2,3, 'python', 'java'];
    console.log(a4.splice(2, 1, 'c++', 99));  //[3]  
    console.log(a4);  //[1, 2, "c++", 99, "python", "java"]
    
</script>     

字符串处理

使用单引号或者双引号引起来的文本或者是通过new String（[字符串]）就是字符串对象

var str1 = "abcd";
var str2 = 'abcd';
var str3 = new String("abcd");
var str4 = new String('abcd');
var str5 = '';
var str6 = ''

//以上都是字符串对象

为什么使用字符串对象？

因为javascript中字符串对象提供了很多线程对字符串处理的方法和属性，借助于现有的 方法和属性可以对对象中的字符串进行处理，我们在工作中遇到的数据最多也是字符串类型的数据。

var str = 'my name is heboan';
console.log(str.length); //17
//length是字符串属性，表示字符串的长度

.charAt(index)返回指定位置的字符串

有时候需要拿到某个位置的字符串做判断的时候需要用到这个方法，比如去判定是id("#div")选中器还是类选择器(".div")，就需要知道第一个字符到底是"."还是"#"

var str = 'abcd';
console.log(str.charAt(0)); //输出a
console.log(str.charAt(2)); //输出c
console.log(str.charAt(4)); //输出空字符串

.indexOf(searchvalue, fromindex)返回某个指定的字符串值在字符串中首次出现的位置

indexOf方法有两个参数，第一个参数是要搜索的字符串，第二个参数是从哪个位置开始搜索，它的执行过程就是拿着第一个参数里面的字符去字符串对象中搜索，看看到底有没有这个字符，有的话就返回这个字符的位置，没有的话就返回-1 。通常可以配合字符串截取函数，在字符串中截取出想要的内容，比如文件后缀名、文件名等等，还要注意的细节就是这个方法对大小写敏感，而且是从前往后找的。

var str = "abcdefc";
console.log(str.indexOf("c")); //2 找到第一个出现c的字符串的索引
console.log(str.indexOf('c', 3));//6从索引3开始找，第一次出现字符串c的位置
console.log(str.indexOf('xxxx')); //-1， 在字符串冲查询没有找到，那么就返回-1

.lastIndexOf(searchvalue, fromindex)返回一个指定的字符串值最后出现的位置

lastIndexOf方法和indexOf方法使用相同，只是搜索的顺序不一样而已，indexOf是从前往后搜索，lastIndexOf是从后往前搜索

var str = "abcdefc";
console.log(str.lastIndexOf("c")); //6

.replace(substr, replacement)字符串中用一些字符串替换另一些字符串

var str = 'abcdefc';
console.log(str.replace('c', 'kkk')); //abkkkdefc
console.log(str.replace(/c/g, 'kkk'));//abkkkdefkkk, 用模式字符串加上g替换全局

 .substr(start, length)可在字符串中抽取从start下标开始的指定数目的字符

substr用于字符串截取，有两个参数，第一个参数，是开始截取的位置，第二个参数是截取的长度，第一个参数如果为负数，那么位置从后往前计算，第二个参数可以不写，不写的话就从开始截取的位置到字符串末尾

var str = 'abcdefg';
console.log(str.substr(2,2)); //cd
console.log(str.substr(-2, 2)); //fg
console.log(str.substr(3)); //defg

.substring(start stop)用于提取字符串中介于两个指定下标之前的字符

subtring方法也是用于字符串截取的，和substr不同的是，substring方法截取的是两个位置之间的字符串，有两个参数，第一个参数是开始位置，第二个参数是结束位置，截取的就是中间的一段字符串，第二个参数可以不写，默认从开始的位置截取到字符末尾

var str = 'abcdefg';
console.log(str.substring(2, 4)); //cd
console.log(str.substring(2));//cdefg

.toLowerCase()把字符串转换为小写

var str = 'HEBOAN';
console.log(str.toLowerCase());//heboan

toUpperCase()把字符串转换为大写

var str = 'heboan';
console.log(str.toUpperCase());//HEBOAN

 

<script>
    var Btn = document.getElementById('btn');
    
    Btn.onclick = function(){
        var allowExt = ['jpg', 'png', 'gif', 'jpg']
        //找到html中上传文件对象
        var file = document.getElementById('pic');
        //得到上传文件的值
        var value = file.value;  //如： D:/xxxx/yy/xxxx.jpg
        //获取文件后缀名，先找到.的位置
        var pos = value.lastIndexOf('.');
        //截取.后面的 jpg，将后缀名统一小写，因为上传的后缀名有可能是大写
        var ext = value.substr(pos+1).toLowerCase();
        //检测后缀名是否在数组中
        var tag = false;
        var len = allowExt.length;
        for(var i=0; i<len;i++){
            if(allowExt[i] == ext){
                //只要对比上，将tag设置为true
                tag = true;
                break; //就没有必要继续循环了
            }
        }
        
        if(tag){
            alert(ext+'后缀名支持上传');
        }else{
            alert(ext+'后缀名不支持上传');
        }
        
    }
        
</script>

Math对象 处理数学计算

Math对象是Javascript内置的对象，用于处理数学方法的运算，Math的相关方法，可以直接拿出来用，Math对象的属性和方法属于必须掌握的内容

Math的属性PI

3.141592653589793

Math.abs()返回一个数的绝对值

var num1 = -10;
var num2 = 20;
console.log(Math.abs(num1)); //10
console.log(Math.abs(num2)); //20

 Math.ceil()对一个数进行向上取整

向上取整，如果里面的数是正数，然后去掉小数点，整数+1， 如果里面的值是小数，直接去掉小数就是最后得到的值

var num = 66.6;
console.log(Math.ceil(num)); //67

var num = 70.1;
console.log(Math.ceil(num)); //71

var num = -88.2
console.log(Math.ceil(num)); //-88

Math.flloor()对一个数进行向下取整

var num = 66.6;
console.log(Math.floor(num)); //66

var num = 70.1;
console.log(Math.floor(num)); //70

var num = -88.2
console.log(Math.floor(num)); //-89

 Math.max()求出n个数中最大的值

console.log(Math.max(20, 1, 100, 101, 87)); //101

Math.min()求出n个数中的最小值

console.log(Math.min(20, 1, 100, 101, 87)); //1

Math.pow(x, y)求出x的y次方

console.log(Math.pow(2, 3)); //8

Math.random()能够得到一个0-1之间的随机数，包含0，不包括1

//这里循环输出10次，查看每次生成的随机数
for(var i=0;i<10;i++){
    console.log(Math.random());
}

/*
 0.8626692812123165
 0.7610543906563667
 0.8932199456840746
 0.260131104855589
 0.9728451223560686
 0.19924598760814693
 0.46703603238865044
 0.3164368945385385
 0.6201635278517501
 0.5507817583961432
 */
</script>

获取指定范围内的随机数

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

console.log(getRandomInt(10,20));

Date处理日期和时间

创建Date对象

//创建一个时间对象，用于获取当前系统时间
var date = new Date();
console.log(date); //Thu Nov 08 2018 22:57:44 GMT+0800 (中国标准时间)

//Date对象中传入字符串来常见指定日期时间的 时间对象
var date = new Date('2016/09/13'); //Tue Sep 13 2016 00:00:00 GMT+0800 (中国标准时间)
console.log(date);//

var date = new Date('2016/09/13 10:12:59');
console.log(date); //Tue Sep 13 2016 10:12:59 GMT+0800 (中国标准时间)

//格式new Date(year, month, date[, hours[, minutes, [, seconds[,ms]]]])
var date = new Date(2016,8,13,10,12,59);
console.log(date); //Tue Sep 13 2016 10:12:59 GMT+0800 (中国标准时间)
//这里要注意的是，第二个参数，。月份取值范围是0-11

取出时间某个部分

var date = new Date();
console.log(date); //Thu Nov 08 2018 23:13:40 GMT+0800 (中国标准时间)

//得到一个年份
console.log(date.getFullYear()); //2018

//得到月份, 返回的数字的取值范围是0-11，也就是要在这个数字上加1才是我们当前的月份
console.log(date.getMonth()); //10

//得到具体某天
console.log(date.getDate());//8

//得到时间的小时部分
console.log(date.getHours()); //23

//得到分钟部分
console.log(date.getMinutes());//13

//得到秒部分
console.log(date.getSeconds());//40

//得到毫秒部分
console.log(date.getMilliseconds()); //696

//得到一个数表示当前日期是星期几, 返回的取值范围是0-6， 0表示周日，6表示周6
console.log(date.getDay()); //4

//得到时间戳，1970.1.1到现在的一个毫秒数
console.log(date.getTime()); //1541690449834

//把事件对象转换成字符串
var date = new Date('2016/09/13');
console.log(date.toLocaleString()); //2016/9/13 上午12:00:00