前端常用js函数总结

一、字符串：

//-------ES6字符串函数--------

const id = '32015619620508554x';
const fan = 'I like php.';

//startsWith()方法用来判断当前字符串是否是以另外一个给定的子字符串“开头”的，根据判断结果返回 true 或 false
const jiangSu = id.startsWith('32');              //true,判断是否以32开头
const is1962 = id.startsWith('1962',6);           //true,字符串从第6位开始是否匹配，默认值为0   
const capital = fan.startsWith('i');              //false,区分大小写


//endsWith()方法用来判断当前字符串是否是以另外一个给定的子字符串“结尾”的
const end = id.endsWith('x');                     //true,字符串是否已x结尾
const endCapital = id.endsWith('X');              //false,同上，但区分大小写              
const like = fan.endsWith('like',6);              //true,字符串的真正第6位，结束位置的默认值为str.length


const isPhp = fan.includes('php');                //true,判断字符串中是否包含php
const afterIsPhp = fan.includes('php',9);         //false,字符串的第9位开始是否包含php


//模板字符串：
const head = `${'='.repeat(5)}${fan}${'='.repeat(5)}`;         ////=====I like php=====
//右对齐显示字符串
function center(string,length=25){
    return `${' '.repeat(Math.max(length-string.length,0))}${string}`
}

二、数组：

1..find() item(数组元素)、index(序列)、arr(数组本身)，寻找数组中某个满足条件的元素，当找到符合要求的元素时立马返回，，不再执行后面的操作

    const  inventory = [
        {name:'mango',quantity:2},
        {name:'coconut',quantity:0},
        {name:'lemon',quantity:9}
    ];

    const coconut = inventory.find(fruit => {
        console.log(fruit.name);            //mango,coconut
        if(fruit.name === 'coconut') {
            return true;
        }
        return false;
    })
    console.log(coconut);     //{name: "coconut", quantity: 0}

2..findIndex()寻找数组项的下标，参数与find相同

    const  inventory = [
        {name:'mango',quantity:2},
        {name:'coconut',quantity:0},
        {name:'lemon',quantity:9}
    ];
    //.findIndex()
    const lemonIndex = inventory.findIndex(fruit => {
        if(fruit.name === 'lemon') {
            return true;
        }
        return false;
    })
    console.log(lemonIndex);       //2

3..some()参数同上，数组中某一项满足条件时，即返回true;当找到满足条件项时即返回，不再继续执行

    const  inventory = [
        {name:'mango',quantity:2},
        {name:'coconut',quantity:0},
        {name:'lemon',quantity:9}
    ];
    const isEnough = inventory.some(fruit => {
        console.log(fruit.name);           //mango,coconut
        if(fruit.quantity > 0) {
            return true;
        }
        return false; 
    });
    console.log(isEnough);       //true

4..every()参数同上，数组中每一项都满足条件时才返回true；当执行到不满足条件项的时候立即结束，不执行后面的操作

    const  inventory = [
        {name:'mango',quantity:2},
        {name:'coconut',quantity:0},
        {name:'lemon',quantity:9}
    ];
    const isAllEnough = inventory.every(fruit => {
        console.log(fruit.name);          //mango,coconut
        if(fruit.quantity > 0) {
            return true;
        }
        return false;
    });
    console.log(isAllEnough);           //false

5..map()遍历，返回数组，(val, index, all)分别代表值、下标、被循环的数组。

newarr.map((val, index, a) => {
    return `${val.title}--${val.read}--${val.hot}
`;
});

6..forEach()遍历，没有返回值(map有),不支持return操作输出，return只用于控制循环是否跳出当前循环

newarr.forEach((val, index, a) => {
    document.write(`${val.title}--${val.read}--${val.hot}
`);
});

7..filter()过滤，过滤掉false的，返回为true的

let arr = [
    {title: 'new1', read: 200, hot: true},
    {title: 'new2',read: 300,hot: false},
    {title: 'new2',read: 300,hot: false},
    {title: 'new3',read: 400,hot: true}
];
let newarr = arr.filter((val, index, a) =>{
    return val.hot //表达式中，返回结果为true的就留下来
});
console.log(newarr)

8..reduce()用于数组前后项有一定联系时。pre: 初始值（之后为上一操作的结果），cur: 当前元素值，index: 当前索引arr: 数组本身

//求和
var a = [1,2,3,4,5,6,7,8,9,10]
var str = a.reduce(function(prev,cur,index,arr){
	return prev + cur ; 
})

//将二维数组转换成一维
var a= [[0,1],[2,3],[4,5],[6,7],[8,9]]; 
var str = a.reduce(function(prev,cur){
	return prev.concat(cur)
})
str    //(10) [0,1, 2, 3, 4, 5, 6, 7, 8, 9]


//数组去重
var arr = [1,2,1,2,3,5,4,5,3,4,4,4,4];
var str = arr.sort().reduce((prev, cur)=>{
    if(prev.length===0 || prev[prev.length-1]!==cur){
        prev.push(cur);
    }
    return prev;
}, []); //传入初始值[]

9..判断是不是数组

Array.isArray(arr)

10..join()生成字符串，传入字符，将数组转换成以这个相连的字符串

let arr = [1, 2, 3, 4, 5];
let str = arr.join('-');

9..includes()判断数组是否含有某值，不用return，不用回调函数，输出一个true或false

let arr = [1, 2, 3, 4, 5];
let result = arr.includes(3);
console.log(result);
let result2 = arr.includes(6);
console.log(result2);