Last active
December 30, 2020 18:38
-
-
Save daaimah123/44d74417207c4a582f0d94d91a01da33 to your computer and use it in GitHub Desktop.
Notes for Jonas Schmedtmann's lecture on the spread operator, rest pattern, and rest parameters https://udemy.com/course/the-complete-javascript-course/learn/lecture/22648441#overview
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const restaurant = { | |
name: 'Classico Italiano', | |
location: 'Via Angelo Tavanti 23, Firenze, Italy', | |
categories: ['Italian', 'Pizzeria', 'Vegetarian', 'Organic'], | |
starterMenu: ['Focaccia', 'Bruschetta', 'Garlic Bread', 'Caprese Salad'], | |
mainMenu: ['Pizza', 'Pasta', 'Risotto'], | |
openingHours: { | |
thu: { | |
open: 12, | |
close: 22, | |
}, | |
fri: { | |
open: 11, | |
close: 23, | |
}, | |
sat: { | |
open: 0, // Open 24 hours | |
close: 24, | |
}, | |
}, | |
order: function(startIndex, mainIndex){ | |
return [this.starterMenu[startIndex], this.mainMenu[mainIndex]] | |
}, | |
orderPizza: function(mainIngredient, ...otherIngredients){ | |
console.log({mainIngredient}); | |
console.log({otherIngredients}); | |
} | |
}; | |
================================================= Spread Operator ================================================= | |
Works on all iterables (strings, maps, sets, arrays) | |
Expands an array into all of its elements individually > const arr = [7, 8, 9]; | |
can only be used in places where values separated by commas > const newArr = [1, 2, ...arr]; | |
> console.log(newArr); | |
[1, 2, 7, 8, 9] | |
> console.log(...newArr); | |
1 2 7 8 9 | |
Shallow Copy > const mainMenuCopy = [...restaurant.mainMenu]; | |
Join Two Arrays > const newMenu = ['Tikka Masala', 'Vegetable Biryani Rice', 'Yellow Curry']; | |
> console.log([...mainMenuCopy, ...newMenu]); | |
(6) ["Pizza", "Pasta", "Risotto", "Tikka Masala", "Vegetable Biryani Rice", | |
"Yellow Curry"] | |
Strings > const str = "Daaimah"; | |
cannot be used in string literals > const letters = [...str]; | |
> console.log(letters); | |
(7) ["D", "a", "a", "i", "m", "a", "h"] | |
> console.log(...str); | |
D a a i m a h | |
================================================= Rest Pattern ================================================= | |
On left side of = operator > const arr = [1, 2, ...[3, 4]]; | |
takes remaining elements and compresses them into an array > const [a, b, ...others] = [1, 2, 3, 4, 5]; | |
must always be the last in the destructuring assignment > console.log(a, b, others); | |
can only ever be one rest pattern in one assigment 1 2 [3, 4, 5] | |
> const [pizza, , risotto, ...otherFood] = [...restaurant.mainMenu, | |
...restaurant.starterMenu]; | |
> console.log(pizza, risotto, otherFood); | |
Pizza Risotto ["Focaccia", "Bruschetta", "Garlic Bread", "Caprese Salad"] | |
Destructure into an object > const { sat, ...weekdays } = restaurant.openingHours; | |
> console.log({sat}, weekdays); | |
{sat: {open: 0, close: 24}} {thu: {open: 11, close: 23}, fri: {open: 12, close: 22}} | |
================================================= Rest Parameter ================================================= | |
using rest within function as parameter const add = function(...numbers) { | |
let sum = 0; | |
for (let i = 0; i < numbers.length; i++){ | |
sum += numbers[i]; | |
console.log(sum); | |
} | |
} | |
add(2, 3); | |
add(5, 3, 7, 2); | |
add(8, 2, 5, 3, 1, 4); | |
const x = [23, 5, 7]; | |
add(...x); | |
> restaurant.orderPizza('mushrooms', 'tomatoes', 'spinach'); | |
{mainIngredient: "mushrooms"} | |
{otherIngredients: ["tomatoes", "spinach"]} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment