Loading

内置对象(Math、Date、String、Array、基本包装类型)

一、内置对象

  • js中三种对象:内置对象、自定义对象、浏览器对象
  • 实例对象是指通过构造函数创建出来,然后实例化的对象(new关键字)
  • 静态对象是指不需要创建,直接调用的对象,可以在整个JS里调用的公共对象。有点类似于全局变量

二、Math

  • Math属性
        console.log(Math.PI);//3.141592653589793(圆周率)
        console.log(Math.E);//2.718281828459045(自然对数的底数)
  • Math方法
        //1.绝对值
        console.log(Math.abs(-1));//1
        console.log(Math.abs(1));//1
        //2.向上取整
        console.log(Math.ceil(2.01));//3
        console.log(Math.ceil(2.5));//3
        console.log(Math.ceil(2.99));//3
        //3.向下取整
        console.log(Math.floor(2.01));//2
        console.log(Math.floor(2.5));//2
        console.log(Math.floor(2.99));//2
        //4.转换为离它最近的单精度浮点数形式的数字
        console.log(Math.fround(1.1));//1.100000023841858
        console.log(Math.fround(2 ** 150));//Infinity
        console.log(Math.fround("abc"));//NaN
        console.log(Math.fround(NaN));//NaN
        //5.取最大值和取最小值
        console.log(Math.max(3,10,11,58,1,9,6));//58
        console.log(Math.min(3,10,11,58,1,9,6));//1
        console.log(Math.min(3,10,"abc",58,1,9,6));//NaN
        //6.数的指数次幂
        console.log(Math.pow(2,2));//4
        console.log(Math.pow(4,3));//64
        //7.数的平方根
        console.log(Math.sqrt(16));//4
        console.log(Math.sqrt(0));//0
        console.log(Math.sqrt(-16));//NaN
        //8. [0,1)的随机数
        console.log(Math.random());//[0,1)的随机数
        console.log(Math.random()*5);//[0,5)的随机数
        console.log(Math.random()*5+1);//[1,6)的随机数
        console.log(parseInt(Math.random()*5));//[0,5)的随机整数
  • 案例
//例1 :自定义一个对象,实现Math.max的方法
        function MyMath(){
            //对象添加一个方法
            this.getMax=function(){
                //参数不确定,获取参数
                var max=arguments[0];
                for(var i=0;i<arguments.length;i++){
                    if(max<arguments[i]){
                        max=arguments[i];
                    }
                }
            return max;
            };
        }
        //实例对象
        var mt=new MyMath();
        var result=mt.getMax(10,30,50,12,66,1);
        console.log(result);//66
//例2 :一个十六进制颜色值的数组
        function getColor(){
            //定义一个带#的字符串,用于开头
            var str="#";
            //定义一个数组,十六进制的每个数字和符号
            var arr=["1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"];
            //因为需要六位数,所以循环六次
            for(var i=0;i<6;i++){
                //随机产生[0,16)的整数,作为下标
                var num=parseInt(Math.random()*16)
                str=str+arr[num];
            }
            return str;
        }
        var result=getColor();
        console.log(result);//随机产生#1be513这样随机颜色值

