ES5与ES6几种常见语法特性的区别

ES5 导出类，通过 module.exports来导出


var MyComponent = Reqact.createClass({
...
})
module.exports = MyComponent;

ES6 导出类，使用export default 来导出类或组件


export default class MyComponent extends Component{
...
}

ES5语法里，使用CommonJS标准包，通过require来导入组件。


var ReactNative = require("react-native");
var {Image,	Text,} = ReactNative;
var MyComponent = require('./MyComponent');

在ES6语法里，使用import方式导入组件


import {Image , Text} from 'react-native'
import MyComponent from './MyComponent';

ES5里，通过React.createClass来创建一个组件类


var Demo = React.createClass({
...
})

在ES6里，通过继承自React.Component的class来定义一个组件类


class Demoexteneds React.Component{
...
}

在ES5语法中，React Native状态变量在 getInitialState()中声明。


let Index = React.createClass({
	getInitialState:function(){
		return {
			var1:'value of va1',
			var2:30,
			var3:true
		}
	}
});

而在ES6语法中，状态机变量的声明必须在组件的构造函数中声明。


let Index extends Component {
	constructor(props) {
		super (props);
		this.state = {
			var1: 'value of var1',
			var2:30,
			var3:true
		}
	}
}

参考来源

《React Native 移动开发实战》

About