教你快速搞定ES6

2023-01-28 0 938

ES6

ECMAScript 6(ES6) 现阶段基本上正式成为业内国际标准,它的普及化速率比 ES5 要快许多,主要就其原因是当代应用程序对 ES6 的全力支持十分快速,特别是 Chrome 和 Firefox 应用程序,早已全力支持 ES6 中大多数的优点。

教你快速搞定ES6

上面逐个为我们简述常见的ES6新优点:

let/const

let和const斯坎索普归纳是不那样的表达式新闻稿。

let

let则表示新闻稿局部表达式,相对于以后的var新闻稿,主要就有下列两个差别:

1.不存有表达式提高

教你快速搞定ES6

2.存有短暂性死区,预校对时无法被出访

3.不容许多次重复新闻稿,同一个返回值内根本无法新闻稿一场

教你快速搞定ES6

4.存有块级返回值,,返回值以外无法出访里头新闻稿的表达式(块级返回值:如果存有花括弧是块级返回值)

教你快速搞定ES6

const

const新闻稿自变量,其采用准则除新闻稿后无法修正以外,其它优点和let那样,除此之外const 在新闻稿时要被表达式。

教你快速搞定ES6

ES6字符串方法

includes()

判断字符串中,是否包含某个字符

教你快速搞定ES6

startsWith()

字符串是否以某个字符开头

教你快速搞定ES6

endsWith()

字符串是否以某个字符结束

教你快速搞定ES6

for of遍历

教你快速搞定ES6

注意:for of 无法遍历对象

字符串拼接模板

字符串采用反引号“,表达式采用${}。

教你快速搞定ES6

注意:常规拼接不全力支持换行,ES6的拼接全力支持。

箭头函数(Arrow Functions)

ES6 中,箭头函数是函数的一种简写形式,采用括弧包裹参数,跟随一个 =>,紧接着是函数体。

箭头函数最直观的三个特点:

不需要 function 关键字来创建函数省略 return 关键字箭头函数中this没有明确指向,会向上一级(宿主对象)寻找
教你快速搞定ES6

注意:

当你的函数有且仅有一个参数的时候,是可以省略掉括弧的。

当你的没有参数的函数应该写成一对圆括弧()。

当你函数返回有且仅有一个表达式的时候可以省略{} 和 return;

解构表达式

将值从数组或属性从对象提取到不同的表达式中

教你快速搞定ES6
教你快速搞定ES6
教你快速搞定ES6
教你快速搞定ES6

还可以这么用:

教你快速搞定ES6

对象中的方法:

教你快速搞定ES6

Symbol类型

symbol类型是ES6中新增的原始数据类型,则表示独一无二的值。

新闻稿方法:let id = Symbol();

教你快速搞定ES6

注意点:

1、symbol值无法进行隐式转换,因此它与其它类型的值进行运算会报错。

2、symbol值可显示地转化成字符串

教你快速搞定ES6

3、可以转化成Boolen,但无法转成数值

教你快速搞定ES6

set对象

ES6提供了新的数据结构Set,Set对象不是数组, 可以用来保存对象或者基本上类型, 所有保存的值都是唯一的(也是可以去除多次重复值),因此我们可以利用这一唯一优点进行数组的去重工作。

教你快速搞定ES6

属性

setObj.size 返回Set对象的值的个数

方法

setObj.add(value) 在Set对象尾部添加一个元素。返回该Set对象。

setObj.clear() 移除Set对象内的所有元素。

setObj.delete(value) 移除Set的中与这个值相等的元素

setObj.has(value) 返回一个布尔值,则表示该值在Set中存有与否。

setObj.forEach(v=>{console.log(v)}) 遍历,按照插入顺序,为Set对象中的每一个值调用一场callBackFn。

注意:在向set加入值时候,set不会转换数据类型。

Map集合,即映射

Map 是 ES6 中新增的数据结构,Map 类似于对象,但普通对象的 key 要是字符串或者数字,而 Map 的 key 可以是任何数据类型。

教你快速搞定ES6

bind方法

函数.bind(新的this指向,实参1,实参2)

促进作用:

1 返回一个新的函数

2 改变新函数中this的指向,this指向bind的第一个参数 let fn1 = fn.bind(obj);

教你快速搞定ES6
教你快速搞定ES6

class的写法与继承

在ES6中新增加了类的概念,可以采用 class 关键字新闻稿一个类,该关键字的出现使得其在对象写法上更加清晰,更像是一种面向对象的语言。不过,ES6的class不是新的对象继承模型,它只是原型链的语法糖表现形式。

constructor方法是类的构造函数的默认方法,通过new命令生成对象实例时,自动调用该方法。

教你快速搞定ES6

extends 子类继承父类,拥有父类所有的属性和方法 新闻稿B类,继承了A类,new B 同时就new A

教你快速搞定ES6

更多前端教程,都在浠浠呀老师的前端必修入门课!

点击上方卡面,即可观看:

这里有全套学习资料包(教程+源码+学习笔记+工具+课件+面试题解析)免费领取,

还有大牛讲师在线答疑免费辅导!

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务