Es6常用函数

字符串处理

let str = "www.csp.com";
let n1 = str.includes("xj");
console.log(n1);
let n2 = str.startsWith("www"); /* 可以 */
console.log(n2);
let n3 = str.endsWith("kkk");
console.log(n3);

模板字符串基本用法

let userName = "csp";
let age = "23";
let sex = "男";
let user = `name=${userName},age=${age},sex=${sex}`;
console.log(user);

模板字符串函数用法

function showEnName(){
    return "程世平";
}
console.log(`我的中文名是-${showEnName()}`);

/* ********************************************  */
function showEnjoy(a,b,c){
    return a[0]+b+a[1]+c;
}

let job = "Java";
let workYear = "3";
let outEnjoy = showEnjoy`工作=${job},年限=${workYear}.`;
console.log(outEnjoy);

多参数的写法

function fun1(...n){
    console.log(n.length);
}
fun1(1,2,3,4,5);

箭头函数

let fun2=(x,y=0)=>{
    return x+y;
}
console.log(fun2(3));
// 一个参数，也可以加上括号
let fun3=x=>{
    return x;
}
// 没有参数
let fun4=()=>{
    return "程世平";
}
// 函数体只有一句
let fun5=x=>x+1;
console.log(fun5(3));

函数尾调用

必须是最后一步

let wd1=(x,y)=>{
    return x+y;
}
// 尾调用共享一块内存空间
let wd2=()=>{
    return wd1(1,2);
}
console.log(wd2());
/* 不属于尾调用（不是最后一步） */
let wd3=()=>{
    let n = wd1(1,2);
    return n;
}
/* 不属于尾调用（参与运算了） */
let wd4=()=>{
    return wd1(1,2)+1;
}

/* 递归 */
let factorial=(n)=>{
    if(n <= 1){
        return 1;
    } else {
        return n * factorial(n - 1);
    }
}
// 4 * 3 * 2 = 24
console.log(factorial(4));
/* 递归 尾调用 */
let factorial2=(n,p=1)=>{
    if(n <= 1){
        return 1*p;
    } else {
        let result = n*p;
        return n * factorial(n - 1,result);
    }
}
console.log(factorial2(5));

循环遍历

let list = [3,5,7,9];
// forin
for (const key in list) {
    console.log(list[key]);
}
// forof
for (const value of list) {
    console.log(value);
}
// forEach
list.forEach((n,i) => {
    console.log(`数组第${i}个值为${n}`);
});

扩展运算符与filter

let add=(a,b,c)=>{
    return a+b+c;
}
let num = [1,3,5];
console.log(add(...num));
// 优化上面代码,可以for循环累加
let add2=(...c)=>{
    let sum = 0;
    for (const num of c) {
        sum += num
    }
    return sum;
}
console.log(add2(...num));

Set

let arr = [3,5,7,5,2,1];
let set1 = new Set(arr);
console.log(set1);

// 并集
let set2 = new Set([1,3,4,5]);
let set3 = new Set([2,4,5,6]);
let set4 = new Set([...set2,...set3]);
console.log(set4);
// 交集
let set5 = new Set([...set2].filter(x=>set3.has(x)));
console.log(set5);
// 差集
let set6 = new Set([...set2].filter(x=>!set3.has(x)));
console.log(set6);

Map

let num = 123; // 数字
let arr = [1,2,3]; // 数组
let fun = ()=>{}; // 函数
let obj = {}; // 对象
const map = new Map();
map.set(num,"数字");
map.set(arr,"数组");
map.set(fun,"函数");
map.set(obj,"对象");
for (const key of map.keys()) {
    console.log(typeof(key));
}
/* 将value转成数组，直接进行显示 */
let arr1 = [...map.values()];
let arr2 = [...map.keys()];
let arr3 = [...map.entries()];
console.log(arr1);

Module多模块

文件js/modulejs.js

// 引入其他js
import modulejs2 from './modulejs2.js'
// 私有
let fun1 = ()=>{
    return 666+modulejs2.num;
}
// 共有
export default{
    csp:"程世平",
    fun1 : ()=>{
        return fun1();
    },
}

文件js/modulejs2.js

// 私有
let num = 100;
// 共有
export default{
    num : num,
}

文件module.html

<script type="module">
    /* ./ 同级 ../ 上级  / 根 */
    import modulejs from './js/modulejs.js';

    console.log(modulejs.csp);
    console.log(modulejs.fun1());
</script>