ECMAScript 6 一些有意思的特性
主要参考了下面两篇博文,对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 一些有意思的特性的更多相关文章
- ECMASCript 2019可能会有哪些特性?
最近这些年,ECMASCript标准发展节奏非常稳定,每年都会发布新的特性.那么,ECMASCript 2019可能会有哪些特性呢? ECMASCript语法提案的批准流程 JavaScript的标准 ...
- ECMAScript各版本简介及特性
术语 ECMAScript Sun(现在的Oracle)公司持有着“Java”和“JavaScript”的商标.这就让微软不得不把自己的JavaScript方言称之为“JScript”.然后,在这门语 ...
- ECMAScript正则表达式6个最新特性
译者按: 还没学好ES6?ECMAScript 2018已经到来啦! 原文:ECMAScript regular expressions are getting better! 作者: Mathias ...
- 个人认为目前比较好用的ECMAScript(16-20)新特性
ECMAScript(16.17.18.19)新特性 Array.prototype.includes includes 是数组上的简单实例方法,可以轻松查找到数组中是否包含指定内容(包括NaN) 返 ...
- Dubbo有意思的特性介绍
Duboo 不单让我们可以像使用本地服务一样的使用远程服务,还设计了很多特性来满足我们平时开发时常见的场景,省却了我们不少麻烦,真是一款有良心的框架,下面针对这些场景和解决方案来具体解释下: 1.接口 ...
- thrift 一个有意思的特性:Class名称无关性
最近开发的一个项目,后端采用thrift框架来提供rpc服务(java语言实现),然后前端采用php语言来生成thrift client调用后台RPC服务.由于某些原因,上周我把thrift定义文件中 ...
- ECMASCRIPT 6中字符串的新特性
本文将覆盖在ECMAScript 6 (ES6)中,字符串的新特性. Unicode 码位(code point)转义 Unicode字符码位的长度是21位[2].而JavaScript的字符串,是1 ...
- ECMAScript 2016(ES7)新特性简介
简介 自从ES6(ECMAScript 2015)在2015年发布以来,ECMAScript以每年一个版本的速度持续向前发展.到现在已经是ECMAScript 2020了. 每个版本都有一些新的特性, ...
- ECMAScript 6教程 (一)
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出 原文连接,博客地址为 http://www.cnblogs.com/jasonnode/ .该系列课程是 ...
随机推荐
- Gradle 配置
下载Gradle https://gradle.org/releases/ https://services.gradle.org/distributions/gradle-4.4.1-bin.zip ...
- STM32 -- 硬件知识
一.网站资源 1.http://www.stmcu.com.cn/ 二.硬件 1.BOOT0 和 BOOT1 1)一般BOOT0和BOOT1跳线都跳到0(地): 只是在ISP下载的情况下,BOO ...
- websocket之一:websocket简介
Websocket websocket为一次HTTP握手后,后续通讯为tcp协议的通讯方式. WebSocket 使用一种被称作“Upgrade handshake(升级握手)”的机制将标准的 HTT ...
- AngularJS:实例
ylbtech-AngularJS:实例 1.返回顶部 1. AngularJS 实例 实例 您可以在线编辑实例,然后点击按钮查看结果. AngularJS 实例 <div ng-app=&qu ...
- java--构造器与static
原本无显示编码构造器,则有一个默认的隐式(隐藏的无参构造器),但是,当显示指定了构造器,则这个默认隐式的构造器将不存在,比如此时无法new无参的构造器(除非显示地编写声明无参的构造函数). 如果子类构 ...
- 基于windows平台的命令行软件安装工具Chocolatey的安装
本文介绍Chocolatey的安装和使用 Chocolatey 这是基于.NET Framework 4以上的windows安装软件的命令行工具 安装 第一步,打开你的powershell.exe,使 ...
- java 多线程系列---JUC原子类(五)之AtomicLongFieldUpdater原子类
AtomicLongFieldUpdater介绍和函数列表 AtomicLongFieldUpdater可以对指定"类的 'volatile long'类型的成员"进行原子更新.它 ...
- ABP仓储
简介 我们都知道ABP已经实现了仓储模式,支持EF core 和dapper 进行数据库的连接和管理,可以很方便的注入仓储来操作你的数据,不需要自己单独定义一个仓储来实现,通用的仓储实现了通用的cru ...
- DAY19-上传头像并预览
一个简单的注册页面: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...
- Redis Cluster 伪集群的搭建
简介 为何要搭建Redis集群?Redis是在内存中保存数据的,而我们的电脑一般内存都不大,这也就意味着Redis不适合存储大数据,适合存储大数据的是Hadoop生态系统的Hbase或者是MogoDB ...