Passing Functions as Props

React Docs - lists and keys

1. What does .map() return?

• A new array with each element being the result of the callback function.

1. If I want to loop through an array and display each value in JSX, how do I do that in React?

• there is many ways, we can use forEach, forLoop and map.

in for loop it will be like this:

let arr = [1,2,3,4,5];

for(let i = 0; i < arr.length; i++){

console.log(arr[i]) ;}

---

In for Each:

let arr = [1,2,3,4,5];

arr.forEach(element => {

console.log (element);});

---

in .Map:

let arr = [1,2,3,4,5];

let array = arr.map((element) => {

console.log (element);});

---

1. Each list item needs a unique Key.

---

1. What is the purpose of a key?

• React uses keys to figure out which items have changed, been added to, or been removed. To give the elements in the array a stable identity, keys should be assigned to them. A string that uniquely identifies a list item among its siblings is the best approach to choose a key.

---

The Spread Operator

1. What is the spread operator?

• The spread operator is a convenient and fast way to add items to arrays, combine arrays or objects, and spread an array across a function’s arguments.

---

1. List 4 things that the spread operator can do.

• Copying an array
• Using Math functions
• Combining objects
• Combining objects

---

1. Give an example of using the spread operator to combine two arrays.

---

1. Give an example of using the spread operator to add a new item to an array.

---

1. Give an example of using the spread operator to combine two objects into one.

---