JavaScript 开发中常用函数

String

1、string.split() : 以某一个字符为分割依据，将字符串转换成数组。

假如有两个URL：http://localhost:1234/api/studentLogin、http://localhost:1234/api/teacherLogin，我希望根据用户输入的URL来判断是学生登录还是教师登录，这里就需要判断URL的最后是studentLogin还是teacherLogin。
第一步：
先获取到浏览器当前页面URL信息：window.location.href，这个方法的返回值是一个字符串。
第二步：
window.location.href.split('/')，根据'/'字符将字符串拆分成数组。
以http://localhost:1234/api/teacherLogin为例，拆分后获取到一个length为5的数组，通过访问数组下标就可以获取URL最后一段的值

var str = "http://localhost:1234/api/teacherLogin";
var arr = str.split('/');
console.log(arr);

2、string.replace()：对string进行查找和替换，并返回一个新字符串。

string.replace(regexp/substr, replacement)
regexp/substr：必需。规定子字符串或要替换的模式的 RegExp 对象。
replacement：必需。一个字符串值。规定了替换文本或生成替换文本的函数。

replace() 方法执行的是查找并替换的操作。它将在 stringObject 中查找与 regexp 相匹配的子字符串，然后用给定的字符来替换这些子串。如果 regexp 具有全局标志 g，那么 replace() 方法将替换所有匹配的子串。否则，它只替换第一个匹配子串。

	var str="hello world"
	console.log(str.replace(/l/,"L"));
	// heLlo world

	var str="hello world"
	console.log(str.replace(/l/g,"L"));
	// heLLo worLd

数组

1、array.filter()：接受一个函数作为参数，函数中做判断，返回符合判定条件的元素并组成一个新的数组，不会改变原数组

function runArr() {
    
    
    var a = [1,2,3];
    var b = a.filter(i => i !== 2);
    console.log('a=>',a);
    console.log('b=>',b);
};

runArr();

2、array.foreach(): 循环遍历数组中的每个元素并执行回调函数

const arr = [1,2,3];
cosnt re = arr.foreach(a => console.log(a));
console.log(re);
// Console: 1, 2, 3

3、array.map(): 循环遍历数组中的每个元素并执行回调函数，使用回调函数的返回值创建一个新的数组

const arr = [1, 2, '12', 12, 'a'];
const re = arr.map(a => typeof)
console.log(re);
// Console:'number', 'number', 'string', 'number', 'string'

4、array.find(): 查找数组中满足条件的第一个元素，如果没有找到，则返回undefined。

const arr = [1, 2, '12', 12, 'a'];
const re = arr.find(a => a%2 === 0);
console.log(re);
// Console: 2

5、array.findIndex(): 查找数组中满足条件的第一个元素的索引，如果没有找到，返回-1。

const arr = [1, 2, '12', 12, 'a'];
const re = arr.findIndex(a => a%2 === 0);
console.log(re);
// Console: 1

6、array.reduce(): 数组的一个高级方法，可以对数组元素进行组合。

// 语法：
array.reduce((total, currentValue, currentIndex, arr) => {
    
    }, initialValue)

参数	说明
(total, currentValue, currentIndex, arr) => {}	必需。遍历数组中的每个元素并执行函数。total：必需，值为initialValue或者函数返回的值；currentValue：必需，当前元素的值；index：可选，当前元素的数组索引；arr： 可选，此次遍历的数组对象
initialValue	可选。作为初始值传递给函数的total

const arr = [1, 2, 3, 4, 5];
const re = arr.reduce((a, num) => {
    
    
   console.log(a, num);
   return a + num;
   
});
console.log(re);

const arr = [1, 2, 3, 4, 5];
const re = arr.reduce((a, num) => {
    
    
   console.log(a, num);
   return a + num;
   
},1);
console.log(re);

通过上面两个简单的demo可以知道，当方法存在initialValue参数时，回调函数的初始total的值是initialValue，并且遍历从索引为0的元素开始；当方法不存在initialValue参数时，回调函数的初始total的值是数组的第一个元素，并且遍历从索引为1的元素开始。

7、array.every(): 遍历数组中的元素并执行一个布尔类型的回调函数。

当所有元素回调函数的返回值都为true时，every()方法返回true，如果有一个元素的回调函数的返回值为false，则every()方法返回false；

8、array.some(): 遍历数组中的元素并执行一个布尔类型的回调函数。

