Javascript中的内建对象

news/2024/7/19 13:02:16 标签: javascript, js, random

Javascript中的内建对象

  • Math的常用属性和方法
    • 一、Math的常用属性
    • 二、Math的常用方法
  • String的常用属性和方法
    • 三、String对象的创建
    • 四、String的属性
    • 五、String的常用方法
  • Number的常用属性和方法
    • 六、Number的常用属性
    • 七、Number的常用方法
  • Date的常用属性和方法
    • 八、获取时间对象
    • 九、时间的获取方法
    • 十、时间的设置方法
    • 十一、Date方法案例

Math的常用属性和方法

一、Math的常用属性

  1. Math.PI 返回圆周率(约等于3.14159)

    Math.PI/180*60 60度角度转弧度

  2. Math.SQRT1_2 返回2的平方根的倒数,约等于0.707

  3. Math.SQRT2 返回2的平方根,约等于1.414

二、Math的常用方法

  1. Math.abs(x) 返回数的绝对值

  2. Math.ceil(x) 向上取整

  3. Math.floor(x) 向下取整

  4. Math.round(x) 四舍五入

  5. Math.max() 取最大值,可以带入多个实参

  6. Math.min() 取最小值,可以带入多个实参

    var arr = [5,6,2,100,88,188,3,1,4];
    console.log(Math.max.apply(null,arr));	//取数组的最大值
    console.log(Math.min.apply(null,arr));	//求数组的最小值
    
  7. Math.pow(x,y) 返回x的y次幂

  8. Math.sqrt(x) 返回数的平方根

  9. Math.random() 返回0-1之间的随机数

    //拓展1:返回x-y之间的随机数字
    function random(x,y){
      return Math.floor(Math.random()*(y-x)+x);
    }
    	```
    ```bash
    //拓展2:随机颜色
     var div1=document.getElementById("div1");
    div1.onclick=function(){
    	this.style.backgroundColor=randomColor();
    }
        
    function randomColor(){
    	var cor="#";
        for(var i=1;i<7;i++){
        	cor+=Math.floor(Math.random()*16).toString(16);
        }
        return cor;
    }
    

String的常用属性和方法

三、String对象的创建

  1. var s=new String();
  2. var s=String();

四、String的属性

字符串的长度 length,这个属性是只能读不能写。
可以通过str[下标] 读取字符串中的字符

var str=new String(‘abc’);
console.log(str.length);
console.log(str[1]);

五、String的常用方法

  1. str.charAt() 返回在指定位置的字符

    str.charAt()相当于str[ ]

  2. str.charCodeAt() 返回在指定位置字符的unicode编码

  3. String.fromCharCode() 从字符编码创建一个字符串

  4. str.concat() 连接字符串

  5. str.indexOf() 检索字符串,返回对应的下标

  6. str.lastIndexOf() 从后向前检索字符串,返回对应的下标

  7. str.includes() 判断是否包含这个字符,会返回一个布尔值

  8. str.search() 检索与正则表达式相匹配的值

  9. str.match() 检索与正则表达式相匹配的值,返回这个值的信息组成的数组

  10. str.replace() 替换与正则表达式相匹配的值,返回新字符串

    var str1=str.replace(“c”,“z”);
    var str1=str.replace(“c”,function(){});

  11. str.slice() 提取字符串中两个指定的索引号之间的字符,并在新的字符串中返回被提取的部分

    srt.slice(开始位置,结束位置)

  12. str.substr() 从起始索引号提取字符串中指定数目的字符,开始位置可以设置负数

    str.substr(开始位置,提取的数目)

  13. str.sunstring() 提取字符串中两个指定的索引号之间的字符,如果有负数,默认为0,可以倒着截取

    var s=str.substring(1,4);
    var s=str.substring(4,1);

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

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

  16. str.split() 把字符串分割成字符串数组,与数组的join()方法相反,还可以用来做正则表达式切割

    str.split(""); //根据空字符串分割

