在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ ES6 箭頭函數(shù)問題

ES6 箭頭函數(shù)問題

學(xué)習(xí) React 教程時(shí)，發(fā)現(xiàn)了一個(gè)箭頭函數(shù)的問題。

const numbers = [1, 2, 3, 4, 5];
const listItems = numbers.map((number) => <li>{ number }</li>);

以上代碼能夠正確返回 5 個(gè) <li /> 的數(shù)組。

但是當(dāng)我像以下寫法時(shí)：


const listItems = numbers.map((number) => { <li>{ number }</li> });

卻只能返回出 5 個(gè) undefined。。。

也許是看 ES6 箭頭函數(shù)時(shí)看漏了什么。。。

先謝謝各位大神。。

回答
編輯回答
萌吟

{ <li>{ number }</li> }這是個(gè)塊,里邊的number沒有定義,作用域問題

2017年11月23日 22:13
編輯回答
青裙

{}當(dāng)做了一個(gè)方法，沒有返回值

2018年1月12日 00:16
編輯回答
青裙

多寫了一個(gè)大括號
沒有默認(rèn)的return了

2018年4月14日 22:05
編輯回答
逗婦乳

有大括號要return
不寫大括號是默認(rèn)return

2017年3月4日 17:28
編輯回答
病癮

第二種寫法就和咋們之前定義的時(shí)候是一樣的，{//我們需要執(zhí)行的語句}
你為listitems賦值，卻沒有返回值給他，他只能undefined了！

2017年7月15日 04:39
編輯回答
綰青絲

箭頭函數(shù)并沒有完全理解，再找?guī)讉€(gè)文章讀讀，應(yīng)該就可以了。

const listItems = numbers.map((number) => <li>{ number }</li>);

這種寫法，表明每次循環(huán)都要返回一個(gè)<li>{ number }</li>，相當(dāng)于

const listItems = numbers.map((number) => { return <li>{ number }</li> });

注意箭頭函數(shù)的寫法，

numbers.map((number) => number)

相當(dāng)于

numbers.map((number) => {return number})

相當(dāng)于

number.map(function(number){
    return number
})

注意箭頭函數(shù)回調(diào)部分的大括號。

所以你第二種寫法，并沒有告訴js該返回什么東西，所js就返回一個(gè)undefined的給你的數(shù)組。

2018年9月4日 12:32
編輯回答
心上人
var f = () => 5;
// 等同于
var f = function () { return 5 };

var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
  return num1 + num2;
};

箭頭函數(shù)右側(cè)是{}，需要添加return，否則無返回值顯示undefined；

2017年12月23日 14:33