日期时间
基本操作
<script type="text/javascript">
let data = new Date();
// 当前时间戳(精确到秒)
console.log(Date.now())
// 返回本地时间的日期时间,与实现有关,如:Tue Jul 07 2020 23:56:14 GMT+0800 (中国标准时间)。
console.log(data)
// 返回本地时间的年。
console.log('年:' + data.getFullYear())
// 返回本地时间的月。 返回值是 0(一月) 到 11(十二月) 之间的一个整数。
console.log('月:' + data.getMonth())
//返回本地时间的日。 返回值是 1 ~ 31 之间的一个整数
console.log('日:' + data.getDate())
//返回本地时间的星期。 返回值为0(周日)至6(周六)。
console.log('星期:' + data.getDay())
//返回本地时间的时。 返回值是 0 (午夜) 到 23 (晚上 11 点)之间的一个整数。
console.log('时:' + data.getHours())
//返回本地时间的分。 返回值是 0 ~ 59 之间的一个整数。
console.log('分:' + data.getMinutes())
//返回本地时间的秒。返回值是 0 ~ 59 之间的一个整数。
console.log('秒:' + data.getSeconds())
//返回本地时间的毫秒。 返回值是 0 ~ 999 之间的一个整数。
console.log('毫秒:' + data.getMilliseconds())
// 返回本地时间本地习惯的日期时间字符串,与实现有关,如:2020/7/7 下午11:56:14。
console.log('日期时间:' + data.toLocaleString())
// 返回本地时间本地习惯的日期时间字符串,与实现有关,如:2020/7/7
console.log('日期:' + data.toLocaleDateString())
// 返回本地时间本地习惯的时间字符串,与实现有关,如:下午11:56:14。
console.log('时间:' + data.toLocaleTimeString());
</script>
结果如下
编码与解码
encodeURI
编码URI。将字母、数字、-.!~*’()和;/?😡&=+$,#以外的字符编码为%开头的16进制转义序列,不会对那些用于分隔URI组件的字符
encodeURIComponent
编码URI组件。将字母、数字和-.!~*’()以外的字符编码为%开头的16进制转义序列,会对那些用于分隔URI组件的字符进行转义。
decodeURI
解码URI,将%开头的16进制转义序列解码为其代表的字符。encodeURI的逆操作。
decodeURIComponent
解码URI的组件,将%开头的16进制转义序列解码为其代表的字符。encodeURIComponent的逆操作。
<script type="text/javascript">
let code = "、-_.!~*'()和;/?😡&=+$,#";
//编码
let encodes = encodeURI(code);
let encodes01 = encodeURIComponent(code);
// 解码
let decodes = decodeURI(encodes);
let decodes01 = decodeURIComponent(encodes);
console.log("编码:" + encodes)
console.log("编码:" + encodes01)
console.log("解码:" + decodes)
console.log("解码:" + decodes01)
</script>
结果
//字符串转base64
function encode(str) {
// 对字符串进行编码
var encode = encodeURI(str);
// 对编码的字符串转化base64
var base64 = btoa(encode);
return base64;
}
//base64转字符串
function decode(base64) {
// 对base64转编码
var decode = atob(base64);
// 编码转字符串
var str = decodeURI(decode);
return str;
}
isNaN 是否非数值。
var code= isNaN(value);
<script type="text/javascript">
let code = "对对对";
let codes = 123;
console.log(isNaN(code))
console.log(isNaN(codes))
</script>
结果
序列化与反序列化
JSON.parse
将字符串反序列化为原始值
JSON.stringify
将原始值序列化为字符串。
字符串操作
strings.lenght 字符串字符个数。只读属性。
<script type="text/javascript">
let strings = "字符串字符个数。只读属性。";
console.log(strings.length)
</script>
结果
13
strings.charAt() 返回第N个字符。如下标越界,则返回空字符串。
<script type="text/javascript">
let strings = "返回第N个字符。如下标越界,则返回空字符串";
console.log(strings.charAt(3))
</script>
结果
N
strings.charCodeAt() 返回第N个字符的Unicode编码,为16位的整数。如下标越界,则返回NaN。
<script type="text/javascript">
let strings = "返回第N个字符。如下标越界,则返回空字符串";
console.log(strings.charCodeAt(3))
</script>
结果
78
strings.concat() 拼接字符串。(可拼接多个)
在原始数据尾部添加另外数据组成新数据(字符串适用)。
<script type="text/javascript">
let strings = "上标";
let strings01 = ",下标";
console.log(strings.concat(strings))
</script>
结果
上标,下标
strings.indexOf() 正向查找字符串。返回子字符串第一个字符在原字符串中的下标,如不存在,则返回-1。
<script type="text/javascript">
let strings = "返回子字符串第一个字符在原字符串中的下标";
console.log(strings.indexOf ('第'))
</script>
结果
6
replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
<script type="text/javascript">
let strings = "返回子字符串第一个字符在原字符串中的下标";
console.log(strings.replace ('第','DDDDDD'))
</script>
结果
返回子字符串DDDDDD一个字符在原字符串中的下标
slice() 方法可从已有的数组中返回选定的元素。(可以接受负数)
strings.slice(start,end)
//数组
const arr = [3,4,4,5,4,6,5,7];
const a = arr.slice(2, 5); // [4, 5, 4]
//字符串
const x = 'abcdefgh';
const y = x.slice(3, 6); // def
array.splice()。
说明
请注意,该方法并不会修改数组,而是返回一个子数组。
用于删除原数组的一部分,并且可以在删除的位置添加新的数组成员,返回值是被删除的数组元素。(改变原数组)
splice(t, v, s)t:被删除元素的起始位置;v:被删除元素个数;s:s以及后面的元素为被插入的新元素。
<script type="text/javascript">
let strings = "返回子字符串第一个字符在原字符串中的下标";
console.log(strings.slice(0,3))
</script>
结果
返回子
substring() 方法可从已有的数组中返回选定的元素。(不可以接受负数)
strings.substring(start,stop)
说明
substring() 方法返回的子串包括 start 处的字符,但不包括 stop 处的字符。
如果参数 start 与 stop 相等,那么该方法返回的就是一个空串(即长度为 0 的字符串)。如果 start 比 stop 大,那么该方法在提取子串之前会先交换这两个参数。
<script type="text/javascript">
let strings = "返回子,字符串第,一个字符在原,字符串中的下标";
console.log(strings.substring(1,9))
</script>
结果
split()将字符串切割成数组。
<script type="text/javascript">
let strings = "返回子,字符串第,一个字符在原,字符串中的下标";
console.log(strings.split(','))
</script>
结果
字符串转字母
toLocaleLowerCase() 转换成本地小写字符串
toLocaleUpperCase() 转换成本地大写字符串
toLowerCase() 转换小写字符串
toUpperCase() 转换大写字符串
<script type="text/javascript">
let strings = "ABDJDLJFF符串中的bbb下标";
console.log(strings.toLocaleLowerCase())
console.log(strings.toLocaleUpperCase())
console.log(strings.toLowerCase())
console.log(strings.toUpperCase())
</script>
结果
string.trim()去除开头和结尾的空白字符。
<script type="text/javascript">
let strings = " ABDJDLJFF符串中的bbb下标 12 ";
console.log(strings)
console.log(strings.trim())
</script>
结果
类型判断
<script>
let arr = '都是对的';
let arr1 = [1,2,3];
let arr2 = true;
let arr3 = {
a:1,
b:2,
};
let arr4 = function(){};
console.log(typeof arr)
console.log(typeof arr1)
console.log(typeof arr2)
console.log(typeof arr3)
console.log(typeof arr4)
</script>
结果
数组操作
arr.push() 从后面添加元素
从后面添加元素,返回值为添加完后的数组的长度
delete() 删除对象/删除数组
<script>
//数组
const arr = [3, 4, 4, 5, 4, 6, 5, 7];
delete arr[1];
console.log(arr); // [3, empty, 4, 5, 4, 6, 5, 7]
//对象
const obj = {
name: 'pboebe',
age: '23',
sex: '女',
sex1: '男'
};
delete obj.sex;
console.log(obj); // {name: "pboebe", age: "23"}
</script>
let arr = [1,2,3,4,5]
console.log(arr.push(5)) // 6
console.log(arr) // [1,2,3,4,5,5]
arr.pop() 从后面删除元素
从后面删除元素,只能是一个,返回值是删除的元素
- let arr = [1,2,3,4,5] console.log(arr.pop()) // 5 console.log(arr)
//[1,2,3,4]
arr.unshift() 从前面添加元素
从前面添加元素, 返回值是添加完后的数组的长度
let arr = [1,2,3,4,5]
console.log(arr.unshift(2)) // 6
console.log(arr) //[2,1,2,3,4,5]
arr.shift() 从前面删除元素
从前面删除元素,只能删除一个 返回值是删除的元素
let arr = [1,2,3,4,5]
console.log(arr.shift()) // 1
console.log(arr) // [2,3,4,5]
arr.splice(i,n) 删除从i(索引值)开始之后的那个元素
删除从i(索引值)开始之后的那个元素。返回值是删除的元素
参数: i 索引值 n 个数
let arr = [1,2,3,4,5]
console.log(arr.splice(2,2)) //[3,4]
console.log(arr) // [1,2,5]
arr.concat() 连接两个数组
连接两个数组 返回值为连接后的新数组
let arr = [1,2,3,4,5]
console.log(arr.concat([1,2])) // [1,2,3,4,5,1,2]
console.log(arr) // [1,2,3,4,5]
str.split() 将字符串转化为数组
let str = '123456'
console.log(str.split('')) // ["1", "2", "3", "4", "5", "6"]
new Set() 数组去重。
const arr = [3,4,4,5,4,6,5,7];
console.log(new Set(arr)); // {3,4,5,6,7}
const a = Array.from(new Set(arr)) // [3, 4, 5, 6, 7]
arr.sort() 将数组进行排序
将数组进行排序,返回值是排好的数组,默认是按照最左边的数字进行排序,不是按照数字大小排序的,见例子。
let arr = [2,10,6,1,4,22,3]
console.log(arr.sort()) // [1, 10, 2, 22, 3, 4, 6]
let arr1 = arr.sort((a, b) =>a - b)
console.log(arr1) // [1, 2, 3, 4, 6, 10, 22]
let arr2 = arr.sort((a, b) =>b-a)
console.log(arr2) // [22, 10, 6, 4, 3, 2, 1]
arr.reverse() 将数组反转
将数组反转,返回值是反转后的数组
let arr = [1,2,3,4,5]
console.log(arr.reverse()) // [5,4,3,2,1]
console.log(arr) // [5,4,3,2,1]
arr.slice(start,end) 切去索引值start到索引值end的数组
切去索引值start到索引值end的数组,不包含end索引的值,返回值是切出来的数组
let arr = [1,2,3,4,5]
console.log(arr.slice(1,3)) // [2,3]
console.log(arr) // [1,2,3,4,5]
forEach() 遍历数组,无return
arr.forEach(callback) 遍历数组,无return
*注意:(伪数组转成真数组才能遍历 Array.prototype.slice.call(伪数组) )
callback的参数: value --当前索引的值
index --索引
array --原数组
let arr = [1,2,3,4,5]
arr.forEach( (value,index,array)=>{
console.log(`value:${value} index:${index} array:${array}`)
})
// value:1 index:0 array:1,2,3,4,5
// value:2 index:1 array:1,2,3,4,5
// value:3 index:2 array:1,2,3,4,5
// value:4 index:3 array:1,2,3,4,5
// value:5 index:4 array:1,2,3,4,5
let arr = [1,2,3,4,5]
arr.forEach( (value,index,array)=>{
value = value * 2
console.log(`value:${value} index:${index} array:${array}`)
})
console.log(arr)
// value:2 index:0 array:1,2,3,4,5
// value:4 index:1 array:1,2,3,4,5
// value:6 index:2 array:1,2,3,4,5
// value:8 index:3 array:1,2,3,4,5
// value:10 index:4 array:1,2,3,4,5
// [1, 2, 3, 4, 5]
map()映射数组(遍历数组,计算出新数组)
arr.map(callback) 映射数组(遍历数组),有return 返回一个新数组
callback的参数: value --当前索引的值
index --索引
array --原数组
案例一
let arr = [1,2,3,4,5]
arr.map( (value,index,array)=>{
value = value * 2
console.log(`value:${value} index:${index} array:${array}`)
})
console.log(arr)
案例二
let score=[19, 85, 99, 25,90];-
let result=score . map(item=>item>=60?'及格':'不及格');-
alert(result);
结果:不及格,及格,及格,不及格,及格
注意: arr.forEach()和arr.map()的区别
1. arr.forEach()是和for循环一样,是代替for。arr.map()是修改数组其中的数据,并返回新的数据。
2. arr.forEach() 没有return; arr.map() 有return
for in() 遍历数组 跟 map 方法类似,遍历对象或者数组
但值得注意的是 for in 循环返回的值都是数据结构的 键值名 。遍历对象返回的对象的key值,遍历数组返回的数组的下标(key)。
// 对象
const obj = {a: 123, b: 12, c: 2 };
for (let a in obj) {
console.log(a)
}
// a b c
//数组
const arr = [3,4,4,5];
for(let a in arr) {
console.log(a)
}
// 0 1 2 3
filter() 过滤数组
13 arr.filter(callback) 过滤数组,返回一个满足要求的数组
*例如做搜索功能
案例一
let arr = [1,2,3,4,5]
let arr1 = arr.filter( (i, v) => i < 3)
console.log(arr1) // [1, 2]
案例二,传一个值也是可以得
let arr = [1,2,3,4,5]
let arr1 = arr.filter( i => i < 3)
console.log(arr1) // [1, 2]
arr.every() 断言 依据判断条件,数组的元素是否全满足
依据判断条件,数组的元素是否全满足,若满足则返回ture
let arr = [1,2,3,4,5]
let arr1 = arr.every( (i, v) => i < 3)
console.log(arr1) // false
let arr2 = arr.every( (i, v) => i < 10)
console.log(arr2) // true
arr.some()断言 依据判断条件,数组的元素是否有一个满足
依据判断条件,数组的元素是否有一个满足,若有一个满足则返回ture
*可以做元素在不在数组中的验证
let arr = [1,2,3,4,5]
let arr1 = arr.some( (i, v) => i < 3)
console.log(arr1) // true
let arr2 = arr.some( (i, v) => i > 10)
console.log(arr2) // false
arr.indexOf() 查找某个元素的索引值
查找某个元素的索引值,若有重复的,则返回第一个查到的索引值若不存在,则返回 -1
let arr = [1,2,3,4,5,2]
let arr1 = arr.indexOf(2)
console.log(arr1) // 1
let arr2 = arr.indexOf(9)
console.log(arr2) // -1
arr.lastIndexOf() 和arr.indexOf()的功能一样,不同的是从后往前查找
let arr = [1,2,3,4,5,2]
let arr1 = arr.lastIndexOf(2)
console.log(arr1) // 5
let arr2 = arr.lastIndexOf(9)
console.log(arr2) // -1
Array.from() 将伪数组变成数组
将伪数组变成数组,就是只要有length的就可以转成数组。 —es6
let str = '12345'
console.log(Array.from(str)) // ["1", "2", "3", "4", "5"]
let obj = {0:'a',1:'b',length:2}
console.log(Array.from(obj)) // ["a", "b"]
Array.of() 将一组值转换成数组
将一组值转换成数组,类似于声明数组 —es6
let str = '11'
console.log(Array.of(str)) // ['11']
等价于
console.log(new Array('11')) // ['11]
注意:但是new Array()有缺点,就是参数问题引起的重载
console.log(new Array(2)) //[empty × 2] 是个空数组
console.log(Array.of(2)) // [2]
arr.find(callback) 找到第一个符合条件的数组成员
let arr = [1,2,3,4,5,2,4
let arr1 = arr.find((value, index, array) =>value > 2)
console.log(arr1) // 3
arr.findIndex(callback) 找到第一个符合条件的数组成员的索引值
let arr = [1,2,3,4,5]
let arr1 = arr.findIndex((value, index, array) => value > 3)
console.log(arr1) // 3
arr.fill(target, start, end) 使用给定的值
使用给定的值,填充一个数组,ps:填充完后会改变原数组
参数: target – 待填充的元素
start – 开始填充的位置-索引
end – 终止填充的位置-索引(不包括该位置)
let arr = [1,2,3,4,5]
let arr1 = arr.fill(5)
console.log(arr1) // [5, 5, 5, 5, 5]
console.log(arr) // [5, 5, 5, 5, 5]
let arr2 = arr.fill(5,2)
console.log(arr2)
let arr3 = arr.fill(5,1,3)
console.log(arr3)
arr.includes() 判断数中是否包含给定的值
let arr = [1,2,3,4,5]
let arr1 = arr.includes(2)
console.log(arr1) // ture
let arr2 = arr.includes(9)
console.log(arr2) // false
let arr3 = [1,2,3,NaN].includes(NaN)
console.log(arr3) // true
ps:与indexOf()的区别:
1 indexOf()返回的是数值,而includes()返回的是布尔值
2 indexOf() 不能判断NaN,返回为-1 ,includes()则可以判断
arr.keys() 遍历数组的键名
let arr = [1,2,3,4]
let arr2 = arr.keys()
for (let key of arr2) {
console.log(key); // 0,1,2,3
}
arr.values() 遍历数组键值
let arr = [1,2,3,4]
let arr1 = arr.values()
for (let val of arr1) {
console.log(val); // 1,2,3,4
}
arr.entries() 遍历数组的键名和键值
let arr = [1,2,3,4]
let arr1 = arr.entries()
for (let e of arr1) {
console.log(e); // 1,2,3,4
}
arr.join() 将数组拼接为字符串
<script type="text/javascript">
var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
document.write(arr.join())
</script>
结果
George,John,Thomas
方式二
const arr = [3,4,4,5,4,6,5,7];
console.log(arr.join('-')); // 3-4-4-5-4-6-5-7
arr.reduce()计算数组元素相加后的总和
reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
reduce() 可以作为一个高阶函数,用于函数的 compose。
注意: reduce() 对于空数组是不会执行回调函数的。
var numbers = [65, 44, 12, 4];
function getSum(total, num) {
return total + num;
}
function myFunction(item) {
document.getElementById("demo").innerHTML = numbers.reduce(getSum);
}
结果
125
arr.reduceRight()计算数组元素相加后的总和
reduceRight() 方法的功能和 reduce() 功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。
注意: reduce() 对于空数组是不会执行回调函数的。
var numbers = [65, 44, 12, 4];
function getSum(total, num) {
return total + num;
}
function myFunction(item) {
document.getElementById("demo").innerHTML = numbers.reduceRight(getSum);
}
结果
125
toString() 转换成字符串。
arr.toString();
valueOf() 方法返回 Array 对象的原始值
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var v=fruits.valueOf();
结果
Banana,Orange,Apple,Mango