遍历数组的所有元素，并执行回调函数，只要有一个元素的回调函数返回值为true，some()方法就返回true，否则返回false

9、array.sort(): 对数组中的元素进行排序，sort()方法会改变原数组。

默认情况下，按升序对数组中的元素进行排序

const arr = [1, 2, 6, 4, 5];
const re = arr.sort();
console.log(re);
// Console:  [1, 2, 4, 5, 6]

sort()方法也可以接受一个回调函数作为参数，这个回调函数有a,b两个参数，下面的demo演示了如何通过a,b两个参数实现升序和降序：

const arr = [1, 2, 6, 4, 5];
const re = arr.sort((a, b) => a - b);
console.log(re);
// Console: [1, 2, 4, 5, 6]

const arr = [1, 2, 6, 4, 5];
const re = arr.sort((a, b) => b - a);
console.log(re);
// Console: [6, 5, 4, 2, 1]

10、array.flat(): 用于将嵌套数组展平为一维数组。

flat()方法用于将多维数组降维，可以接受一个数字作为参数，这个数值指定数组降维的深度，如下面的demo所示，参数为1时，将一个三维数组降维二维数组，参数为2时，将一个三维数组降为一维数组。

const arr = [[[0,1],2,3], [2,3]];
const re = arr.flat(1);
console.log(re);
// Console: [[0,1],2,3,2,3]

const arr = [[[0,1],2,3], [2,3]];
const re = arr.flat(2);
console.log(re);
// Console: [0，1,2,3,2,3,

const arr = [[1,2,3], [2,3]];
const re = arr.flat();
console.log(re);
// Console: [1,2,3,2,3]

11、array.reverse(): 将原数组转换为倒序，会直接改变原数组。

const arr = [1,2,3];
const re = arr.reverse();
console.log(re, arr);
// Console： [3,2,1], [3,2,1]

12、array.includes(): 遍历数组，判断数组中是否存在某个元素，返回一个布尔类型的值。

const arr = [1,2,3];
const re = arr.includes(22);
console.log(re);
// Console: false

13、array.fill(): 将数组中的所有元素全部设置为一个给定值。

const arr = [1,2,3];
const re = arr.fill(22);
console.log(re);
// Console： [22,22,22]

const arr = new Array(5);
const re = arr.fill(22);
console.log(re);
// Console： [22,22,22,22,22]

14、array.concat(): 组合两个数组。

const arr = [1,2,3];
const arr2 = [4,5,6];
const re = Array.concat(arr, arr2);
console.log(re);
// Console:  [1, 2, 3, 4, 5, 6]

15、array.at(): 根据索引返回指定元素，也支持负索引。

const arr = [1,2,3];
const re = arr.at(1)
console.log(re);
// Console: 2

const arr = [1,2,3];
const re = arr.at(-1)
console.log(re);
// Console: 3

负索引是从数组最后一个元素往前数。

16、array.slice(): 截取数组中的元素

slice(start,end)表示从下标start开始到下标end（不包括end）进行截取，得到的是一个新数组，不改变原数组。当start为负值时表示从倒数第几个元素开始往后截取，不填end的话就表示从倒数的第几个元素开始截取，一直截取到数组末尾元素

// 原数组
const array=[1,2,3,4,5,6,7,8]

//截取数组前三个元素
const sliceA=array.slice(0,3)
console.log('sliceA',sliceA)//得到[1,2,3]

//截取数组后三个元素
const sliceArr=array.slice(-3)
console.log('sliceArr',sliceArr)//得到[6,7,8]

17、array.splice(): 截取数组中的元素

splice()方法有三个参数，分别表示从哪个下标开始，删几个，新元素。可以实现增加、删除、替换数组元素的功能。array.splice(-3,3)表示从倒数第三个元素开始，删除五个元素。该方法返回值时删除的元素集合，会改变原数组。原数组会变成删除的元素剩下的元素集合

// 原数组
const array=[1,2,3,4,5,6,7,8]

//截取数组后三个元素  splice方法
const spliceArr=array.splice(-3,3)
console.log('spliceArr',spliceArr)//得到[6,7,8]

JSON

1、JSON.parse（）：将一个字符串类型数据解析成JSON对象

var str = '{ "id":1, "name":"张三"}';
console.log(JSON.parse(str));

2、JSON.stringify(): 将一个JSON对象解析为字符串

var str = {
    
     id: 1, name: '李四'};
console.log(JSON.stringify(str));