js内置对象的常用属性和方法（Array | String | Date | Math）
js内置对象：Array String Math Date
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
// 1、构造函数方法创建数组
var arr=new Array();
console.log(arr);//[] var arr2=new Array(3);//指定数组个数
console.log(arr2);//(3) [empty × 3] var arr3=new Array(1,2,3);//指定数组元素
console.log(arr3);//(3) [1, 2, 3] // 2、字面量表示法创建数组
var arr4=[1,2,3,4];
console.log(arr4);//(4) [1, 2, 3, 4] </script>
</body>
</html>
读取和设置数组元素
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var arr4=[1,2,3,4];
console.log(arr4[0]);//1
arr4[0]=0;
console.log(arr4);//(4) [0, 2, 3, 4] </script>
</body>
</html>
数组长度=数组最大索引值+1
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var arr4=[1,2,3,4];
console.log(arr4.length);//4 获取数组长度
arr4.length=3;
console.log(arr4);//(3) [1, 2, 3]
arr4[9]=9;
console.log(arr4);//(10) [1, 2, 3, empty × 6, 9]
console.log(arr4.length);//10 数组长度永远=最大索引值+1
// 遍历数组
var len=arr4.length;
for(var i=0;i<len;i++){
console.log(arr4[i]);
} </script>
</body>
</html>
数组的栈方法：
push() 从数组最后添加元素，返回数组的新长度
unshift() 从数组的开头添加元素，返回数组的新长度
pop() 删除数组的最后一个元素，返回被删除的那个元素
shift() 删除数组的第一个元素，返回被删除的那个元素
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var arr=[1,2,3,4];
var len=arr.push(5,6);
console.log(len);//6
console.log(arr);//(6) [1, 2, 3, 4, 5, 6] var arr1=[1,2,3,4];
var len1=arr1.unshift(-1,0);
console.log(len1);//6
console.log(arr1);//(6) [-1, 0, 1, 2, 3, 4] var arr2=[1,2,3,4];
var n2=arr2.pop();
console.log(n2);//4
console.log(arr2);//(3) [1, 2, 3] var arr3=[1,2,3,4];
var n3=arr3.shift();
console.log(n3);//1
console.log(arr3);//(3) [2, 3, 4]
</script>
</body>
</html>
数组方法：
join() 数组转字符串
默认分隔符是逗号，可以自定义
reverse() 翻转数组中的元素顺序
sort() 数组排序，默认隐式转换为字符串，然后进行排序
可以自定义参数，用来进行数值的排序
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var arr=[1,2,3,4];
var str=arr.join();
console.log(str);// 字符串 1,2,3,4 var arr2=[1,2,3,4];
var str2=arr2.join('');
console.log(str2);// 字符串 1234 var arr3=[1,2,3,4];
var str3=arr3.join('-');
console.log(str3);// 字符串 1-2-3-4 var arr4=[1,2,3,4];
var arr4=arr4.reverse();
console.log(arr4);// (4) [4, 3, 2, 1] var arr5=[1,24,3,42];
var arr5=arr5.sort();
console.log(arr5);// (4) [1, 24, 3, 42] var arr6=[1,24,3,42];
var arr6=arr6.sort(function(a,b){return a-b;});
console.log(arr6);// (4) [1, 3, 24, 42] var arr7=[1,24,3,42];
var arr7=arr7.sort(function(a,b){return b-a;});
console.log(arr7);// (4) [42, 24, 3, 1] </script>
</body>
</html>
concat() 数组合并
slice(start, end) 数组截取，包含start不包含end
slice(start) 默认从start位置截取到最后
如果start或者end为负数，则等价于 该负数+数组长度
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var arr1=[1,2,3];
var arr2=[4,5,6];
var newArr=arr1.concat(arr2);
console.log(newArr);//(6) [1, 2, 3, 4, 5, 6] var arr=[0,1,2,3,4,5];
var slice1=arr.slice(2);
console.log(slice1);//(4) [2, 3, 4, 5]
var slice2=arr.slice(2,5);
console.log(slice2);//(3) [2, 3, 4]
var slice3=arr.slice(-5);
console.log(slice3);//(5) [1, 2, 3, 4, 5]
var slice4=arr.slice(-5,5);
console.log(slice4);//等价于(1,5) (4) [1, 2, 3, 4] </script>
</body>
</html>
数组的拷贝，方法越多越好
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
//数组拷贝，方法越多越好
var a=[1,2,3,4];
var b; b=a;
console.log(b); b=a.concat([]);
console.log(b); b=a.slice(0);
console.log(b); b=[];
for(var i=0;i<a.length;i++){
b.push(a[i]);
}
console.log(b); </script>
</body>
</html>
splice(index, count, item...)
splice(index, count) 从Index位置开始，删除count个数据
splice(index, 0, item...) 从index位置开始，添加item...
splice(index, count, item...) 从Index位置开始，删除count个数据，并插入item...
返回值始终是被删除的数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var arr=['a', 'b', 'c', 'd', 'e', 'f', 'g'];
var newArr=arr.splice(2, 2);
console.log(newArr);//(2) ["c", "d"]
console.log(arr);//(5) ["a", "b", "e", "f", "g"] var arr2=['a', 'b', 'c', 'd', 'e', 'f', 'g'];
var newArr2=arr2.splice(2);
console.log(newArr2);//(5) ["c", "d", "e", "f", "g"]
console.log(arr2);//(2) ["a", "b"] var arr3=['a', 'b', 'c', 'd', 'e', 'f', 'g'];
var newArr3=arr3.splice(2, 0, 'm', 'n');
console.log(newArr3);//[]
console.log(arr3);//["a", "b", "m", "n", "c", "d", "e", "f", "g"] var arr4=['a', 'b', 'c', 'd', 'e', 'f', 'g'];
var newArr4=arr4.splice(2, 2, 'm', 'n');
console.log(newArr4);//(2) ["c", "d"]
console.log(arr4);//(7) ["a", "b", "m", "n", "e", "f", "g"]
</script>
</body>
</html>
indexOf(value, start) 检测数据在数组中第一次出现的位置
如果有start值，则检测位置从start处开始
lastIndexOf(value) 检测数据在数组中最后一次出现的位置
不存在则为-1
兼容性：IE9+
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var arr=['a', 'b', 'c', 'd', 'a', 'b', 'c'];
var pos=arr.indexOf('c');
console.log(pos);//2
var pos=arr.lastIndexOf('c');
console.log(pos);//6
var pos=arr.indexOf('m');
console.log(pos);//-1 // 自己封装兼容IE9以下版本的indexOf
function ArrIndexOf(arr, value){
for(var i=0;i<arr.length;i++){
if(arr[i]===value){
return i;
}
}
return -1;
}
var pos=ArrIndexOf(arr, 'c');
console.log(pos);//2
</script>
</body>
</html>
str.charAt(index) 返回str字符串中index位置的字符
str.charCodeAt(index) 返回str字符串中index位置的字符的字符编码
str[index] 兼容性IE7+
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var str='hello cyy~';
console.log(str[3]);//l
console.log(str.charAt(3));//l
console.log(str.charCodeAt(3));//108
</script>
</body>
</html>
str.indexOf(value)
str.lastIndexOf(value)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var str='hello cyy~';
console.log(str.indexOf('l'));//2
console.log(str.indexOf('llo'));//2
console.log(str.lastIndexOf('l'));//3
</script>
</body>
</html>
字符串截取
str.slice(start, end)
没有end则默认截取到最后
包含左边不包含右边
如果为负数，则转换为长度+该负数
str.substring(start, end)
与slice基本一致
如果有负数，则自动转换为0
如果前面的数字小于后面的数字，会默认将顺序对换
str.substr(start, len)
截取len为0或者负数时，返回为空
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var str='hello cyy~';
console.log(str.slice(2,5));//llo
console.log(str.slice(2));//llo cyy~
console.log(str.slice(-7,5));//lo console.log(str.substring(2,5));//llo
console.log(str.substring(2));//llo cyy~
console.log(str.substring(-7,5));//hello
console.log(str.substring(5,2));//llo console.log(str.substr(2,5));//llo c
console.log(str.substr(2));//llo cyy~
console.log(str.substr(-7,5));//lo cy
</script>
</body>
</html>
获取扩展名
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var file="cyy.com.jpg";
function getExtension(filename){
var pos=filename.lastIndexOf(".");
return filename.substr(pos);
}
console.log(getExtension(file));//.jpg
</script>
</body>
</html>
str.split(" ") 字符串转数组
str.replace("", "") 字符串替换
replace() 不会改变原字符串
并且replace()只替换第一个，不是全局替换
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var str="cyy.com.jpg";
var arr=str.split(".");
console.log(arr);//(3) ["cyy", "com", "jpg"]
var arr2=str.split("");
console.log(arr2);//(11) ["c", "y", "y", ".", "c", "o", "m", ".", "j", "p", "g"] var newStr=str.replace(".","-");
console.log(str);//cyy.com.jpg
console.log(newStr);//cyy-com.jpg
</script>
</body>
</html>
str.toUpperCase() 字符串转大写
str.toLowerCase() 字符串转小写
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var str="cyy";
console.log(str.toUpperCase());//CYY
var str2="CYY";
console.log(str2.toLowerCase());//cyy
</script>
</body>
</html>
连字符转驼峰
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
// 方法一
function toCamel(str){
var arr=str.split("-");
var len=arr.length;
for(var i=1;i<len;i++){
var word=arr[i];
word=word.charAt(0).toUpperCase()+word.substr(1);
arr[i]=word;
}
return arr.join("");
}
console.log(toCamel("border-left-color"));//borderLeftColor
console.log(toCamel("margin-top"));//marginTop // 方法二
function toCamel2(str){
var arr=str.split("-");
var len=arr.length;
var newStr=arr[0];
for(var i=1;i<len;i++){
var word=arr[i];
word=word.charAt(0).toUpperCase()+word.substr(1);
newStr+=word;
}
return newStr;
}
console.log(toCamel2("border-left-color"));//borderLeftColor
console.log(toCamel2("margin-top"));//marginTop
</script>
</body>
</html>
Math对象
Math.min() 最小值，如果出现非数字，则返回NaN
Math.max() 最大值，如果出现非数字，则返回NaN
Math.floor() 舍去
Math.ceil() 进一
Math.round() 四舍五入
Math.abs() 绝对值
Math.random() 随机数
Math.random（）方法，返回的是一个大于等于0并且小于1的随机数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
//Math.random()生成一个0-1之间的随机数（如0.1~0.9)，包含0不包含1
//指定生成2-5之间的随机整数
//可能是2,3,4,5
//生成随机整数的个数=5-2+1=4
//最小值=0.1*个数+2=2.4
//最大值=9.9*个数+2=5.6 //获取n-m之间的随机整数
function getRandom(n,m){
var len=m-n+1;
var num=Math.floor(Math.random()*len+n);
return num;
}
console.log(getRandom(2,5));
</script>
</body>
</html>
new Date() 创建时间对象
getFullYear() 年份
getMonth() 月份 0-11
getDate() 日
getDay() 星期 0-6
getHours() 小时
getMinutes() 分钟
getSeconds() 秒
getTime() 时间戳
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var time=new Date();
var weekArr=['日','一','二','三','四','五','六'];
console.log(time);//Tue Feb 04 2020 22:04:42 GMT+0800 (中国标准时间)
var year=new Date().getFullYear();//2020
var month=new Date().getMonth()+1;//2
var date=new Date().getDate();//4
var week=new Date().getDay();//2
var minute=new Date().getMinutes();//6
var hour=new Date().getHours();//22
var second=new Date().getSeconds();//5
console.log(new Date().getTime());//1580825165053
document.write('现在是'+year+'年'+month+'月'+date+'日'+hour+'时'+minute+'分'+second+'秒'+' 星期'+weekArr[week]);
</script>
</body>
</html>
设置时间的方法
setFullYear()
setMonth() 如果月份大于12，月份=月份-12，此时年份会+1
setDate()
setHours()
setMinutes()
setSeconds()
setTime()
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var time=new Date();
time.setFullYear(2021);
console.log(time);//Thu Feb 04 2021 22:17:19 GMT+0800 (中国标准时间) // 计算50天后是星期几
// 方法一
var today=new Date();
today.setDate(today.getDate()+50);
console.log(today.getDay());//3 //方法二
var today2=new Date();
var newToday2=new Date(today2.getFullYear(),today2.getMonth(),today2.getDate()+50);
console.log(newToday2.getDay());//3
</script>
</body>
</html>
js内置对象的常用属性和方法（Array | String | Date | Math）的更多相关文章
- JavaScript中内置对象的一些属性及方法
Javascript对象总结 JS中内置了17个对象,常用的是Array对象.Date对象.正则表达式对象.string对象.Global对象 Array对象中常用方法: Concat():表示把几个 ...
- 5月15日上课笔记-js中 location对象的属性、document对象、js内置对象、Date事件对象、
location的属性: host: 返回当前主机名和端口号 定时函数: setTimeout( ) setInterval() 二.document对象 getElementById(); 根据ID ...
- JS内置对象的原型不能重定义？只能动态添加属性或方法？
昨天马上就快下班了,坐在我对面的同事突然问我一个问题,我说“爱过”,哈哈,开个玩笑.情况是这样的,他发现JS的内置对象的原型好像不能通过字面量对象的形式进行覆盖, 只能动态的为内置对象的原型添加属性或 ...
- JS内置对象-String对象、Date日期对象、Array数组对象、Math对象
一.JavaScript中的所有事物都是对象:字符串.数组.数值.函数... 1.每个对象带有属性和方法 JavaScript允许自定义对象 2.自定义对象 a.定义并创建对象实例 b.使用函数来定义 ...
- js课程 2-8 js内置对象有哪些
js课程 2-8 js内置对象有哪些 一.总结 一句话总结:JS中内置了17个对象,常用的是Array对象.Date对象.正则表达式对象.string对象.Global对象. 1.js常用对象有哪些? ...
- js内置对象常用方法
JS内置对象: ● String对象:处理所有的字符串操作 ● Math对象:处理所有的数学运算 ● Date对象:处理日期和时间的存储.转化和表达 ● Array对象:提供一个数组的模型.存储大量有 ...
- 4月5日--课堂笔记--JS内置对象
JavaScript 4.5 一. JS内置对象 1.数组Array a)创建语法1:var arr=new Array(参数); i. 没有参数:创建一个初始容量为0的数组 ii. ...
- JS 内置对象 String对象
JS内置对象 String对象:字符串对象,提供了对字符串进行操作的属性和方法. Array对象:数组对象,提供了数组操作方面的属性和方法. Date对象:日期时间对象,可以获取系统的日期 ...
- web前端学习（四）JavaScript学习笔记部分（6）-- js内置对象
1.JS内置对象-什么是对象 1.1.什么是对象: JavaScript中的所有事物都是对象:字符串.数值.数组.函数 每个对象带有属性和方法 JavaScript允许自定义对象 1.2.自定义对象: ...
随机推荐
- MySQL8.0 MIC高可用集群搭建
mysql8.0带来的新特性,结合MySQLshell,不需要第三方中间件,自动构建高可用集群. mysql8.0作为一款新产品,其内置的mysq-innodb-cluster(MIC)高可用集群的技 ...
- IntelliJ IDEA 2019.3 安装+永久破解[Windows]
IntelliJ IDEA 2019的最后一个版本发布了,听说大幅优化了运行速度,本人实测启动速度确实比以前快不少,所以赶紧安排上新版本IDEA的破解教程 系统环境:Win10 LTSC(1809) ...
- 五、Django学习之基于对象的跨表查询
五.Django学习之基于对象的跨表查询 正向与反向查询 关键在于ForeignKey字段写的位置.例如下面这段代码, 关系属性(字段)写在哪个类(表)里面,从当前类(表)的数据去查询它关联类(表)的 ...
- Nginx 配置访问本地目录
server { listen 8888; # 监听端口 server_name peer; # 服务名 charset utf-8; # 字符集,可处理中文乱码 location / { autoi ...
- abp vnext2.0核心组件之领域实体组件源码解析
接着abp vnext2.0核心组件之模块加载组件源码解析和abp vnext2.0核心组件之.Net Core默认DI组件切换到AutoFac源码解析集合.Net Core3.1,基本环境已经完备, ...
- Visual Studio 2012 出现关于ActivityLog.xml错误的解决方案
由sp1升级sp2后出现的错误. devenv.exe /safemode启动下,就可以了 命令列參數 描述 /Command (devenv.exe) 啟動 IDE 並執行指定的命令. /Debug ...
- asp.net core 3.x 身份验证-3cookie身份验证原理
概述 上两篇(asp.net core 3.x 身份验证-1涉及到的概念.asp.net core 3.x 身份验证-2启动阶段的配置)介绍了身份验证相关概念以及启动阶段的配置,本篇以cookie身份 ...
- Spring Boot2 系列教程(三十二)Spring Boot 整合 Shiro
在 Spring Boot 中做权限管理,一般来说,主流的方案是 Spring Security ,但是,仅仅从技术角度来说,也可以使用 Shiro. 今天松哥就来和大家聊聊 Spring Boot ...
- finished with exit code -1073740791 (0xC0000409)解决方案
1.在用keras框架跑NER的train时,而且只是在用了keras_contrib.layers的CRF时出现问题: 遇到无错跳出finished with exit code -10737407 ...
- 记一次kubernetes驱逐踩坑
最近在公司的线上服务器上发现了一个现象: 将某个node的kubelet短暂的停掉之后,其上的pod马上会被驱逐,这让笔者大吃一惊,印象之中,停掉kubelet后,该node会变为NotReady状态 ...