chore(curriculum): add JS array transcripts (freeCodeCamp#58461)

Co-authored-by: Tom <20648924+moT01@users.noreply.github.com>

Author: Dario-DC

curriculum/challenges/english/25-front-end-development/lecture-working-with-arrays/67329f508a6ec45b046700b3.md

@@ -10,6 +10,41 @@ dashedName: what-are-the-key-characteristics-of-javascript-arrays
 
 Watch the video lecture and answer the questions below.
 
+# --transcript--
+
+What are key characteristics of JavaScript arrays?
+
+An array in JavaScript is an ordered collection of values, each identified by a numeric index. The values in a JavaScript array can be of different data types, including numbers, strings, booleans, objects, and even other arrays.
+
+To create an array in JavaScript, you can use square brackets, `[]`, and separate the values with commas. Here's an example:
+
+```js
+let fruits = ["apple", "banana", "orange"];
+```
+
+In this example, we declare a variable `fruits` and assign it an array containing three string values: `apple`, `banana`, and `orange`.
+
+One of the key characteristics of arrays is that they are zero-indexed, meaning that the first element in an array has an index of `0`, the second element has an index of `1`, and so on. You can access individual elements in an array using their index. For example:
+
+```js
+let fruits = ["apple", "banana", "orange"];
+console.log(fruits[0]); // "apple"
+console.log(fruits[2]); // "orange"
+```
+
+In this example, we use the index `0` to access the first element (`apple`) and the index `2` to access the third element (`orange`).
+
+Arrays in JavaScript have a special `length` property that returns the number of elements in the array. You can access this property using the `length` keyword. For example:
+
+```js
+let fruits = ["apple", "banana", "orange"];
+console.log(fruits.length); // 3
+```
+
+Another key characteristic of arrays in JavaScript is that they are dynamic, meaning that their size can change after they are created. You can add or remove elements from an array using various array methods, such as `push()`, `pop()`, `shift()`, `unshift()`, `splice()`, and more. These methods will be taught in upcoming lectures videos.
+
+JavaScript arrays are versatile and useful when it comes to data storage inside your programs. Throughout this module, you'll get to see firsthand how working with arrays will help you efficiently manage and manipulate collections of data.
+
 # --questions--
 
 ## --text--
@@ -94,7 +129,7 @@ Remember that arrays in JavaScript are zero-indexed.
 What will be the output of the following code?
 
 ```js
-let colors = ['red', 'green', 'blue'];
+let colors = ["red", "green", "blue"];
 console.log(colors.length);
 ```
 

curriculum/challenges/english/25-front-end-development/lecture-working-with-arrays/6732aebaa8abb9086a9bb17a.md

@@ -10,6 +10,43 @@ dashedName: how-do-you-access-and-update-elements-in-an-array
 
 Watch the lecture video and answer the questions below.
 
+# --transcript--
+
+How do you access and update elements in an array?
+
+In the previous lecture video, you were first introduced to working with arrays and accessing different elements from arrays. Here is a reminder on how to access the second element from an array:
+
+```js
+const fruits = ["apple", "banana", "cherry"];
+
+console.log(fruits[1]); // "banana"
+```
+
+Since arrays are zero based indexed, the first element will be at index `0`, the second index will be at index `1`, etc. It's important to note that if you try to access an index that doesn't exist in the array, JavaScript will return `undefined`. 
+
+```js
+let fruits = ["apple", "banana", "cherry"];
+console.log(fruits[3]); // undefined
+```
+
+In this example, there is no index `3` for the `fruits` array. So the log will show `undefined`. Now, let's look at how to update elements in an array. You can update an element by assigning a new value to a specific index. 
+
+```js
+let fruits = ["apple", "banana", "cherry"];
+fruits[1] = "blueberry";
+console.log(fruits); // ["apple", "blueberry", "cherry"]
+```
+
+In this example, we've replaced `banana` with `blueberry` at index `1`. This method allows you to change any element in the array, as long as you know its index. You can also add new elements to an array by assigning a value to an index that doesn't yet exist:
+
+```js
+let fruits = ["apple", "banana", "cherry"];
+fruits[3] = "date";
+console.log(fruits); // Outputs: ["apple", "blueberry", "cherry", "date"]
+```
+
+However, exercise caution when doing this. If you assign a value to an index that is much larger than the current length of the array, you will create undefined elements for the indices in between, which can lead to unexpected behavior. As you continue to work with JavaScript, you'll find that these ways of accessing and updating array elements are fundamental to many programming tasks. Whether you're building a simple todo list or processing complex data structures, these skills will be invaluable.
+
 # --questions--
 
 ## --text--

curriculum/challenges/english/25-front-end-development/lecture-working-with-arrays/6732aec982904608b637716b.md

@@ -10,6 +10,66 @@ dashedName: how-do-you-add-and-remove-elements-from-the-beginning-and-end-of-an-
 
 Watch the lecture video and answer the questions below.
 
+# --transcript--
+
+How do you add/remove elements from the beginning and end of an array?
+
+Arrays in JavaScript are dynamic, which means you can easily add or remove elements from them. There are four main methods for adding and removing elements from the beginning and end of an array: `push()`, `pop()`, `shift()`, and `unshift()`. Let's explore each of these methods in detail.
+
+The `push()` method is used to add one or more elements to the end of an array. The return value for the `push()` method is the new length of the array. Here's an example of adding a new fruit to the existing `fruits` array:
+
+```js
+const fruits = ["apple", "banana"];
+const newLength = fruits.push("orange");
+console.log(newLength); // 3
+console.log(fruits); // ["apple", "banana", "orange"]
+```
+
+In this example, we start with an array called `fruits` which contains two elements. We then use the `push()` method to add the string `orange` to the end of the array.
+
+You might have noticed that we are using `const` when declaring the `fruits` array. But why is it possible to add more elements to this `fruits` array when `fruits` is a constant? This is possible because declaring an array with the `const` keyword creates a reference to the array. While the array itself is mutable and can be modified, you cannot reassign a new value to the `fruits` constant, like this:
+
+```js
+const fruits = ["apple", "banana"];
+fruits = ["This", "will", "not", "work"];
+console.log(fruits); // Uncaught TypeError: Assignment to constant variable. 
+```
+
+The next method we will look at is the `pop()` method. The `pop()` method removes the last element from an array and returns that element. It also modifies the original array. Here's how it works:
+
+```js
+let fruits = ["apple", "banana", "orange"];
+let lastFruit = fruits.pop();
+console.log(fruits); // ["apple", "banana"]
+console.log(lastFruit); // "orange"
+```
+
+In this example, we start with an array of three fruits. The `pop()` method removes the last element (`orange`) from the array and returns it. The original `fruits` array is modified and contains only two elements.
+
+The `unshift()` method adds one or more elements to the beginning of an array and returns its new length. It works similarly to `push()`, but modifies the start of the array instead of the end. Here's an example:
+
+```js
+let numbers = [2, 3];
+let newLength = numbers.unshift(1);
+console.log(numbers); // [1, 2, 3]
+console.log(newLength); // 3
+```
+
+In this example, we use `unshift()` to add the number `1` to the beginning of the `numbers` array. The method returns the new length of the array, which is `3`.
+
+Finally, the `shift()` method removes the first element from an array and returns that element. It's similar to `pop()`, but it works at the beginning of the array instead of the end. Here's how it works:
+
+```js
+let colors = ["red", "green", "blue"];
+let firstColor = colors.shift();
+console.log(colors); // ["green", "blue"]
+console.log(firstColor); // "red"
+```
+
+In this example, we start with an array of three colors. The `shift()` method removes the first element (`red`) from the array and returns it. The original `colors` array is modified to contain only two elements.
+
+Note that while `push()` and `unshift()` can add multiple elements at once, `pop()` and `shift()` remove only one element at a time.
+
 # --questions--
 
 ## --text--
@@ -60,35 +120,35 @@ Consider the order of operations and what each method does to the array.
 What will be the output of the following code?
 
 ```js
-let arr = ['a', 'b', 'c', 'd'];
+let arr = ["a", "b", "c", "d"];
 let first = arr.shift();
 let last = arr.pop();
 console.log(first, last, arr);
 ```
 
 ## --answers--
 
-`'a' 'd' ['b', 'c']`
+`"a" "d" ["b", "c"]`
 
 ---
 
-`'d' 'a' ['b', 'c']`
+`"d" "a" ["b", "c"]`
 
 ### --feedback--
 
 Remember that `shift()` removes from the beginning and `pop()` removes from the end.
 
 ---
 
-`'a' 'b' ['c', 'd']`
+`"a" "b" ["c", "d"]`
 
 ### --feedback--
 
 Remember that `shift()` removes from the beginning and `pop()` removes from the end.
 
 ---
 
-`'b' 'c' ['a', 'd']`
+`"b" "c" ["a", "d"]`
 
 ### --feedback--
 
@@ -103,35 +163,35 @@ Remember that `shift()` removes from the beginning and `pop()` removes from the
 What will be the result of the following code?
 
 ```js
-let arr = ['a', 'b', 'c'];
-arr.unshift('x', 'y');
+let arr = ["a", "b", "c"];
+arr.unshift("x", "y");
 arr.pop();
 console.log(arr);
 ```
 
 ## --answers--
 
-`['x', 'y', 'a', 'b']`
+`["x", "y", "a", "b"]`
 
 ---
 
-`['x', 'y', 'a', 'b', 'c']`
+`["x", "y", "a", "b", "c"]`
 
 ### --feedback--
 
 Pay attention to the order of operations and what each method does to the array.
 
 ---
 
-`['a', 'b', 'x', 'y']`
+`["a", "b", "x", "y"]`
 
 ### --feedback--
 
 Pay attention to the order of operations and what each method does to the array.
 
 ---
 
-`['y', 'x', 'a', 'b']`
+`["y", "x", "a", "b"]`
 
 ### --feedback--
 

curriculum/challenges/english/25-front-end-development/lecture-working-with-arrays/6732aed2ac3d3c08f6149dd6.md

@@ -10,6 +10,52 @@ dashedName: what-is-the-difference-between-one-dimensional-and-two-dimensional-a
 
 Watch the lecture video and answer the questions below.
 
+# --transcript--
+
+What is the difference between one-dimensional and two-dimensional arrays?
+
+In programming, arrays are fundamental data structures used to store collections of elements. Understanding the difference between one-dimensional and two-dimensional arrays is crucial for organizing and manipulating data effectively. Let's explore these concepts in a way that's easy for beginners to grasp.
+
+A one-dimensional array, often called an array, is like a single row of boxes. Imagine you have a line of storage lockers at a train station. Each locker can hold one item, and you can access any locker directly if you know its number.
+
+In programming terms, each item in a one-dimensional array is accessed using a single index. For example, in JavaScript, you might create and use a one-dimensional array like this:
+
+```js
+let fruits = ["apple", "banana", "cherry", "date"];
+console.log(fruits[2]); // Outputs: "cherry"
+```
+
+Here, `fruits` is a one-dimensional array. You can think of it as a single row of fruit names. To access any fruit, you use one number (the index) inside square brackets.
+
+Now, let's move on to two-dimensional arrays. If a one-dimensional array is like a single row of lockers, a two-dimensional array is like a grid of lockers – multiple rows and columns. In programming, a two-dimensional array is essentially an array of arrays. It's used to represent data that has a natural grid-like structure, such as a chessboard, a spreadsheet, or pixels in an image.
+
+To access an element in a two-dimensional array, you need two indices: one for the row and one for the column. Here's an example of how you might create and use a two-dimensional array in JavaScript:
+
+```js
+let chessboard = [
+    ["R", "N", "B", "Q", "K", "B", "N", "R"],
+    ["P", "P", "P", "P", "P", "P", "P", "P"],
+    [" ", " ", " ", " ", " ", " ", " ", " "],
+    [" ", " ", " ", " ", " ", " ", " ", " "],
+    [" ", " ", " ", " ", " ", " ", " ", " "],
+    [" ", " ", " ", " ", " ", " ", " ", " "],
+    ["p", "p", "p", "p", "p", "p", "p", "p"],
+    ["r", "n", "b", "q", "k", "b", "n", "r"]
+];
+
+console.log(chessboard[0][3]); // Outputs: "Q"
+```
+
+In this example, `chessboard` is a two-dimensional array representing a chess game's initial setup. To access the queen (`Q`) in the top row, we use two indices: `[0][3]`. The first index, `0`, selects the first row, and the second index, `3`, selects the fourth column in that row.
+
+The key difference between one-dimensional and two-dimensional arrays lies in how you access and organize the data. One-dimensional arrays use a single index and are suitable for linear data like lists or sequences. Two-dimensional arrays use two indices and are ideal for grid-like data structures.
+
+It's worth noting that in JavaScript, two-dimensional arrays are actually arrays of arrays. This means each element of the outer array is itself an array. This nested structure allows for great flexibility but also requires careful handling to avoid errors.
+
+As you progress in your programming journey, you'll find that choosing between one-dimensional and two-dimensional arrays depends on the nature of your data and how you need to manipulate it. 
+
+One-dimensional arrays are simpler and sufficient for many tasks, while two-dimensional arrays become invaluable when dealing with more complex, structured data.
+
 # --questions--
 
 ## --text--