render() {
  const {history} = this.props
  return <WrappedComponent {...this.props} />;
}

以上代码用到的语法的一些解释

const

ES6引入的第三个声明类关键词与let类似：const。

const声明的变量与let声明的变量类似，它们的不同之处在于，const声明的变量只可以在声明时赋值，不可随意修改，否则会导致SyntaxError（语法错误）。

const MAX_CAT_SIZE_KG = 3000; // 正确
const MAX_CAT_SIZE_KG; // 错误

let

let与var一样，也可以用来声明变量，但它有着更好的作用域规则。

var messages = ["喵！", "我是一只会说话的猫！", "回调（callback）非常有趣!"];
for (var i = 0; i < messages.length; i++) {
  setTimeout(function () {
    cat.say(messages[i]);
  }, i * 1500);
}

这只会说话的猫并没有按照预期连说三条消息，它说了三次“undefined”,你知道问题出在哪里么？

事实上，这个问题的答案是，循环本身及三次timeout回调均共享唯一的变量i。当循环结束执行时，i的值为3（因为messages.length的值为3），此时回调尚未被触发。

所以当第一个timeout执行时，调用cat.say(messages[i])，此时i的值为3，所以猫咪最终打印出来的是messages[3]的值亦即undefined。

var 的作用域甚广，所以一进入函数就要马上将它创建出来。这就是所谓的提升（hoisting）。变量提升就好比是，JS引擎用一个很小的代码起重机将所有var声明和function函数声明都举起到函数内的最高处。

let声明的变量拥有块级作用域。也就是说用let声明的变量的作用域只是外层块，而不是整个外层函数。

let声明仍然保留了提升的特性，但不会盲目提升。在runTowerExperiment这个示例中，通过将var替换为let可以快速修复问题，如果你处处使用let进行声明，就不会遇到类似的bug。

let声明的全局变量不是全局对象的属性。这就意味着，你不可以通过window.变量名的方式访问这些变量。它们只存在于一个不可见的块的作用域中，这个块理论上是Web页面中运行的所有JS代码的外层块。

形如for (let x…)的循环在每次迭代时都为x创建新的绑定。

这是一个非常微妙的区别，拿我们的会说话的猫的例子来说，如果一个for (let…)循环执行多次并且循环保持了一个闭包，那么每个闭包将捕捉一个循环变量的不同值作为副本，而不是所有闭包都捕捉循环变量的同一个值。

所以在会说话的猫示例中，也可以通过将var替换为let修复bug。

解构 Destructuring

const {history} = this.props

history = this.props中history的值，详情参考解构

解构-“不定参数”

<WrappedComponent {...this.props} />

你可以在对应位留空来跳过被解构数组中的某些元素：

var [,,third] = ["foo", "bar", "baz"];
console.log(third);
// "baz

而且你还可以通过“不定参数”模式捕获数组中的所有尾随元素：

 var [head, ...tail] = [1, 2, 3, 4];
console.log(tail);
// [2, 3, 4]

JS语法记录(1)

const

let

解构 Destructuring

解构-“不定参数”

FEATURED TAGS

FRIENDS