[Node.js] ES6新语法

概括图

下载地址

xmind地址

 

const关键字

const关键字声明常量的(一旦声明就无法更改) a:没有变量提升b:有块级作用域c:不能重复声明d:不能重新赋值e.声明必须要初始化值

使用场景: a.一些不会变化的值，比如圆周率PI b.大事件项目中,保存基地址的就可以用常量.

a.没有变量提升

//a.没有变量提升 console.log(num); //报错了 const num = 100 ;

 

b:有块级作用域

//b.有块级作用域 { const num = 200; } console.log (num); //报错了

 

c:不能重复声明

//c.不能重复声明 const num = 300; const num = 400;//报错了 console . log(num);

  d:不能重新赋值

//d.声明必须要初始化值 const num;//报错了 console.log (num);

  e.声明必须要初始化值

//e.不能重新赋值 const num = 10; num = 20;//报错了 console . log(num);

 

let关键字

区别varlet变量提升有无作用域函数作用域块级作用域重复声明有无重新赋值有有

a.没有变量提升

//a.没有变量提升 console.log(age);//报错了 let age = 38;

  b.有块级作用域

//b.有块级作用域 for(let i = 0; i<10; i++){ } console .log(i);//报错了

  c.不能重复声明

//c.不能重复声明 let num = 10; let num = 20;//报错了 console. log (num);

  d.可以重新赋值

//d.可以重新赋值 let num1 = 10; num1 = 20; console. log (num1);

   

对象解构赋值

取对象中属性的值，赋值给变量. 对象的赋值没有顺序

//声明一个对象 let obj={ name: "波波", age: 38, gender:"男", score: 100, }; let {name :name1, age : age1, gender : gender1, score :score1} = obj; console.log(name1 , age1 , gender1, score1)

   

箭头函数

匿名函数的一个简写

简写规则:

a. function 改成=> = >可以读成goestob.如果只有一个形参，那就可以省略形参小括号.c.如果不是一个形参，0个或者多个形参， 那就不能省略这个形参小括号了d.如果函数体只有一句话,那就可以省略函数体的大括号e.如果函数体只有一句话, 并且这一句话是return 返回值,那return也要省略.f.如果函数体不是一句话， 那就不能省略这个大括号. b.如果只有一个形参，那就可以省略形参小括号.d.如果函数体只有一句话,那就可以省略函数体的大括号 let fn = function(name){ console. log( '我的名字是' +name ); } fn('111') 箭头函数 let fn = name => console. log('我的名字是' +name) fn('111') c.如果不是一个形参，0个或者多个形参， 那就不能省略这个形参小括号了 let fn = function(name,age){ console. log( '我的名字是' +name ,'我的年龄是' + age); } fn('111',11) 箭头函数 let fn = (name,age) => console. log('我的名字是' +name,'我的年龄是' + age) fn('111',11) e.如果函数体只有一句话, 并且这一句话是return 返回值,那return也要省略 let fn4 = function(age) { return age + 10; } //箭头函数 let fn4 = age => age+10; fn4(38); f.如果函数体不是一句话， 那就不能省略这个大括号. let fn2 = function (num1,num2) { console.log(num1+num2) return num1+num2+30 } let fn2 = (num1,num2) => { console.log(num1+num2) return num1+num2+30 } console.log(fn2(1, 2));

   

对象成员简写

对象里面有name,age，gender.score属性 希望这些属性的值是上面对应变量的值，

//声明了一些变量 let name='千里'; let age = 18; let gender = '男'; let score = 100; var obj={ name , age, gender, // fenshu,//相当于fenshu:fenshu,报错了，因为外面没有fengshu这个变量. fenshu:score,//这里就不会报错，取外面score变量的值赋值给这个fengshu属性 score, sayHi() { console.log('哈哈，你好') } } console.log(obj); obj.sayHi();

   

对象展开

...

//声明一个对象 let chinese = { skin:'黄色皮肤', hair: '黑色头发', sayHi(){ console.log('你好,你吃了吗?'); } } //声明一个对象 let zhuBo = { skill: '跳唱rap打篮球,老铁双击666', song: '唱大碗宽面' } //声明一个对象 let linge = { // skin:'黄色皮肤', // hair: '黑色头发', // sayHi(){ // console.log('你好,你吃了吗?'); // }, // skill: '跳唱rap打篮球,老铁双击666', // song: '唱大碗宽面' ...chinese, ...zhuBo, gender:'男', hair: '白发苍苍'//重新给hair这个属性赋值，会覆盖原来的值. } console.log(linge);

   

数组展开

使用场景: a.数组拼接 b.利用Math. max( )/Math. min()来求数组中的最大值/最小值.

//求数组中的最大值. let arr1 = [10, 8,7, 66,65,34]; //以前的做法 // let max1 = Math. max.apply(Math,arr1); // console.log(max1);//66 //数据展开语法 let max2 = Math. max(... arr1); console.log(max2);//66

   

数据类型Set

作用和数组类似，和数组不同的是:他不能存放重复的元素 应用场景:数组去重.

let set1 = new Set([10,20, 30, 40,10, 20,30,50]); let arr1 = [10, 20,30 , 40, 10,20,30 , 50]; let arrNew=[...new Set(arr1)];//这句话就是把arr1去重，得到一个新的数组arrNew console.log(arrNew) ;//[10, 20，30， 40, 50 ]

   

模板字符串

会保留原样字符串格式,以及可以占位。

let name = '千里'; let age = 38; let score = 100; console. log(`我的名字是${name},我的年龄是${age}，我的成绩是${score}`);//我的名字是千里,我的年龄是38，我的成绩是100

   

补充:数组方法

forEach();

遍历数组，把遍历出来的每一项交给回调函数. 方法没有返回值

let arr = [10, 20,30, 40]; arr.forEach(function( item, index) { //item就是遍历出来的每一个项 //index就是遍历出来每-项对应的索引. // console. log(item, index); console.log(item + 10); });

 

map()

遍历数组的，有返回值.

let arr = [10, 20, 30 , 40]; let arrNew = arr.map(function( item, index) { //item就是遍历出来的每一项 //ipdex就是遍历出来的每一项对应的索引 // console.log(item, index); return item*item }); console.log(arrNew);//[ 100, 400, 900, 1600 ]

 

filter(); 过滤器

filter()方法会返回一个新的数组，新的数组中的元素是通过检查后符合条件的元素.

let arr=[10,20,11,23,45,67,88] let arrNew = arr.filter((item,index)=>{ //item就是遍历出来的每一项 //index遍历出来的每一项对应的索引 // console . log (item, index); return item % 2 == 0如果条件成立,会返回当前项，如果条件不成立,不会返回当前项 }) console.log(arrNew);//[ 10, 20, 88 ]

   

补充:babel

ES5和ES6的转换