主要参考了下面两篇博文,对ES6的新特性做一些笔记,加深印象

*号函数 迭代函数生成器

我能想到的生成器使用场景有两点,一个是类似类静态变量,一个是类似toggle的切换场景,还有就是异步阻塞程序。

function *myGenerator() {
console.log('step1');
yield 1;
console.log('step2');
yield 2;
console.log('step3');
return 3;
}
let g = myGenerator();
while(true) {
let curr = g.next();
if (g.done) {
console.log(g.value);
break;
} else {
console.log(g.value);
}
}

箭头函数

箭头函数不绑定 this 和 arguments. 通常可以作为匿名函数的简写。这个特殊的特性可以在一些场景提供简洁的代码,同时也会在某些场景带来问题。this 一般是指向当前函数体,

// arrow function

let a = {

word: 'hello',

say: function(){

setTimeout(() => {

console.log(this.word);

}, 0);

}

}

let b = {

word: 'world',

say: function() {

setTimeout(function() {

console.log(this.word);

}, 0);

}

}

a.say(); // hello

b.say(); // undefined.

变量声明 let, const VS var

const 比较简单,不多表

let 的作用范围在 {} 结构体中,比如for,if,object。 而 var 作用范围在函数体中

for (var i = 0; i < 3; i++) {
(function(i) {
setTimeout(function () {
console.log(`var: ${i}`);
}, i * 1000);
})(i);
}
console.log(`after for var: ${i}`);
for (let x=0; x<3; x++) {
setTimeout(function () {
console.log(`let: ${x}`)
}, x * 1000);
}
// console.log(`after var var: ${x}`); // error

模板字符串

对于经常在前端拼接html与js变量的我来说,无疑是一个福音。而且语法跟php几乎没有区别

`反引号之间的变量${some_var}会被替换赋值`

函数默认值,解构,展开

支持像其他语言一样使用函数默认值,跟 || 说再见。

解构 是指 类似php的 list 语法,或者python的tuple语法。注意数组和对象的区别: [v1,v2] = ['value2', value2]; {name, value} = {name:'xx', value:'yy'}

展开运算符,用于数组和对象的拼接,还有就是箭头函数的默认传参(类似python中的 *args, **kwargs),数组参数调用(func.apply(null, arr)):

//数组
const color = ['red', 'yellow']
const colorful = [...color, 'green', 'pink']
console.log(colorful) //[red, yellow, green, pink]
//对象
const alp = { fist: 'a', second: 'b'}
const alphabets = { ...alp, third: 'c' }
console.log(alphabets) //{ "fist": "a", "second": "b", "third": "c"

Promises

异步程序的同步写法。本质是把 ok_callback(resolve) 和 err_callback (reject) 封装了一下。然后同过then 调用 resolve 方法,catch 调用 reject 方法。

