JavaScript【ES5、ES6】版本写法对照表

学习ES6的动机是因为公司要使用 React Native（以下简称RN），由于RN使用了ES6的新语法，所以要学习ES6的新语法。

以下列出 ES5 与 ES6 的对比写法，来让大家学习一些新的写法。

强烈建议大家系统的学习一下JavaScript。

//React/React Native 的ES5 ES6写法对照表
//
//很多React/React Native的初学者都被ES6的问题迷惑：各路大神都建议我们直接学习ES6的语法(class Foo extends React.Component)，然而网上搜到的很多教程和例子都是ES5版本的，所以很多人在学习的时候连照猫画虎都不知道怎么做。今天在此整理了一些ES5和ES6的写法对照表，希望大家以后读到ES5的代码，也能通过对照，在ES6下实现相同的功能。
//
//模块
//引用
//在ES5里，如果使用CommonJS标准，引入React包基本通过require进行，代码类似这样：

//ES5
var  React = require( "react-native");
var {
    Image,
    Text,
    PropTypes
    } =  React;  //引用不同的React Native组件
//在ES6里，import写法更为标准

//ES6
import React, {
    Image,
    Text,
    PropTypes
}  from  'react-native';
//注意在React Native里，import直到0.12+才能正常运作。

---

//导出单个类
//在ES5里，要导出一个类给别的模块用，一般通过module.exports来导出

//ES5
var  MyComponent = React.createClass({
    ...
});
module. exports =  MyComponent;
//在ES6里，通常用export default来实现相同的功能：

//ES6
export default class MyComponent  extends React.Component{
...

}

---

//引用的时候也类似：

//ES5
var  MyComponent = require( './MyComponent.js');

//ES6
import MyComponent  from  './MyComponent.js';
//定义组件
//在ES5里，通常通过React.createClass来定义一个组件类，像这样：

//ES5
var  Photo = React.createClass({
    render:  function() {
        return (
            < Image source ={ this. props. source} />
        );
    },

});

---

//在ES6里，我们通过定义一个继承自React.Component的class来定义一个组件类，像这样：

//ES6
class Photo  extends React.Component {
    render() {
        return (
            < Image source ={ this. props. source} />
        );
    }
}
//给组件定义方法
//从上面的例子里可以看到，给组件定义方法不再用 名字: function()的写法，而是直接用名字()，在方法的最后也不能有逗号了。

//ES5 
var  Photo