ES6 奇怪语法
ES6多个箭头转ES5
http://google.github.io/traceur-compiler/demo/repl.html#request(_action)%0Alet%20withStatus%20%3D%20status%20%3D%3E%20action%20%3D%3E%20R.merge(action%2C%20%7Bstatus%7D)%0Alet%20request%20%3D%20withStatus
https://www.javaroad.cn/questions/93072
了解available syntaxes of arrow functions将使您了解在您提供的示例中'chained'时所引入的行为 .
如果在没有块括号的情况下编写箭头函数(包含或不包含多个参数),则会隐式返回构成函数体的表达式 . 在您的示例中,该表达式是另一个箭头函数 .
No arrow funcs Implicitly return `e=>{…}` Explicitly return `e=>{…}` --------------------------------------------------------------------------------- function (field) { | field => e => { | field => { return function (e) { | | return e => { e.preventDefault() | e.preventDefault() | e.preventDefault() } | | } } | } | }
使用箭头语法编写匿名函数的另一个优点是它们在词汇上与它们定义的范围绑定 . 来自'Arrow functions' on MDN:
与函数表达式相比,箭头函数表达式具有更短的语法,并以词汇方式绑定此值 . 箭头功能始终是匿名的 .
考虑到它来自reactjs应用程序,这在您的示例中尤为重要 . 正如@naomik所指出的,在React中,你经常使用 this
访问component's member functions . 例如:
No arrow funcs Implicitly return `e=>{…}` Explicitly return `e=>{…}` --------------------------------------------------------------------------------- function (field) { | field => e => { | field => { return function (e) { | | return e => { e.preventDefault() | e.preventDefault() | e.preventDefault() } | | } } | } | }
JavaScript 的 箭头函数 () => ({})fn
的意思是,这个箭头函数返回一个对象,相当于一个工厂函数。
const fn = () => ({}); fn(); // {} fn() === fn(); // false
属性方式 有 obj.attr or obj['attrname'] ,所以可以如:
<html> <body> <script type="text/javascript"> const loc="LOC"; const test=(name)=>({ fullName:name, [loc]: { x:10, y:5 } }); var result=test('XiaoXiao'); console.log(result); console.log(result[loc].x); </script> </body> </html>