ECMAScript 6 一些有意思的特性的更多相关文章

  1. ECMASCript 2019可能会有哪些特性?

    最近这些年,ECMASCript标准发展节奏非常稳定,每年都会发布新的特性.那么,ECMASCript 2019可能会有哪些特性呢? ECMASCript语法提案的批准流程 JavaScript的标准 ...

  2. ECMAScript各版本简介及特性

    术语 ECMAScript Sun(现在的Oracle)公司持有着“Java”和“JavaScript”的商标.这就让微软不得不把自己的JavaScript方言称之为“JScript”.然后,在这门语 ...

  3. ECMAScript正则表达式6个最新特性

    译者按: 还没学好ES6?ECMAScript 2018已经到来啦! 原文:ECMAScript regular expressions are getting better! 作者: Mathias ...

  4. 个人认为目前比较好用的ECMAScript(16-20)新特性

    ECMAScript(16.17.18.19)新特性 Array.prototype.includes includes 是数组上的简单实例方法,可以轻松查找到数组中是否包含指定内容(包括NaN) 返 ...

  5. Dubbo有意思的特性介绍

    Duboo 不单让我们可以像使用本地服务一样的使用远程服务,还设计了很多特性来满足我们平时开发时常见的场景,省却了我们不少麻烦,真是一款有良心的框架,下面针对这些场景和解决方案来具体解释下: 1.接口 ...

  6. thrift 一个有意思的特性:Class名称无关性

    最近开发的一个项目,后端采用thrift框架来提供rpc服务(java语言实现),然后前端采用php语言来生成thrift client调用后台RPC服务.由于某些原因,上周我把thrift定义文件中 ...

  7. ECMASCRIPT 6中字符串的新特性

    本文将覆盖在ECMAScript 6 (ES6)中,字符串的新特性. Unicode 码位(code point)转义 Unicode字符码位的长度是21位[2].而JavaScript的字符串,是1 ...

  8. ECMAScript 2016(ES7)新特性简介

    简介 自从ES6(ECMAScript 2015)在2015年发布以来,ECMAScript以每年一个版本的速度持续向前发展.到现在已经是ECMAScript 2020了. 每个版本都有一些新的特性, ...

  9. ECMAScript 6教程 (一)

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出 原文连接,博客地址为 http://www.cnblogs.com/jasonnode/ .该系列课程是 ...

随机推荐

  1. live555源码分析----RSTPServer创建过程分析

    最近五一回家,终于有机会能安静的看一下流媒体这方面相关的知识,准备分析live555的源码,接下来会把我读源码的过程记录成博客,以供其他的同路人参考. 因为再读源码的过程中,并不是一路顺着读下来,往往 ...

  2. C# 保存文件如有重名在原名后加(*)

    C#保存文件如有重名加() **(1) //Myadd 处理重名 private string GetNewPathForDupes(string path) { string directory = ...

  3. postgresql 模式与用户,及跨库访问

    1 控制台命令\h:查看SQL命令的解释,比如\h select.\?:查看psql命令列表.\l:列出所有数据库.\c [database_name]:连接其他数据库.\d:列出当前数据库的所有表格 ...

  4. Spring MVC配置详解(1)

    web.xml的配置 <!-- 配置前端控制器 前端控制器(DispatcherServlet)--> <servlet> <servlet-name>spring ...

  5. RabbitMQ 消息队列 应用

    安装参考    详细介绍   学习参考 RabbitMQ 消息队列 RabbitMQ是一个在AMQP基础上完整的,可复用的企业消息系统.他遵循Mozilla Public License开源协议. M ...

  6. web基础 (二) html标签

    一.html是什么? 超文本标记语言(Hypertext Markup Language,HTML)通过标签语言来标记要显示的网页中的各个部分.一套规则,浏览器认识的规则 浏览器按顺序渲染网页文件,然 ...

  7. 10-10C#基础---数据类型之间的转换

    10-10  C#基础数据类型转换(熟练掌握) 第一课 数据类型之间的转换 基本类型的转换:自动转换(隐式转换)和强制转换(显示转换) 装箱转换:允许值类型隐式转换成引用类型. 拆箱转换:允许将引用类 ...

  8. DAY7-面向对象之封装

    一.引子 从封装本身的意思去理解,封装就好像是拿来一个麻袋,把小猫,小狗,小王八,还有alex一起装进麻袋,然后把麻袋封上口子.照这种逻辑看,封装=‘隐藏’,这种理解是相当片面的 二.先看如何隐藏 在 ...

  9. jquery-messager-消息提示

    一.页面引入 jquery.js 下载地址问度娘 jquery-message.js 下载地址:jquery-message.js 二.页面使用 //ajax轮询检查新的订单 function che ...

  10. 工作的时候用到spring返回xml view查到此文章亲测可用

    spring mvc就是好,特别是rest风格的话,一个 org.springframework.web.servlet.view.ContentNegotiatingViewResolver就可以根 ...