文档章节

ES6——已经普及的前端未来

wlc534
 wlc534
发布于 2017/09/12 10:18
字数 880
阅读 11
收藏 0
点赞 0
评论 0

ES6——已经普及的前端未来

        ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在2015年6月正式发布了。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。

        Node 是 JavaScript 的服务器运行环境(runtime)。它对 ES6 的支持度最高。除了那些默认打开的功能,还有一些语法功能已经实现了,但是默认没有打开。使用下面的命令,可以查看 Node 已经实现的 ES6 特性。

  1. $ node --v8-options | grep harmony

复制代码

上面命令的输出结果,会因为版本的不同而有所不同。

        现今网上主要流传且大家耳熟能详地代码片段和书籍中,大多都还是基于ES5所构建的前端工程代码,并不是说ES5已经可以被淘汰,但是可以看到,在各大公司招聘前端工程师时,已然悄悄加上一个默认的前提:“熟悉ES6特性和规范”,也就是说,企业级JS开发风暴早已席卷中国互联网行业。

        但是,从ES5到ES6,飞跃的不是一星半点儿,为了让ES5前端经验为主的人对ES6规范和特性有更好的理解,我在这里推荐一个前端转码器:Babel。Babel 是一个广泛使用的 ES6 转码器,可以将 ES6 代码转为 ES5 代码,从而在现有环境执行。这意味着,你可以用 ES6 的方式编写程序,又不用担心现有环境是否支持。下面是一个例子。

 

        配置babel的编译环境不仅需要babel相关js库文件,还需要额外在工程目录下配置一个.babelrc文件,这是babel的默认配置文件,用以设计转码规则和插件

 

        当然,babel还支持命令行方式来对所需编译文件进行转码,需额外安装babel-cli工具

        然后让我们来看看在ES6中更新的新特性有哪些在实际生产过程中已经被广泛应用:

1) 箭头操作符(lambda模式)

以下面为例:

 

2) 类的支持
JS本身就是面向对象的,ES6中提供的类实际上只是JS原型模式的包装。

 

3) 增强的对象字面量

l  可以在对象字面量里面定义原型

l  定义方法可以不用function关键字

l  直接调用父类方法

4) 字符串模板

 

5) 解构——自动解析数组或对象中的值

 

6) let与const关键字、for of值遍历以及Math、Number、String、Object的API新增

7) module的支持

 

8)Proxy

Proxy可以监听对象身上发生了什么事情,并在这些事情发生后执行一些相应的操作

9)Promise

Promises是处理异步操作的一种模式,之前在很多三方库中有实现,比如jQuery的deferred 对象。当你发起一个异步请求,并绑定了.when(), .done()等事件处理程序时,其实就是在应用promise模式。

 

        当然,这里只是对ES6的一部分涉及和基本例子吗,在实际前端开发过程中,ES6的特性还会发挥的淋漓尽致,即前端项目的工程化,期待有接触的前辈和小伙伴们能和我分享更多前端的知识和经验技巧。

© 著作权归作者所有

共有 人打赏支持
wlc534
粉丝 4
博文 31
码字总数 33237
作品 0
张成文——ECMAScript 6 开发体系实践

2016年04月23日14:00時,在武汉市东湖高新技术开发区民院路38号纽宾凯鲁广国际酒店(光谷步行街地铁C出口省测绘局斜对面),舉行的规模在800人左右的2016源创会武汉站。由张成文(腾讯SNG web)分...

yunwangjun ⋅ 2016/04/24 ⋅ 1

此生无悔入 TypeScript

↑ 编者按:本文由phodal公众号授权奇舞周刊转载。 想来,我已经用 TypeScript 已经有一段时间了,它可以算得上是前端领域的一门 “平淡生活” 的语言。 平淡生活,我的意思是:生活可以从此...

奇舞周刊 ⋅ 04/26 ⋅ 0

【探秘ES6】系列专栏(一):ES6简介

ES6作为新一代JavaScript标准,即将与广大前端开发者见面。为了让大家对ES6的诸多新特性有更深入的了解,Mozilla Web开发者博客推出了《ES6 In Depth》系列文章。CSDN已获授权,将持续对该系...

一配 ⋅ 2015/10/22 ⋅ 0

人在西邮 | 有一份前端需求等你签收

最近做了很多事情,忙得没时间写技术博客。 最值得回忆的,当然是 CreatShare 互联网实验室周年纳新活动。在十一号晚上的宣讲会上,我用生动的比喻,分享了《 漫话 JavaScript 奇异世界 》并...

韩亦乐 ⋅ 2017/10/22 ⋅ 0

如何提高前端工程师的开发效率?

  前端工程师其实是一个工作很杂的职位,除了要负责切图、写html/css/js外,还要处理一系列的浏览器兼容性问题、优化网页性能等,所以提高前端工程师的开发效率是势在必行的,也是前端共工...

Web前端开发 ⋅ 2017/06/01 ⋅ 0

【GitChat】精选——JavaScript进阶指南

GitChat 是一款基于微信平台的 IT 阅读/写作互动产品。我们的目的是通过这款产品改变 IT 知识的学习方式,让专业读者获得自主选择权,让知识分享者获得收益。 关于GitChat 你想知道的都在这里...

blogdevteam ⋅ 2017/11/24 ⋅ 0

从发展历史理解 ES6 Module

在很长一段时间内, ES6 带来了 JavaScript 最大的变化,包括管理大型、复杂代码库的一些新特性。这些特性,主要是 import 和 export 关键词,共同被称为 modules。 如果你现在还是 JavaScri...

oschina ⋅ 2016/07/26 ⋅ 5

探索React生态圈

2004年,对于前端社区来说,是里程碑式的一年。Gmail横空出世,它带来基于前端渲染的原生应用级别的体验,相对于之前的服务端渲染网页可谓提升了一个时代,触动了用户的G点。自此,前端渲染的...

yczz ⋅ 2015/08/10 ⋅ 0

个人分享--web前端学习资源分享

1.前言 时间过得真快,转眼间现在是2017年最后一个星期,而今天也是圣诞节,过几天也是元旦了。每到年底,大家都习惯总结和分享,我也不例外。但是经历,我之前已经发过了,那么我今天就分享...

⋅ 2017/12/25 ⋅ 0

ELSE 技术周刊(2017.10.02期)

本期推荐 ES6 Promise:模式与反模式 这是一篇有用的关于常见 Promise 模式和反模式的文章。 业界动态 React v16.0 React 16 如期发布,遵循 MIT 许可。 当地时间 9月 26 日,FB 工程师 Andr...

风清洋ELSE ⋅ 2017/10/02 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

看东方明珠新媒体如何基于阿里视频云,构建完整的视频OTT平台SaaS服务

摘要: 东方明珠新媒体如何基于阿里云,搭建了面向第三方的视频SaaS服务?6月8日,上海云栖大会视频专场中,东方明珠新媒体股份有限公司云计算中心的副总周少毅带来了《东方明珠视频云》为题...

阿里云云栖社区 ⋅ 22分钟前 ⋅ 0

C#调用WebService实例和开发 VS2013

简单的理解就是:webservice就是放在服务器上的函数,所有人都可以调用,然后返回信息。 Web Service的主要目标是跨平台的可互操作性。为了实现这一目标,Web Service 完全基于XML(可扩展标...

布衣大侠 ⋅ 25分钟前 ⋅ 0

基于FlumeNG+Kafka+ElasticSearch+Kibana的日志系统

环境准备 1.服务器概览 hostname ip 操作系统 说明 安装内容 node1.fek 192.168.2.161 centos 7 node1节点 nginx,jdk1.8, flumeNG, elasticsearch slave1 node2.fek 192.168.2.162 centos ......

张shieppp ⋅ 25分钟前 ⋅ 0

问答网站已成过去,深度问答社区才是当下

曾几何时,各类问答网站数不胜数,从百度知道这类综合型问答网站到各种垂直细分的问答网站,都有不少,但到了移动互联网时代,很明显的一大趋势是,网站整体的流量都在下滑,随着移动智能设备...

ThinkSNS账号 ⋅ 27分钟前 ⋅ 0

Android平台架构(ART)

Android平台架构(ART) 本文目的:准确表述Android平台架构 本文转载自[Android官网] 本文定位:学习笔记 学习过程记录,加深理解。也希望能给学习的同学一些灵感 本文更新时间:2018.06.22(...

lichuangnk ⋅ 30分钟前 ⋅ 0

看东方明珠新媒体如何基于阿里视频云,构建完整的视频OTT平台SaaS服务

摘要: 东方明珠新媒体如何基于阿里云,搭建了面向第三方的视频SaaS服务?6月8日,上海云栖大会视频专场中,东方明珠新媒体股份有限公司云计算中心的副总周少毅带来了《东方明珠视频云》为题...

猫耳m ⋅ 31分钟前 ⋅ 0

Java 动态代理 原理解析

概要 AOP的拦截功能是由java中的动态代理来实现的。说白了,就是在目标类的基础上增加切面逻辑,生成增强的目标类(该切面逻辑或者在目标类函数执行之前,或者目标类函数执行之后,或者在目标...

轨迹_ ⋅ 33分钟前 ⋅ 0

js 获取当前时间

var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份(4位,1970-????)myDate.getMonth(); //获取当前月份(0-11,0代表1月)myDate...

夜醒者 ⋅ 39分钟前 ⋅ 0

windows删除或修改本地Git保存的账号密码

在win10或者win7都是一样的步骤: (一)进入控制面板(二)选择用户账户(三)选择管理你的凭据(四)选择Windows凭据(五)选择git保存的用户信息(六)选择编辑或者进...

果树啊 ⋅ 39分钟前 ⋅ 0

8个基本的Docker容器管理命令

前言: 在这篇文章中,我们将带你学习 8 个基本的 Docker 容器命令,它们操控着 Docker 容器的基本活动,例如 运行run、 列举list、 停止stop、 查看历史纪录logs、 删除delete 等等。文末福...

java高级架构牛人 ⋅ 41分钟前 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部