ES6 新特性示例

JS的新版本 ES6/ECMAScript2015 在去年出来了,我们现在普遍使用的ES5是在2009年出来的,相隔这么多年,变化比较大,添加了一些很好用的特性 下面就看几个简单而实用的小特性

特性示例

1模板文本

需要在字符串中加入变量时,通常做法就是使用字符串拼接,如 var param = 'b'; var str = 'a ' + param + ' c'; ES6中简单了,可以直接在字符串中添加变量 var str = `a ${param} c`; 注意,使用的是反引号 ``,而不是 ''

2多行字符串

例如想定义一个html代码片段,放在一行很难看,想用多行,还得用字符串拼接 var html = '<div>' + '<span>test</span>' + '</div>'; 一堆加号和引号,很麻烦 ES6中的反引号就能简单的解决 var html = `<div> <span>test</span> </div>`; 非常清晰,里面还可以直接加变量,很方便

3参数默认值

想给参数设置默认值时,需要我们手工处理,例如 function (width, height) { var height = height || 300; var width = width || 600; ... } ES6可以直接指定默认值 function (width=600, height=300) { ... }

4解构赋值

例如有一个json对象 var data = {name:'dys', age:1}; 想取得name,age属性的话,需要分别获取 var name = data.name; var age = data.age; ES6可以自动获取并赋值 var {name, age} = data; 这几个示例只是比较简单的语法方面的便利特性,ES6还有一些比较深入的改进,例如

箭头函数、Promises、Classes ……

如何使用ES6

ES6是个新东西,兼容性还是个大问题,直接使用肯定是不可行了 还好,已经有了ES6的代码转换器,可以把ES6的代码转为ES5的代码(例如 babel),可以让我们使用ES6,又不担心兼容问题 我还没实际应用,不知道实际兼容效果是否有那么好 babel的官网 https://babeljs.io/ babel 示例 babel有gulp插件,下面是个简单的ES6代码转换示例 (1)安装环境 需要你的机器上已经装了nodejs、gulp 然后安装babel客户端 $ npm install -g babel-cli 在项目目录下安装相关插件 $ npm install gulp $ npm install --save-dev gulp-babel $ npm install --save-dev babel-preset-es2015 (2)测试脚本 用ES6方式写一个测试 a.js var str = `hi ${name}`; 编写 gulpfile.js var gulp = require("gulp"); var babel = require("gulp-babel"); gulp.task("default", function () { return gulp.src("a.js") .pipe(babel({presets: ['es2015']})) .pipe(gulp.dest("dist")); }); 这个脚本的意思是使用babel把a.js编译并输出到dist目录下 (3)执行编译 在项目目录中执行 $ gulp 执行结束后,到dist目录下查看编译后的a.js

原文发布于微信公众号 - 性能与架构(yogoup)

原文发表时间:2016-03-24

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏决胜机器学习

RabbitMQ(五) ——话题模式

RabbitMQ(五)——话题模式 (原创内容,转载请注明来源,谢谢) 一、概述 话题模式(topic)可以让队列绑定某一类型的消息,而不仅仅是direct模式...

3385
来自专栏程序员互动联盟

【java基础】 线程实例

今天有小伙伴在后台问java多线程的概念,小编觉得先从掌握基本的线程概念开始,才能更加深刻的认知多线程,通俗的讲就是多个并行运行的while循环,可以并发做多个...

3606
来自专栏企鹅号快讯

NPM酷库:vm2,安全的沙箱环境

NPM酷库,每天两分钟,了解一个流行NPM库。 今天我们要了解的库是 vm2,这是一个Node.js 官方 vm 库的替代品,主要解决了安全问题。 不安全的vm...

3125
来自专栏个人随笔

房上的猫:JavaDoc注释

//这是一个注释 /*   *这是一个演示程序   */ /**    *@这是JavaDoc注释。   */ JavaDoc注释    背景:       j...

35710
来自专栏Vamei实验室

Python标准库11 多进程探索 (multiprocessing包)

在初步了解Python多进程之后,我们可以继续探索multiprocessing包中更加高级的工具。这些工具可以让我们更加便利地实现多进程。 进程池 进程池 (...

2095
来自专栏唐郑望的专栏

Go 语言之三驾马车

Go 语言的三个核心设计: interface 、goroutine 、 channel。

1.8K0
来自专栏智能合约

Phalcon入门教程之Volt模板引擎

1453
来自专栏Vamei实验室

Linux并发与同步

典型的UNIX系统都支持一个进程创建多个线程(thread)。在Linux进程基础中提到,Linux以进程为单位组织操作,Linux中的线程也都基于进程。尽管实...

2669
来自专栏瓜大三哥

UVM(十)之config机制

UVM(十)之config机制 1 验证平台中要配置的众多的参数 在一个验证平台中,有众多的参数需要配置。如在mac_driver中,按照以太网相关协议的规定,...

3156
来自专栏后端技术探索

利用 PHP 名称空间编写可读且可维护的代码

“Conan 是我榜样。” 如果我在餐桌上说这句话,我儿子会以为我说的是游戏 “野蛮人柯南”,而我妻子会以为我说的是脱口秀主持人 Conan O'Brien。这...

1322

扫码关注云+社区

领取腾讯云代金券