a=>b => c这种函数如何理解

es6中高阶函数多个箭头函数级联的情况如何很好的理解代码


const setTitle = (title) => (WrappedComponent) => {

   return class extends React.Component {

      componentDidMount() {

          document.title = title

      }

      render() {

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

      }

   }

}

PS追问一下:大家说的,我能够理解了,但是每次都要在头脑中做转换,感觉代码可读性也不是特别的好,也可能是我太菜了。还有这种写法是不是最多也就写两层。


UYOU
浏览 485回答 3
3回答

喵喵时光机

其实就是ES6的柯里化写法,也就是先定义一个函数,然后再其内再返回一个新的函数以接受第二个参数补充:可以不只是两层。

慕仙森

const setTitle = (title) => (WrappedComponent) => {}//格式上可以看做const setTitle = function(title){&nbsp; &nbsp; return function(WrappedComponent){&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; }}

拉丁的传说

const setTitle = (title) => {return (WrappedComponent) => {&nbsp; &nbsp;return class extends React.Component {&nbsp; &nbsp; &nbsp; componentDidMount() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; document.title = title&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; render() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;return <WrappedComponent {...this.props} />&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp;}&nbsp;}}从右往左,相当于(title) => {return ()=>{}}
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript