type
status
date
slug
summary
tags
category
icon
password
Slides in ES6 overview workshop
Intro
开场
What
ECMAScript 6（以下简称ES6）是JavaScript语言的下一代标准
Goal
ES6的目标，是使得JavaScript语言可以用来编写大型的复杂的应用程序，成为企业级开发语言。
新的语言特性，代码更优雅，程序更健壮，减少不必要的重复，减少不必要的第三方依赖。
Agenda
- template strings
- const
- let
- block-level declaration
- Destructuring Assignment
- arrow functions
- default function params
- class
- module
Requirements
Talk is cheap, show me the code.
template strings
它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。
const
let
声明变量，变量只在let命令所在代码块内有效。
let不允许在相同作用域内，重复声明同一个变量。
block-level declaration
- let, const 块级作用域
- var 函数作用域
ES5的JavaScript的不支持块级作用域，变量仅仅被限制到函数作用域内。
Pros
function scope
Destructuring Assignment
ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。
Array destructuring
模式匹配（嵌套数组）
解构失败
- 如果对undefined或null进行解构，会报错。
- 解构赋值允许指定默认值。
- 解构赋值不仅适用于var命令，也适用于let和const命令。
Object destructuring
如果变量名与属性名不一致，必须写成下面这样。
- 对象的解构也可以指定默认值。
- 如果要将一个已经声明的变量用于解构赋值
JavaScript引擎会将
{x}理解成一个代码块，从而发生语法错误。NOTE 数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。
Pros
- 交换变量的值
- 从函数返回多个值
- 遍历Map结构 配合变量的解构赋值，获取键名和键值
- 输入模块的指定方法
Arrow Function
- 语法糖：function的简写，或者是使用胖箭头 () => 的Lamda表达式。
- 不仅仅是语法糖：自动绑定外部作用域的”this”.
default function params
在ES6默认值特性出现前，手动处理默认值有几种方式：
为了处理参数未传递的情况，我们常看到typeof检测:
有时也可以检查arguments.length
这些方法都可以很好的工作，但都过于手动且缺少抽象。
参数默认值使用方便且毫无违和感。
Classes
A formal inheritance syntax comes to JavaScript
Really just syntactical sugar over JS prototypical inheritance
Extends
Module
export和import
ES6实现了模块功能，试图解决JavaScript代码的依赖和部署上的问题，取代现有的CommonJS和AMD规范，成为浏览器和服务器通用的模块解决方案。
NOT Included
- Map, WeakMap, Set, WeakSet
- Promise
- Generator
- Iterator
- Rest Parameter
- Spread Operator
新的内建方法
- Object.assign
- [arr].find
- “str”.repeat
- “str”.startsWith
- “str”.endsWith
- “str”.includes
- Number.isNaN
- Number.isFinite
- Number.isSafeInteger
- Math.trunc
- Math.sign
Using ES6 Today
Server
- io 2.2.0
- node 0.12.4
Browser
- Browserify
- Babel
Resources
Loading...