三、Date

  • 需要注意的是只能通过调用 Date 构造函数来实例化日期对象:以常规函数调用它(即不加 new 操作符)将会返回一个字符串,而不是一个日期对象。
        var havenew=new Date();
        var nonew=Date();
        console.log(havenew);//Thu Apr 26 2018 11:08:13 GMT+0800 (中国标准时间)
        console.log(typeof havenew);//object
        console.log(nonew);//Thu Apr 26 2018 11:08:13 GMT+0800 (中国标准时间)
        console.log(typeof nonew);//string
  • 常用
        var dt1=new Date();//Thu Apr 26 2018 11:19:27 GMT+0800 (中国标准时间)-----现在的时间
        var dt2=new Date(2018/4/2);//Thu Jan 01 1970 08:00:00 GMT+0800 (中国标准时间)-----输入的时间
        var dt3=Date.now();//1524712810153--------1970年到现在的毫秒数(数字类型)
           var dt=new Date();
           console.log(dt.getFullYear());//2018--获取年份
           console.log(dt.getMonth());//3--------获取月份,从0开始算的
           console.log(dt.getDate());//26--------获取日期
           console.log(dt.getHours());//11-------获取小时
           console.log(dt.getMinutes());//25-----获取分钟
           console.log(dt.getSeconds());//57-----获取秒
           console.log(dt.getDay());//4----------获取星期几
           console.log(dt.toString());//Thu Apr 26 2018 11:25:57 GMT+0800 (中国标准时间)----默认
           console.log(dt.toDateString());//Thu Apr 26 2018-------日期
           console.log(dt.toLocaleDateString());//2018/4/26--------日期
           console.log(dt.toTimeString());//11:25:57 GMT+0800 (中国标准时间)-------时间
           console.log(dt.toLocaleDateString());//2018/4/26--------时间
           console.log(dt.valueOf());//1524713157751-------1970年到现在的毫秒数
  • 格式化日期和时间
        function getDate(dt){
            var year=dt.getFullYear();//获取年
            var month=dt.getMonth();//获取月
            var day=dt.getDate()+1;//获取日
            var hour=dt.getHours();//获取小时
            var minute=dt.getMinutes();//获取分钟
            var second=dt.getSeconds();//获取秒
            //当一些数小于10的时候,前面添加一个0
            month=month<10?"0"+month:month;
            day=day<10?"0"+day:day;
            hour= hour<10?"0"+ hour: hour;
            minute=minute<10?"0"+minute:minute;
            second=second<10?"0"+second:second;
            //返回格式化后的日期和时间
            return year+"年"+month+"月"+day+"日"+hour+":"+minute+":"+second;
        }
        var today=new Date();
        console.log(getDate(today));

四、String

1、区分string是字符串类型属于基本类型,而String是字符串对象,属于引用类型

2、字符类型和字符串类型

  • js里没有字符类型,字符类型一般使用单引号(char 声明,例如char ch=‘ y ’)
  • 字符串类型可以看成是多个字符合成的数组,js里无论是单引号还是双引号都是字符串
  • 字符串可以通过for循环遍历
       var str="hello";//可以看成是一个字符数组
        for(var i=0;i<str.length;i++){
            console.log(str[i]);
        }
        //依次输出h e l l o

3、字符串的特性:不可变性,字符串的值不能改变,是只读

       //例1:
        var str="hello";
        console.log(str[1]);//e
        str[1]="w";//
        console.log(str[1]);//e-----说明设置无效,只读
        //例2:
        var str="HTML";
        str="CSS";
        console.log(str);//CSS
        //这种情况也没有改变原来的字符串,相当于内存里有两个字符串"HTML"和CSS"

4、一些属性和方法

       //1. length属性表示一个字符串的长度
        var str="JavaScript";
        console.log(str.length);//10

        //2. concat() 方法将一个或多个字符串与原字符串连接合并,形成一个新的字符串并返回。
        var str="JavaScript";
        console.log(str.concat("HTML","CSS"));//JavaScriptHTMLCSS

        //3. indexOf() 方法找字符串,从某个位置出发(默认0,即从头开始),返回索引值,没有找到-1;
        var str="JavaScript";
        console.log(str.indexOf("a"));//1
        console.log(str.indexOf("a",2));//3----后面的参数表示从哪个位置开始
        console.log(str.indexOf("m"));//-1-----没有返回-1
        console.log(str.indexOf("s"));//-1-----区分大小写

        //4. lastIndexOf() 从后往前找,但是返回的索引值依然是从头开始计算的
        var str="JavaScript";
        console.log(str.lastIndexOf("a"));//3
        console.log(str.lastIndexOf("a",2));//1
        console.log(str.lastIndexOf("s"));//-1

        //5. replace() 方法返回替换后的新字符串。(不是改变原来的字符串)
        var str="JavaScript";
        console.log(str.replace("Java","type"));//typeScript-----前旧后新

        //6. slice() 方法提取一个字符串的一部分,并返回一新的字符串。
        var str="JavaScript";
        console.log(str.slice(0,4));//Java----不包括最后那个
        console.log(str.slice(4));//Script-----第二个参数默认到最后

        //7. split()---(要干掉的字符串,留下的个数)返回一个新的字符串组成的数组
        var str="JavaScript|HTML|CSS|java|c|python";
        console.log(str.split("|",3));//(3) ["JavaScript", "HTML", "CSS"]
        console.log(str.split("",3));//(3) ["J", "a", "v"]----空则每个切分

        //8. substr() 方法返回一个字符串中从指定位置开始到指定字符数(长度)的字符。
        var str="JavaScript";
        console.log(str.substr(0,4));//Java-----前面参数是索引值,后面参数是长度
        console.log(str.substr(-6));//Script------是负数代表从10+(-6)=4开始

        //9. substring() 方法返回一个字符串在开始索引到结束索引之间的一个子集
        var str="JavaScript";
        console.log(str.substr(0,4));//Java----不包括最后那个,两个参数都是索引值

        //10. toLowerCase()和toLocaleLowerCase()方法,转为小写,并返回。
        var str="JavaScript";
        console.log(str.toLowerCase());//javascript
        console.log(str.toLocaleLowerCase());//javascript

        //11.toUpperCase()和toLocaleUpperCase()方法,转换为大写,并返回。
        var str="JavaScript";
        console.log(str.toUpperCase());//JAVASCRIPT
        console.log(str.toLocaleUpperCase());//JAVASCRIPT
        
        //12. charAt() 方法从一个字符串中返回指定的字符。参数是索引值
        var str="JavaScript";
        console.log(str.charAt());//J------默认是0开始
        console.log(str.charAt(3));//a
        console.log(str.charAt(10));//      -----没有则返回空字符串

        //13. fromCharCode(),返回对应的ASCII码对应值,前面必须是大写的String
        console.log(String.fromCharCode(65,66,67));//ABC

5.综合案例

 //例1: 截取字符串的某个字符
        var str="学的不仅是技术,更是梦想,代码改变世界";
        var key="代";
        var index=str.indexOf(key);
        str=str.substr(index,6);
        console.log(str);//代码改变世界
 //例2: 找到下面字符串中所有的 "o"出现的位置
        var  str="hello wood odd over orange"
        var index=0;//开始的位置
        var key="o";//要找的字符串
        //如果是-1情况,说明找完了
        while((index=str.indexOf(key,index)) != -1){
            console.log(index);
            index=index+key.length;
        }
        依次输出:4 7 8 11 15 20 
//例3 :找到这个字符串中每个字符串出现了几次
        var str="Findingeachstringinthisstringappearsseveraltimes";
        //第一步,把全部字母变成小写
        str=str.toLocaleLowerCase();
        //第二步,创建一个空对象,目的是作为键,次数作为值输出
        var obj={};
        //遍历字符串,获取每个字母
        for( var i=0;i<str.length;i++){
            //判断obj这个对象中有没有这个字母(字母-----键)
            var key=str[i];//每个字母
            if(obj[key]){//判断obj对象中有没有这个键
                //obj对象如果有这字母
                obj[key]++;
            }else{
                //对象中没有这个字母,那就把字母加进去,给个次数1次
                obj[key]=1;
            }
        }
        //遍历对象,显示每个字母的次数
        for(var key in obj){
            console.log(key+"这个字母出现了"+obj[key]+"次");
        }

五、Array

1.创建数组的两种方法:构造函数法(new关键字)和字面量法

2.判断对象是不是数组的两种方法:

  • instanceof
  • Array.isArray(对象)
        var arr=[1,5,"html","前端"];
        console.log(arr instanceof Array);//true
        console.log(Array.isArray(arr));//true

