一、变量定义
let
:定义变量,但不能像var一样,var可以通过window.a进行访问,let不行。var如果定义的变量名相同,则会覆盖原先的值,但let不能定义相同名称的变量。let定义的变量是有作用域的。
const
:静态变量,即常量,声明的时候必须赋值。后续无法修改。
二、字符串拼接
格式:
${拼接你想要的内容}
let str=’Hello’;
let a=’world’;
console.log(`${str}哈哈${a}`);
//字符拼接结果是:Hello哈哈world
三、解构赋值
- 对象:
var obj={ nameA : '123'; nameB : '456'; } var {nameA , nameB:NAMEB , nameC='aaa'} =obj; console.log(nameA,NAMEB);//对nameB设置别名NAMEB,则nameB单纯作为匹配值,真正值存在NAMEB上 //对obj对象进行解构,可以按变量名提取出中间的同名的变量,如果没有提取到的按所给的默认值命名
- 数组:
var arr = [, 2 , 3 , 4 , 5 ]; var [a='123' ,b] = arr; console.log(a,b); //按照解构的变量顺序匹配数组的下标,a对应arr[0],由于为空则为默认值123 b对应下标arr[1],值为2
- 数组对象:
var arr=[ { name:"chen", sex:'girl' }, { name:'CHEN', sex:'boy' } ] var [ {sex} , {sex : sex1} ]=arr; console.log(sex,sex1); //查找查找同一属性时,后续的属性需要加一个别名进行区分,也可以写作 var{ 0 : {sex} , 1 : {sex : sex1} } = arr;
- 函数:
var obj = { a:1 , b:2 , c:3 } function test({a,b,c}){ console.log(a); } test(obj);
四、Promise异步回调
Promise
:作为声明异步的构造函数,能够通过new Promise() 得到一个 Promise 的实例,在 Promise 上,有两个函数,分别叫做resolve
(成功之后的回调函数) 和 reject
(失败之后的回调函数)
- 定义
var flag = true;
var pro = new Promise(function(resolve , reject){
if(flag){
resolve("成功完成时返回的消息");
}
else{
reject("失败完成时返回的消息");
}
})
- 使用
pro.then(function(res){
//.then()接收resolve抛出的消息,即res="成功完成时返回的消息"
console.log(res);
}).catch(function(err){
//.catch()接收reject抛出的消息,即err="失败完成时返回的消息"
console.log(err);
}).finally(function(msg){
//.finally()是.then()/.catch()执行完之后最后再执行的步骤
console.log("最后的执行操作");
})//一直回调方法,这个弊端称为回调地狱
五、async 和 await (异步等待)
解决了异步回调中function外部无法获取的Promise最终返回的值,使步骤脱离回调,可以在外部获取Promise的返回值继续去做操作。
async function fun(){//function前加上async表示这个函数为异步操作的函数
//async和await必须结合使用
try{
var res = await pro ;//await表示等待异步操作pro返回的最终结果
console.log(res);//得到的res="成功完成时返回的消息"
}catch(err){
//如果在此过程中发生错误,则抛出错误
throw(err);
}
}
//调用异步函数
fun();
六、箭头函数
箭头函数为优化函数传参形式,当不传参时可以写( )或 _ 来代替
在普通函数中,可以通过arguments
来一次性接收所有传入的形参、存在专属this指针
function fn1(){
console.log(arguments);
}
fu1(1,2,'a','66');
//则arguments则为(1,2,'a','66'),且可以通过下标访问,arguments[0]=1
//箭头函数不设置传参时
var fn2 = _ =>{
alert("!!!");
}//或
var fn2 = () =>{
alert("!!!");//如果函数体只有一句时也可以不写外层的大括号
}
fn2();
//传参时
var fn2 = (a,b) =>{
alert("!!!");//如果函数体只有一句时也可以不写外层的大括号
}
fn2("1","2");
//在箭头函数内没有arguments这个参数对象、没有专属this指针,所以无法作为构造函数
//箭头函数内如果有this指针(这个指针不是箭头函数的),这个指针是父级环境的this
var obj = {
fn1: function(){
console.log(this);
},
fn2:()=>{
console.log(this);
}
}
obj.fn1();//输出obj
obj.fn2();//输出的是obj的父级环境,即window