- Recognize different types of function syntax
Arrow functions are a cool new feature of ES6. They introduce a different syntax and carry slightly different behavior than function expressions.
Take a look at the following code examples and return values with your table partners. Without looking anything up, see if you can deduce the differences and similarities in how arrow functions behave.
const playMusic = function (music) {
return "Playing some " + music;
};
playMusic("Jazz"); // "Playing some Jazz"const playMusic = (music) => {
return "Playing some " + music;
};
playMusic("Jazz"); // "Playing some Jazz"const playMusic = (music) => {
"Playing some " + music;
};
playMusic("Jazz"); // undefinedconst playMusic = (music) => "Playing some " + music;
playMusic("Jazz"); // "Playing some Jazz"const playMusic = music => "Playing some " + music;
playMusic("Jazz"); // "Playing some Jazz"const readBooks = (book1, book2) => {
return `I read '${book1}' and '${book2}'`;
};
readBooks("The Old Man and the Sea", "1984"); // "I read 'The Old Man and the Sea' and '1984'"const readBooks = (book1, book2) => `I read '${book1}' and '${book2}'`;
readBooks("The Old Man and the Sea", "1984"); // "I read 'The Old Man and the Sea' and '1984'"const readBooks = book1, book2 => `I read '${book1}' and '${book2}'` // Syntax Error
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent