2015年12月_kittyjie

12月 11月 08月 06月 04月

原创 ES6学习系列目录

ES6学习系列目录

2015-12-14 08:46:16 2057

原创 ES6学习——新的语法：数组解构（Array Destructuring）

上一篇文章讲了Object的解构，这篇讲一下Array的解构，概念大同小异，只是写法会有一些不同，先看个简单的例子：let [x, y] = ['a', 'b','c']; // x = 'a'; y = 'b'跟对象解构一样，先探讨一下赋值表达式的右侧应具备什么条件才能进行解构赋值，规范的12.14.5.2有这样的描述：ArrayAssignmentPattern : [ ]

2015-12-31 10:03:31 18865

原创 ES6学习——新的语法：对象解构（Object Destructuring）

解构在ES6中应该是一种新的语法，在其他语言中我没怎么见到这种语法，也可以说是赋值操作的另一种形式，因为解构的整个定义都在规范的赋值操作符章节下面，有兴趣的可以看规范的12.14.5。目前浏览器对这个新语法的支持还不是很好，但是Firefox 43已经支持了大部分解构特性，这里我们仍然继续使用Kinoma Studio来测试代码。这篇文章主要讲对象的解构赋值操作，先看个简单的例子有点印象：

2015-12-30 16:55:46 22850 2

原创 ES6学习——新的语法：函数参数默认值

这个特性在其他语言中已经早有实现，ES6中加入了这个新特性，但是就目前来看还没有主流的浏览器支持这个特性，在没有这个特性之前，我们也经常会对函数参数设置默认值，例如下面这个例子：function foo(x,y) { x = x || 11; y = y || 31; console.log( x + y );}ES6中可以把上面的代码简化：function

2015-12-28 09:30:55 12930

原创 ES6学习——新的语法：Rest

Rest操作符和Spread操作都是用三个点（...）表示，但作用整好相反。Rest操作符一般用在函数参数的声明中，而Spread用在函数的调用中。下面看个例子： 'use strict'; function func(...args){ console.log(args);//[1,2,3,4] } func(1,2,3,4);我们知道在strict mode下，对

2015-12-25 08:48:01 5290

原创 ES6学习——新的语法：数组元素Spread

前一篇文章讲了Spread操作符在函数参数中的用法，这篇简单讲一下Spread操作符在数组元素中的应用。直接看代码吧：[1, ...[2,3], 4]//[1, 2, 3, 4]let x = ['a', 'b'];let y = ['c'];let z = ['d', 'e'];let arr = [...x, ...y, ...z]; // ['a', 'b', 'c', 'd

2015-12-24 08:18:43 1637

原创 ES6学习——新的语法：函数参数Spread

Spread操作符（...）是比较新的特性，但是在ES6的规范中，没有找到单独的章节对这个操作符进行说明，这个操作符主要用在两种情况下：函数传参和数组生成，这节主要讲解第一种情况。规范的12.3.6.1中对函数参数列表的解释如下：ArgumentList : ... AssignmentExpression1. Let list be an empty List.2. Le

2015-12-23 08:21:58 5452

原创 ES6学习——新的语法：Temporal Dead Zone（TDZ）

应该说TDZ在JS中是一个比较新的概念，在规范里我也没有搜到对这个概念的具体定义，主要涉及let/const，函数参数默认值，subclass等的使用中。（一）下面先看let/const中的TDZ问题，规范中这样写到：13.3 let and const declarations define variables that are scoped to the running exe

2015-12-22 09:24:37 1852

原创 ES6学习——新的语法：const

ES6终于加入了声明常量的语法，这种语法在其他语言中几乎都有，看一下用法： const c1 = 1; const c2 = {}; const c3 = [];Object.getOwnPropertyDescriptor(window,"c1")//Object {value: 1, writable: false, enumerable: true, configurable

2015-12-21 08:15:32 4498

原创 ES6学习——新的语法：let

let的主要用途就是声明块级作用域的变量,看一下规范是怎么说的,请仔细看红字部分，后边TDZ章节会详细讲这点：13.3 let and const declarations define variables that are scoped to the running execution context’s LexicalEnvironment. The variables are creat

2015-12-18 08:56:26 3701

原创 ES6学习——新的语法：块级作用域概述

在ES6之前，JS中只有两种作用域：全局和函数级别作用域。就是说你声明的变量要么可以全局访问，要么在函数内访问。当然了，函数内肯定能访问全局的变量//全局级别var globalVar = 1;window.globalVar2 = 2//函数级别(function(){ var f1 = 1;})(); function func(){ var

2015-12-17 09:15:25 1563

原创 ES6学习——环境搭建

ES6规范2015年发布，现在浏览器对它的支持正在不断的加强，具体查看浏览器对ES6支持的程度，请参考https://kangax.github.io/compat-table/es6/，如果想查看浏览器对所有JS,CSS,HTML5新特性的支持，请参考http://caniuse.com/想要学习ES6，有几种方法：1. 在浏览器上尝试，这需要浏览器对ES6的支持，目前看支持程度

2015-12-16 08:31:46 9204

原创 ES6学习——ES6背景介绍

关于ES6的介绍网上有很多，就没必要多说了，下面列出两个参考。中文的可以参考这里：https://zh.wikipedia.org/wiki/ECMAScript，英文的可以参考这里：https://en.wikipedia.org/wiki/ECMAScript从ECMA-262 Edition 3 到 Edition 6 经历了6（2009~2015）年的时间，

2015-12-15 07:39:53 1652