![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
ES6
文章平均质量分 68
DreamFive
这个作者很懒,什么都没留下…
展开
-
第一节、ES6的开发环境搭建
学习接下来的一系列内容的前置条件:学习es6的前置只是需要掌握es5的基本语法掌握node.js的基本知识(最起码会使用npm下载安装yi'la)这节主要是使用Bable把ES6编译成ES5。当前主流的前端框架都已经开始使用ES6的语法知识,掌握ES6,将有助于我们的项目开发,最主要的是它会是我们前端路上必须掌握的一门技能。首先,先建立工程目录(我使用的是webstor原创 2018-01-22 16:30:22 · 690 阅读 · 0 评论 -
第十六节、模块化操作
在ES5中我们要进行模块华操作需要引入第三方类库,随着前后端分离,前端的业务日渐复杂,ES6为我们增加了模块话操作。模块化操作主要包括两个方面。export :负责进行模块化,也是模块的输出。import:负责八模块引入,也是模块的引入操作。export的用法export 可以让我们把变量、函数、对象进行模块化,提供外部调用接口,让外部进行引用。先来看个最简单的例子,把一个变量模...原创 2018-04-10 22:31:21 · 210 阅读 · 0 评论 -
第十五节、class 类的使用
我们在ES5中经常使用方法或者对象去模拟类的使用,虽然可以实现功能,但是代码并不优雅,ES6为我们提供了类的使用。需要注意的是我们在写类的时候和ES5中的对象和构造函数要区分开来,不要学混了。类的声明先声明一个最简单的coder类,类里只有一个name方法,方法中打印出传递的参数。class Coder{ name(val){ console.log(val...原创 2018-04-10 22:21:14 · 168 阅读 · 0 评论 -
第十四节、promise 对象的使用
ES6中的promise的出现给我们很好的解决了回调地狱的问题,在使用ES5的时候,在多层嵌套回调时,写完的代码层次过多,很难进行维护和二次开发,ES6认识到了这点问题,现在promise的使用,完美解决了这个问题。那我们如何理解promise这个单词在ES5中的作用那,你可以想象他是一种承诺,当它成功时执行一些代码,当它失败时执行一些代码。它更符合人类的行为思考习惯,而不在是晦涩难懂的冰冷语言。...原创 2018-04-10 22:04:12 · 152 阅读 · 0 评论 -
第十三节、用 Proxy 进行预处理
相信大家对钩子函数会有一定的了解,这里简单解释一下什么是钩子函数。当我们在操作一个对象或者方法时会有几种动作,比如:在运行函数前初始化一些数据,在改变对象值后做一些善后处理。这些都算钩子函数,Proxy 的存在就可以让我们给函数加上这样的钩子函数,你也可以理解为在执行方法前预处理一些代码。你可以简单的理解为他是函数或者对象的生命周期。Proxy的应用可以使函数更加强大,业务逻辑更加清楚,而且在...原创 2018-04-10 15:35:35 · 214 阅读 · 0 评论 -
第十二节、map 数据结构
在一些构建工具中是非常喜欢使用map这种数据结构来进行配置的,因为map是一种灵活,简单的适合一对一查找的数据结构。我们知道的数据结构,已经有了json和set。那map有什么特点。Json 和 map 格式的对比map 的效率和灵活性更好let json = { name:'angle', skill:'web'}console.log(json.name);...原创 2018-04-10 14:43:07 · 204 阅读 · 0 评论 -
第十一节、Set 和 WeakSet 数据结构
这节学习Set数据结构,注意这里不是数据类型,而是数据结构。它是ES6中新的东西,并且很有用处。Set的数据结构是以数组的形式构建的。Set 声明let arr=new Set(['晴天','sun','绿树','束缚','sun']);console.log(arr); //{"晴天", "sun", "绿树", "束缚"}Set 和 Array 的区别是 Set 不允许内部有重复...原创 2018-04-10 10:35:57 · 179 阅读 · 0 评论 -
第十节、Symbol 在对象中的作用
我们通过场景应用的方式学习Symbol,它的意思是全局标记。我们先看看它的声明方式。声明 Symbol我们先来回顾一下我们的数据类型,在最后在看看Symbol如何声明,并进行一个数据类型的判断。var a = new String;var b = new Number;var c = new Boolean;var d = new Array;var e = new Obj...原创 2018-04-09 22:54:59 · 397 阅读 · 0 评论 -
第九节、ES6 中对象
对象对于Javascript是非常重要的。在ES6中对象有了很多新特性,对象赋值ES6允许把声明的变量直接赋值给对象,我们看下面的例子。let name = "angle";let skill = 'web';var obj = {name,skill};console.log(obj); //Object {name: "angle", skill: "web"}...原创 2018-04-09 22:11:48 · 152 阅读 · 0 评论 -
第八节、ES6 中的函数和数组补漏
对象的函数解构我们在进行前后端分离时,后端经常返回 JSON 格式的数据,前端的美好愿望是直接把这个 JSON 格式数据当作参数,传递到函数内部进行处理。ES6 就提供这样的解构赋值。let json = { a:'sunshine', b:'那天'}function fun({a,b='faraway'}){ console.log(a,b);}fun...原创 2018-04-09 17:04:56 · 165 阅读 · 0 评论 -
第七节、ES6 中的箭头函数和扩展
回顾一下ES5中的函数写法。写一个函数,进行一个加法计算。function add(a,b){ return a+b;}console.log(add(1,2));我们声明了一个add函数,然后传入a和b两个值,返回a+b的值。 然后我们在控制台打印了这个函数的返回结果,这里是3.默认值在ES6中给我们增加了默认值的操作,我们修改上边的代码,可以看到现在只需要传递一...原创 2018-04-09 15:41:47 · 187 阅读 · 0 评论 -
第六节、ES6 中新增的数组知识
JSON 数组格式转换JOSN 的数组格式就是为了前端快速的把 JSON 转换成数组的一种格式,我们先来看一下 JSON 的数组格式怎么写。let json = { '0':'挑花', '1':'晴天', '2':'夏明', length:3}这就是一个标准的JSON数组格式,跟普通的JSON对比是在最后多了一个length属性。只要是这种特殊的j...原创 2018-04-09 14:42:34 · 171 阅读 · 0 评论 -
第六节、ES6数字操作
二进制和八进制二进制和八进制数字的声明并不是ES6的特性,我们只是做一个常识性的回顾,因为很多新人小伙伴会把他们当成字符串或者不知道是什么,所以这算是赠送的知识点。二进制声明:二进制的英文单词是Binary,二进制的开始是0(零),然后第二个位置是b(注意这里大小写都可以实现),然后跟上二进制的值就可以了。//二进制声明let a = 0B0101;console.log(a);//5八进制声...原创 2018-01-24 10:52:27 · 329 阅读 · 0 评论 -
第五节、字符串模板
字符串模板让我们再也不用拼接变量了,而且支持在模板里有简单计算操作。字符串模版先来看一个在ES5下我们的字符串拼接案例:let bgColor='red';let divColor = '当前div背景颜色是'+bgColor+'';console.log(divColor); //当前div背景颜色是redES5下必须用+jspang+这样的形式进行拼接,这样原创 2018-01-24 10:23:51 · 260 阅读 · 0 评论 -
第四节、rest运算符和扩展运算符
扩展运算符和rest运算符,它们都是 … 。就是三个点、三个点、三个点,不是省略号。rest运算符ES6 引入 rest 参数(形式为...变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。如果你已经很好的掌握了对象扩展运算符,那么理解rest运算符并不困难,它们有很多相似之原创 2018-01-23 19:42:10 · 542 阅读 · 0 评论 -
第三节、变量的解构赋值
ES6允许按照一定的模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。数组的解构赋值: 简单的数组解构: 以前,为变量赋值,我们只能直接指定值。比如下面的代码:let a=0;let b=1;let c=2; 而现在我们可以用数组解构的方式来进行赋值。let [a,b,c]=[1,2,3]; 数组模式和赋值模式统一: 可以简单的理解为等号左边和等号右边的形式要统一,如果不统一解构将失败...原创 2018-01-23 19:17:41 · 203 阅读 · 0 评论 -
第二节、新的声明方式
字面理解ES6的三种声明方式:var:它是variable的简写,可以理解成变量的意思。let:它在英文中是“让”的意思,也可以理解为一种声明的意思。const:它在英文中也是常量的意思,在ES6也是用来声明常量的,常量你可以简单理解为不变的量。var声明:这个声明大家都用过,但是这里要说的是var在ES6里是用来升级全局变量的,我们可以先作一个最简单的实例,用va原创 2018-01-22 16:53:49 · 182 阅读 · 0 评论 -
JavaScript 中的内置对象
目录标准内置对象的分类下面将细分内置对象来进行整理Array属性方法ArrayBuffer属性方法Boolean属性方法Date属性方法这里介绍所有的 JavaScript 标准的内置对象,以及他们的方法和属性。全局的对象(global objects)或标准内置对象,不要和全局对象(global object) 混淆。...原创 2018-05-02 15:20:42 · 377 阅读 · 0 评论