六、String方法案例

  1. 随机验证码
    String.fromCharCode()
    48-57 输出数字0-9
    65-90 输出大写字母A-Z
    97-122 输出小写字母a-z

    function getAuth(){
            var arr=[];
            for(var i=48;i<123;i++){
                if(57<i&&i<65) continue;
                if(90<i&&i<97) continue;
                arr.push(String.fromCharCode(i));
            }
            arr.sort(function(){
                return Math.random()-0.5;
            })
            arr.length=4;
            return arr.join("");
        }
    var s=getAuth();
    console.log(s);
    
  2. 正则表达式切割
    search ? hash #

    var url="http://www.163.com/new/index.html?token=ashjd2i1nsdh21df2123&name=xietian&age=30";
    //方法一
    function getObject(url){
    	var obj={};
        url=url.split("?")[1];
        var arr=url.split("&");
        for(var i=0;i<arr.length;i++){
        	var arr1=arr[i].split("=");
        	obj[arr1[0]]=isNaN(arr1[1])?arr1[1]:Number(arr1[1]);
        }
        return obj;
    }
    console.log(getObject(url));
    
    //方法二
    function getObject(url){
    	return url.split('?')[1].split('&').reduce(function(value,item){
    		var arr=item.split("=");
            value[arr[0]]=isNaN(arr[1])?arr[1]:Number(arr[1]);
            return value;
        },{})
    }
    console.log(getObject(url));
    
  3. 模糊查找

    <input type="text" id="input">
    <ul id="list"></ul>
    <script>
    var arr=[
    	{id:1001,name:"计算器",price:26},
        {id:1002,name:"计算机",price:26},
        {id:1003,name:"飞机",price:26},
        {id:1004,name:"飞行器",price:26},
        {id:1005,name:"算盘",price:26},
        {id:1006,name:"电器",price:26},
        {id:1007,name:"电视机",price:26},
    ]
    var input=document.getElementById("input");
    var list=document.getElementById("list");
    input.oninput=function(){
    	list.innerHTML=arr.reduce(function(value,item){
        	if(item.name.indexOf(input.value)>-1) value+="<li>"+item.name+"</li>";
            return value;
        },'')
    }
    </script>
    

Number的常用属性和方法

六、Number的常用属性

  1. Number.MAX_VALUE 表示最大的数
  2. Number.MIN_VALUE 表示最小的数
  3. Number.NaN 非数字值

七、Number的常用方法

  1. num.toString() 把数字转换成字符串,使用指定的基数
  2. num.toFixed() 把数字转换成字符串,可以设置保留多少位小数
  3. num.toExponentail() 把对象的转换为科学计数法
  4. num.toPrecision() 科学计数法转换为数值

Date的常用属性和方法

八、获取时间对象

var date=new Date();
//传递数字的方式创建指定日期的时间对象
var date=new Date(2021,7,15,12,00,00);
//传递字符串的方式创建指定日期的时间对象
var date=new Date(“2021/8/15 12:00:00”);

九、时间的获取方法

  1. Date() 返回当日的日期和时间

  2. date.getDate() 从Date对象返回一个月中的某一天(1-31)

  3. date.getDay() 从Date对象返回一周中的某一天(0-6)

  4. date.getMonth() 从Date对象中返回月份(0-11)

  5. date.getFullYear() 从Date对象以四位数字返回年份

  6. date.getHours() 返回Date对象的小时(0-23)

  7. date.getMinutes() 返回Date对象的分钟(0-59)

  8. date.getseconds() 返回Date对象的秒数(0-59)

  9. date.getMilliseconds() 返回Date对象的毫秒(0-999)

  10. date.getTime() 返回从1970年到当前时间的毫秒数

    Date.now() 返回从1970年到现在的毫秒数

  11. date.getUTCHours() 返回国际时间(格林尼治时间)

十、时间的设置方法

  1. date.setDate() 设置Date对象中月的某一天(1-31)
  2. date.setMonth() 设置Date对象中的月份
  3. date.setFullyear() 设置Date对象中的年份(四位数字)
  4. date.setHours() 设置Date对象中的小时(0-23)
  5. date.setMinutes() 设置Date对象中的分钟(0-59)
  6. date.setSeconds() 设置Date对象中的秒钟(0-59)
  7. date.setMlilliseconds() 设置Date对象中的毫秒(0-999)
  8. date.setTime() 以毫秒设置Date对象

