JavaScript内置函数及API

日期时间

基本操作

<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

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值