ES5，ES6常用方法及语法糖合辑

1.参数默认值

function multiply(a=5,b=1){
    return a*b;
}

multiply(1); //1
multiply(1,5); //5
multiply(,1); //error
multiply(undifined,1);//1

2.模板字符串

let age=1,name="张三";

//采用``定义模板字符串，利用${}引用变量/函数
say=`我叫${name},今年${age*5}岁了`;//"我叫张三,今年5岁了"

//双重嵌套版本
`<ul>
    ${
        a.map(
            thisA=> `<div>${thisA}</div>`
        )
    }
</ul>`
//"<ul><div>999</div>,<div>998</div>,<div>997</div></ul>"

标签模板字符串

let name="张三",age="十八岁";

//定义标签函数
function highLight(strings,...argument){
    let str="";
    let newMap=argument.map(value=>{
         return value.big();
    });
    
    strings.forEach((value,i)=>{
        str+=`${value}${newMap[i]||""}`
    })
    return str;
}

//调用标签模板字符串
document.body.innerHTML=highLight`${name}今年${age}了`

trim()去除前后空格

let aaa="         ??   "
aaa.trim(); //"??"
aaa.trimLeft();"         ??"
aaa.trimRight();"??   "

join()在数组中添加分隔符来返回字符串

let a=[1,2,3,4];
a.join;//"1,2,3,4"
a.join("/");// "1/2/3/4"
a.join("");// "1234"

在网页上测试js生成的html

document.body.innerHTML="<h1>hello</h1>"

简单的字符串校验

const text="This is a text";

//查询开头和结尾是否为某字符串
text.startsWith("This");//true
text.startsWith("this");//false(大小写敏感)
text.endsWith("text");//true(敏感)
//查询是否包含某字符串
text.includes("This");//true(敏感)
//查询第n位之后是否包含某字符串
text.includes("This",10);//false

重复字符串

"哈".repeat(9);//"哈哈哈哈哈哈哈哈哈"

对象解构

//声明Tom对象
const Tom={
    name:"Tom Jone",
    age:21,
    hobby:{
        first:"play",
        second:"sleep"
    }
}
//解构
let {name,age}=Tom;
console.log(name);//Tom Jone

//解构并重命名
let {first:f,second}=Tom.hobby;
console.log(f);//play

//解构并附默认值
let {first,second,third="其他就没了"}=Tom.hobby;
console.log(third);//其他就没了

//利用对象解构交换变量
[Tom.name,Tom.age]=[Tom.age,Tom.name]

数组解构

const num=[99,98,97,96,95];
//对象用{}，数组用[](数组解构同样支持默认参数)
let [one,two]=num;
console.log(one);//99
console.log(two);//98
//跳过一些
let [,,three]=num;
console.log(three);//97
//剩余参数
let [first,...other]=num;
console.log(other);//[ 98, 97, 96, 95 ]

set简单用法

//Set是一种集合结构，其所存储的值不能重复
let set=new Set();//创建
set.clear();//清空
set.add("666");//新增
set.add("777");
set.add("888");
set.delete("666");//删除
set.has("666");//检索
set.has("777");

//遍历方法
for(item of set){
    console.log(item);
}

set去重

let a=[1,3,2,4,3,1];
let set=Array.from(new Set(a));

map简单用法

//Map字典结构与Set类似，都不能存储重复值，不同的是，Map存入的是键值对
let map=new Map();
map.set("name","张三");//增
map.set("age",18);
map.set("age","十八");//重复值会覆盖前者

map.delete("age");//删
map.has("name");//查询
map.get("name");//获得值

map.clear();//清空

//遍历方法
for([a,b] of map){
    console.log(a,b);
}

promise对象

let promise=new Promise(function(resolve,reject){
    setTimeout(()=>{
        console.log("任务执行完成");
        resolve();
    },3000);
});
promise.then((success)=>{
  console.log("ok");
})

class关键字

class Person{
    constructor(name,age){
        this.name=name;
        this.age=age;
    }
    say(){
        console.log("我的名字是"+this.name);
    }
}

利用class进行继承

class Student extends Person{
    constructor(name,age,subject){
        super(name,age);
        this.subject=subject;
    }
    teach(){
        console.log("我学习"+this.subject)
    }
}

array.form方法

//将类数组转化为数组
let a=[1,3,2,4,3,1];
let set=Array.from(new Set(a));
//将字符串转化为数组
let str="hello world";
let newStr=Array.from(str);

扩展运算符（...）

let a=[1,2,3];
let b=[3,4,5];
//使用拓展运算符进行连接
console.log([...a,999,...b]);//[ 1, 2, 3, 999, 3, 4, 5 ]
//使用扩展运算符作为参数

let attr=["name","age"];
array.push(...attr);

promise对象

//基本写法
return Promise(function(resolve,reject){})
//取最先完成
Promise.race([promise1,promise2])//返回先完成的promise对象
//全部完成回调
Promise.all(promise1,promise2])//返回promise对象数组

可动态计算的属性名

//直接使用[]拼接字符串或变量
let i='aaa',j='bbb';
let obj={
    [i+j]:999,
}
//打印obj为{aaabbb:999}

导入导出模块

//导出
export{
    varA,varB,funcA
};
//导入
import {varA,varB,funcA} from "xxx.js"