es6常用语法
一、let和const申明变量和常量:
//作用域只限于当前代码块
//使用let申明的变量作用域不会提升
//在相同的作用域下不能申明相同的变量
//for循环体现let的父子作用域
如下示例可以看出let的优势:
二、es6的解构赋值:一一对应
数组:
let [name, age, sex] = ["Samve", 30, "men"];
console.log(name);
console.log(age);
console.log(sex);
对象:
let {name, age, sex} = {name: "张三" , age: 30, sex: "men"};
console.log(name);
console.log(age);
console.log(sex);
字符:
let [a, b, c, d, e] = "我是中国人!";
console.log(a);
console.log(b);
console.log(c);
console.log(d);
console.log(e);
三、Spread Operator 展开运算符:
ES6中另外一个好玩的特性就是Spread Operator 也是三个点儿...接下来就展示一下它的用途。
组装对象或者数组
有时候我们想获取数组或者对象除了前几项或者除了某几项的其他项
对于 Object 而言,还可以用于组合成新的 Object 。(ES2017 stage-2 proposal) 当然如果有重复的属性名,右边覆盖左边
四、面向对象Class:
构造函数的另一种写法,作用在于对象原型的写法更加清晰,更加面向对象的编程方式
五、字符串扩展:
1、模板字符串:
2、endsWith():
3、startsWith():
4、includes():
5、repeat():
六、对象扩展:
1、Object.assign()这个方法来实现浅复制:
Object.assign() 可以把任意多个源对象自身可枚举的属性拷贝给目标对象,然后返回目标对象。第一参数即为目标对象。在实际项目中,我们为了不改变源对象。一般会把目标对象传为{}
2、Object.is():判断两个值是否相等
3、Object.keys():
4、Object.values():
5、Object.entries():
6、对象中使用变量作为key:
七、对象初始化简写:
ES5我们对于对象都是以键值对的形式书写,是有可能出现键值对重名的。例如:
键值对重名,ES6可以简写如下:
同样,key和value一样的,写一个就够了:
ES6 同样改进了为对象字面量方法赋值的语法。ES5为对象添加方法:
ES6通过省略冒号与 function 关键字,将这个语法变得更简洁
八、箭头函数:
箭头函数最直观的三个特点。
不需要 function 关键字来创建函数
省略 return 关键字
继承当前上下文的 this 关键字
this指向的固定化,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,导致内部的this就是外层代码块的this。正是因为它没有this,所以也就不能用作构造函数。
说个小细节。
当你的函数有且仅有一个参数的时候,是可以省略掉括号的。当你函数返回有且仅有一个表达式的时候可以省略{} 和 return;例如:
作为参考
九、函数默认参数:
在ES5我们给函数定义参数默认值是怎么样?
但细心观察的同学们肯定会发现,num传入为0的时候就是false,但是我们实际的需求就是要拿到num = 0,此时num = 200 明显与我们的实际想要的效果明显不一样。
ES6为参数提供了默认值。在定义函数时便初始化了这个参数,以便在参数没有被传递进去时使用。
十、import 和 export:
import导入模块、export导出模块
总结:
十一、数组扩展:
使用console.dir(Array)和console.dir(Array.prototype)查看es6中新增的属性的方法,比较常用的有:
1、Array.from()方法就是将一个类数组对象或者可遍历对象转换成一个真正的数组:
那么什么是类数组对象呢?所谓类数组对象,最基本的要求就是具有length属性的对象。
1)将类数组对象转换为真正数组:
那么,如果将上面代码中length属性去掉呢?实践证明,答案会是一个长度为0的空数组。
这里将代码再改一下,就是具有length属性,但是对象的属性名不再是数字类型的,而是其他字符串型的,代码如下:
会发现结果是长度为4,元素均为undefined的数组
由此可见,要将一个类数组对象转换为一个真正的数组,必须具备以下条件:
a、 该类数组对象必须具有length属性,用于指定数组的长度。如果没有length属性,那么转换后的数组是一个空数组;
b、该类数组对象的属性名必须为数值型或字符串型的数字。
ps: 该类数组对象的属性名可以加引号,也可以不加引号。
2)将Set结构的数据转换为真正的数组:
Array.from还可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组。如下:
3)将字符串转换为数组:
4)Array.from参数是一个真正的数组:
像这种情况,Array.from会返回一个一模一样的新数组。
2、Array.of():
把一组织转换成数组。
3、arr.find()与arr.findInex():
arr.find():找出第一个符合条件的数组成员,如果没有找到则返回undefined。
arr.findIndex():找到位置,没有则返回-1。
4、.map():
5、.reduce():
6、.filter():
7、forEach():
8、.copyWithin:
9、every():
10、some():
11、map():
12、filter():
13、reduce():
14、reduceRight():
15、forEach():
16、find():
17、findIndex():
18、includes():
19、keys():
20、values():
21、entries():