十一、Date方法案例

  1. 设置时间戳

    //给图片设置时间戳,每次都从服务器获取图片
     <img id="imgs">
    <script>
    	var imgs=document.getElementById('imgs');
        document.onclick=function(){
           imgs.src="https://img14.360buyimg.com/babel/s590x470_jfs/t1/161799/25/17024/142227/606e5369E40afc714/93afe6da257fd357.jpg?time="+new Date().getTime();
        }
    </script>
    
  2. 计算时差

    var timeList=[];
    function startTime(){
    	return timeList.push(new Date().getTime())-1;
    }
    function endTime(id){
    	return new Date().getTime()-timeList[id];
    }
    
    var id1=startTime();
    for(var i=0;i<10000000;i++){
    
    }
    var id2=startTime();
    for(var i=0;i<10000000;i++){
    
    }
    console.log(endTime(id1));
    console.log(endTime(id2));
    
  3. 设置倒计时

    var div1=document.getElementById('div1');
    var date=new Date();
    date.setMinutes(date.getMinutes()+5);
    setInterval(function(){
    	var s=(date.getTime()-new Date().getTime())/1000;
    	div1.innerHTML=parseInt(s/60)+':'+parseInt(s%60);
    },1000)
    

http://www.niftyadmin.cn/n/1498915.html

相关文章

表面粗糙度的基本评定参数是_表面粗糙度新旧标准解读,表面粗糙度的标注方法学习...

表面结构与表面粗糙度的关系有关表面粗糙度的概述1.表面粗糙度的概念表面粗糙度是指加工表面上具有的较小间距和峰谷所组成的微观几何形状特性。宏观几何形状误差、表面波度误差、表面粗糙度三者之间的区别&#xff0c;通常以一定的波距与波高之比来划分&#xff0c;如图所示。…

各种波形文件vcd,vpd,shm,fsdb生成的方法(zz)

仿真是IC设计不可或缺的重要步骤&#xff0c;仿真后一般需要记录下波形文件&#xff0c;用于做详细分析和研究。说一下几种波形文件WLF(Wave Log File)、VCD(Value Change Dump)文件&#xff0c;fsdb(Fast Signal DataBase)文件、shm、vpd&#xff1a; 对于WLF波形日志文件&…

安兔兔跑分可信吗_骁龙888首个安兔兔跑分出现仅63万分,和麒麟9000差距太大

三星S21系列目前的曝光可以说是非常的夸张&#xff0c;不仅仅是外观渲染图&#xff0c;就连真机上手图都被曝光了。然后官方渲染图也被曝光了&#xff0c;那还有什么可以曝光呢&#xff1f;我相信很多人都在等骁龙888的跑分&#xff0c;原因有很多&#xff0c;主要的有&#xf…

运行自己的shell脚本

shell脚本可以直接./**.sh,也可以bash **.sh 我用./**.sh运行自己写的一个脚本&#xff0c;会出现如下的错误&#xff1a; bnrcbnrc:~$ ./pixel.sh bash: ./pixel.sh: 权限不够 bnrcbnrc:~$ sudo ./pixel.sh [sudo] bnrc 的密码&#xff1a; sudo: ./pixel.sh&#xff1a;找不…

python语法简洁清晰、特色_【IT资源分享】老王Python基础+进阶+项目篇(高清无密)...

原标题&#xff1a;【IT资源分享】老王Python基础进阶项目篇(高清无密)一、Python基础概述Python是纯粹的自由软件&#xff0c; 源代码和解释器CPython遵循 GPL(GNU General Public License)协议。Python语法简洁清晰&#xff0c;特色之一是强制用空白符(white space)作为语句缩…

Azure 又获更新:微软 Azure 宣布支持 OpenBSD

微软的 Azure 平台今年得到了源源不断的更新&#xff0c;最近的一次更新提供了在遇到灾难的情况下能恢复 IaaS VM 的能力。今天 Azure 又带来了新的功能增强&#xff0c;现已支持基于 OpenBSD 的磁盘镜像和网络应用。Azure 在其今天更新的官方博客中提到&#xff0c;Azure 的开…

网站静态化处理—web前端优化—中(12)

Web前端很多优化原则都是从如何提升网络通讯效率的角度提出的&#xff0c;但是这些原则使用的时候还是有很多陷阱在里面&#xff0c;如果我们不能深入理解这些优化原则背后所隐藏的技术原理&#xff0c;很有可能掉进这些陷阱里&#xff0c;最终没有达到最佳的预期效果&#xff…

第二阶段冲刺10天 第七天

2017.5.23 昨天:实现了图片美化 今天:查询界面的日月账单查询颜色的改变 困难&#xff1a;不太清楚图片是如何切换的转载于:https://www.cnblogs.com/hchc/p/6974270.html