React开发管理后台0
React开发需要用ES6语法，ES6是在2015年发布的，对Javascript语法进行了重大扩充，所以直到现在还不是所有的浏览器都支持ES6语法，React使用Babel来支持ES6语法。
在这里我们先来熟悉一下ES6的语法，为今后进行React开发打下基础。
变量扩展
块作用域
在老版本的Javascript中，只有全局和函数作用域，没有块作用域，如下代码所示：
function t1() {
var i = 1;
if (1 == i) {
let n1 = 'n1 block';
alert(`n1=${n1}!`);
n1 = 'new n1';
alert(`new n1=${n1}!`);
}
alert(n1);
}在第4行定义变量n1，在第5行可以正确显示其结果。在第6行可以改变n1的值，第7行也可以正确显示出来（与其他很多语言不同，let这里表示块作用域变量，而不是常量）。
常量
ES6中引入常量概念，用const开头：
const n2 = 'abc';
n2 = 'def';这时就会报错，因为不能向常量赋值。
模板字符串
ES6引入模板字符串，就是将变量嵌入到字符串中，而无需使用+来拼接字符串，使代码更易懂。实际中模板字符串有两种主要用途，一种是在字符串中嵌入变量，另一种是输入多行字符串，如下所示：
var name = '王一';
console.log(`欢迎${name}光临！`);
console.log('欢迎' + name + '光临！');
var message = `
这里是多行文本
`;注意上述代码中第2行使用的是Tab键上边的反引号，不是单引号。其效果和第3行相同。第4行定义的多行文本也是可以直接显示为多行文本的，同时也需要注意，其使用的是Tab键上面的反引号而不是单引号。
函数扩展
Lambda表达式
ES6中引入Lambda表达式又称之为简头函数，可以用另一种方式来定义函数：
function add(a, b) {
return a + b;
}
var addNew = (a, b) => {
return a + b;
}
alert(`a+b=${add(1, 2)}!`);
alert(`a+b=${addNew(3, 2)}!`);
setTimeout(()=>{ alert('timeout'); }, 2000);
function onTimeout() {
alert('timeout2');
}
setTimeout(onTimeout, 1000);我们首先定义了普通函数add和箭头函数addNew，在后面可以看到，他们无论调用方式还是执行效果都是完全一样的。
接下来我们设置timeout执行的函数，通过箭头函数或普通函数作为setTimeout函数的第一个参数，效果都是一样的。而使用箭头函数，可以使代码更简洁。
默认参数
默认参数就是可以给函数中的参数赋默认值，当函数调用时，如果不给这个参数赋值，就使用默认值，如果给参数赋值，则使用传入的值，如下所示：
function increase(a, b=1) {
return a + b;
}
alert(`increase 1:${increase(3)}!`);
alert(`increase 100:${increase(3, 100)}!`);运行上面的代码，第一次输入为4，因为此时没有给b赋值，系统使用默认值1；第二次输入为103，此时b使用传入值100。
展开符
展开符为…，可以将数组元素取出，去掉中括号，如下所示：
function sum(a, b) {
return a + b;
}
var vals = [1, 2];
alert(`老方法：sum=${
sum.apply(null, vals)}!`);
alert(`新方法：sum=${
sum(...vals)}!`);在老Javascript中，需要使用apply函数，而ES6中可以在数组前面加展开符…，直接将数组变为元素的列表。
对象扩展
对象属性
ES6在对象中增加了keys、values、entries方法，可以返回对象的属性、值和键值对，如下所示：
let user = {name: '王一', age: 55, gender: '男'};
console.log(Object.keys(user));
console.log(Object.values(user));
console.log(Object.entries(user));
let v1 = Object.entries(user);
console.log(`${v1[0][0]}=${v1[0][1]}!`);