ECMAScript6

ECMAScript6 之 decoretors

标签: ECMAScript 6 javaScript 类的修饰 许多面向对象的语言都有修饰器( Decorator )函数,用来修改类的行为。 @testable class MyTestableClass { // ... } function testable(target) { target.isTestable = true } MyTestableClass.isTestable // true testable 函数即为修饰器,为 MyTestableClass 类添加了名为 isTestable 的静态属性。 一个修饰器可以理解为包装之后跟着的类的函数。 @decorator class A {} // 等同于

  • aco
    aco
2 min read
ECMAScript6

ECMAScript 之 Generator 的异步使用技巧

标签: ECMAScript 6 javaScript 异步 在 js 界,异步是获取数据的主旋律,大概有以下几种 callback 回调 Promise event 事件 简单的回顾一下以上 3 种模式: 回调 简单的来说就是将需要执行的函数传入异步调用内,在异步调用结束后,执行函数,写出的代码会是这样: function doSomeAsync(callback) { let data = {/* 数据 */} setTimeout(() => { callback(data)

  • aco
    aco
6 min read
ECMAScript6

ECMAScript6 之 Generator

标签: ECMAScript 6 javaScript 简介 Generator 函数有多种理解角度。语法上,首先可以把它理解成,Generator 函数是一个状态机,封装了多个内部状态。 执行 Generator 函数会返回一个遍历器对象,也就是说,Generator 函数除了状态机,还是一个遍历器对象生成函数。返回的遍历器对象,可以依次遍历 Generator 函数内部的每一个状态。 简单来说,一个 Generator 函数,就像是搭建一段楼梯,它规定了楼梯的步数以及怎么走,它生成的函数的执行就像是走楼梯一般,每走一步都会有具体的执行内容以及返回值,并且不能后台只能往前走( yield

  • aco
    aco
6 min read
ECMAScript6

ECMAScript6 之 Iterator & for…of

标签: ECMAScript 6 javaScript Iterator 概念 遍历器(Iterator)就是这样一种机制。它是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署 Iterator 接口,就可以完成遍历操作(即依次处理该数据结构的所有成员)。 具体到语言层面来说,实现了以下几个东西 规定对象下部署一个统一的方法 统一的方法返回了统一的结构 上面两点中的统一方法的方法名就叫: Symbol.iterator 返回的结构统一为:{ next: function } next 方法有统一的返回值结构:{ value: any, done: boolean } ES6

  • aco
    aco
4 min read
ECMAScript6

ECMAScript6 之 Reflect

标签: ECMAScript 6 javaScript 简述 Reflect 意味着反射,从字面意思上就可以理解为是语言层面上的内容,在 ES6 中其出现的目的主要有以下几个 将 Object 下属于语言内部的方法,放到 Reflect 上,并且未来新方法只在 Reflect 上部署。 使得方法的返回更加合理,解决之前在 Object 下的一些方法的返回值不合理照成的逻辑混乱。 让命令式的行为变成函数行为,如: name in obj ==> Reflect.has(obj,

  • aco
    aco
1 min read
ECMAScript6

ECMAScript6 之 Proxy

标签: ECMAScript 6 javaScript 简介 Proxy 可以理解成,在目标对象之前架设一层“拦截”,外界对该对象的访问,都必须先通过这层拦截,因此提供了一种机制,可以对外界的访问进行过滤和改写。Proxy 这个词的原意是代理,用在这里表示由它来“代理”某些操作,可以译为“代理器”。 一个简单的例子 let obj = new Proxy({}, { get(target, key, receiver) { console.log(`getting ${key}

  • aco
    aco
3 min read
ECMAScript6

ECMAScript6 之尾调用优化

标签: ECMAScript 6 javaScript 定义 尾调用(Tail Call)是函数式编程的一个重要概念,本身非常简单,一句话就能说清楚,就是指某个函数的最后一步是调用另一个函数。 简单的理解就是在函数体内,最后一行 return 了一个函数调用。注:仅仅只能是函数调用,任何其他的形式都不能认为是尾调用。 以下都不属于尾调用 // 情况一 function f(x){ let y = g(x) return y } // 情况二 function f(

  • aco
    aco
5 min read
ECMAScript6

ECMAScript 6 之函数

标签: ECMAScript 6 javaScript 默认值 想必在写函数时,都会有一个困惑:要是在这个函数调用的时候,参数没有传入时,该怎么办?设置默认值。对,所以大部分的函数都会有以下的代码。 function f(a, b) { a = a || {/*...*/} /* ... */ } 以上代码相信绝大多数的 javascript 开发者都写过,乍一看是没啥大问题的,但是如果传入的值是 false 呢?那么 a 就会被替换成默认值。为了避免这个问题就应该将代码改一改: if( typeof a

  • aco
    aco
8 min read
ECMAScript6

ECMAScript 6之解构变量

标签: ECMAScript 6 javaScript 上一节看到 ES6 中新增加的块级作用域,解决了一些不必要的闭包,让 js 代码的编写能更加的保险与便利,这里我不是很想说更加的安全,因为代码是人写的,好坏与否、安全与否都不是代码的问题,当然闭包在 js 中的应用不仅仅是使用在锁住块级作用域。块级作用域的出现也不能取代所有的闭包。 这一节来接着看 ES6 中对于赋值的新玩法。 简单说说 有这样一个场景:你向你的服务器提交了一次请求,获取一些基本的参数来初始化页面。假设 config 就为后端传送回来的数据,而你需要去获取其中的配置项。当然先写 ES5 的。

  • aco
    aco
11 min read
javaScript

ECMAScript 6起步

标签: ECMAScript 6 javaScript ECMAScript 6 已经开始逐渐代替 ECMAScript 5 了,满载着好奇去看了看,毕竟要跟上时代潮流嘛。本以为以自己目前的 javascript 功底,还是可以驾驭,但是刚看了两章就不得不写点东西来加深记忆了和理解文章内容了。http://es6.ruanyifeng.com/ 由于 ECMAScript 6 有很多内容的更新,所以这一系列会持续很久,同时对这一系列做下说明:主要是对该教程所说内容的摘记同时加上一些自己的理解。ECMAScript 6 的出现,并不是说完全取代了 ECMAScript

  • aco
    aco
1 min read