3.一些方法:

        //1. Array.from() 方法复制,克隆一个新的数组
        var arr=[1,5,"html","前端"];
        console.log(Array.from(arr));//[1, 5, "html", "前端"]

        //2.concat() 方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。
        var arr1=[1,5,"html","前端"];
        var arr2=[10,50,70,90,100];
        console.log(arr1.concat(arr2));//[1, 5, "html", "前端", 10, 50, 70, 90, 100]

        //3.every(函数) 方法测试数组的所有元素是否都通过了指定函数的测试.
        //三个参数:元素值,元素的索引,原数组,参数根据需要写或不写返回的是布尔值.
        var arr=[10,200,300,1000];
        var flag=arr.every(function(a,b,c){
            //a------元素值
            //b-------元素的索引(可以省略)
            //c--------原数组,谁调用了这个函数就是谁,这里是arr(可以省略)
           return a>100;
        });
        console.log(flag);//false-----需要都满足条件才会返回true
        var arr=["html","css","JavaScript"];
        var flag=arr.every(function(ele){
            return ele.length<13;
        });
        console.log(flag);//true

        //4.filter(函数) 方法返回一个新数组, 其包含通过所提供函数实现的测试的所有元素。
        var arr=[10,200,300,1000];
        var flag=arr.filter(function(ele){
            return ele>100;
        });
        console.log(flag);//[200, 300, 1000]

        //5.push() 方法将一个或多个元素添加到数组的末尾,并返回新数组的长度。
        var arr=[10,20,30,40];
        console.log(arr.push(50));//5
        console.log(arr);//[10, 20, 30, 40, 50]

        //6.pop()方法从数组中删除最后一个元素,并返回该元素的值。
        var arr=[10,20,30,40];
        console.log(arr.pop());//40
        console.log(arr);//[10, 20, 30]

        //7.shift() 方法从数组中删除第一个元素,并返回该元素的值。
        var arr=[10,20,30,40];
        console.log(arr.shift());//10
        console.log(arr);// [20, 30, 40]

        //8.unshift() 方法将一个或多个元素添加到数组的开头,并返回新数组的长度。
        var arr=[10,20,30,40];
        console.log(arr.unshift(50));//5
        console.log(arr);//[50, 10, 20, 30, 40]

        //9.forEach(函数) 方法对数组的每个元素执行一次提供的函数。相当于for循环
        var arr=[1,5,"html","前端"];
        var flag=arr.forEach(function(ele){
            console.log(ele+"abc");
        });//1abc 5abc  htmlabc 前端abc-------没有返回一个新数组! & 没有返回值!
        
        //10.indexOf()方法返回给定元素的第一个索引,如果不存在,则返回-1。
        var arr=[1,5,"html","前端"];
        console.log(arr.indexOf(5));//1
        console.log(arr.indexOf("css"));//-1

        //11. join() 方法将一个数组的所有元素连接成一个字符串并返回这个字符串。
        var arr=[1,5,"html","前端"];
        console.log(arr.join());//1,5,html,前端-----返回字符串

        //12. map(函数) 方法创建一个新数组,该数组中的每个元素都执行函数,返回结果的新数组。
        var arr=[1,10,100,1000];
        var flag=arr.map(function(ele){
            return ele+1;
        })
        console.log(flag);//[2, 11, 101, 1001];

        //13.reverse() 方法将数组中元素的位置颠倒。反转数组
        var arr=[1,10,100,1000]; 
        console.log(arr.reverse());//[1000, 100, 10, 1]

        //14.sort() 方法对数组的元素进行排序,并返回数组。(有可能不稳定,加MDN固定代码)
        var arr=[100,50,20,2000,6];
        console.log(arr.sort());//默认排序顺序是根据字符串Unicode码点。

        //15.  slice(开始的索引,结束的索引)截取,不包括最后一个索引的值,返回新数组
        var arr=[100,50,20,2000,6];
        console.log(arr.slice(2,4));// [20, 2000]-----不包括arr[4]

        //16.splice(a,b,c) 方法通过删除现有元素和/或添加新元素来更改一个数组的内容。
        //第一个参数a---开始的位置
        //第二个参数b---要删除的个数
        //第三个参数c---替换的元素的值
        var arr=["html","css","JavaScript"];
        console.log(arr.splice(1,0));//[]  ----没有删除的,返回空数组
        console.log(arr.splice(1,1));//-----返回被删除的["css"]
        console.log(arr.splice(1,1,"new"));//----返回被删除的数组["css"],
        //但是此时在输出arr)是["html", "new", "JavaScript"]

六、基本包装类型

  • 普通变量不能直接调用属性和方法,对象可以直接调用属性和方法
  • 基本包装类型:本身是基本类型(number、string、boolean),但是在执行代码的过程中,如果这种类型额的代码调用了属性或者是方法,那么这种类型就不再是基本类型了,而是基本包装类型了,这个变量也不是普通的变量,而是基本包装类型的对象了
       //例1
        var num=10;
        console.log(num.toString());//10----字符串

        //例2
        //注意:如果一个对象&&true-------结果是true
        //     如果一个true$$对象------结果是对象
        var flag=new Boolean(false);
        var result=true&&flag;
        console.log(result);//Boolean {false}
        var result=flag&&true;
        console.log(result);//true

        //例3
        var num=10;
        var num2=Number("10");//转换,没有new,类型转
        var num3=new Number("10");//基本包装类型

七、一些补充

  • 清空数组的的两种方法:把数组长度变为0  或者 利用splice的方法
//清空数组
        var arr=[10,20,30,40,50];
        arr.length=0;
        console.log(arr);//[]-----清空了
  • 毫秒数转日期对象
 //毫秒数转日期对象
        var dt=new Date();
        console.log(dt.valueOf());//1524801907949
        var dt2=new Date(dt.valueOf());
        console.log(dt2);//Fri Apr 27 2018 12:05:07 GMT+0800 (中国标准时间)

 

posted @ 2018-04-26 12:03  澎湃_L  阅读(394)  评论(0编辑  收藏  举报