Declare Read-Only Array Types in TypeScript

Instructor: [0:00] Here we have a generic function called intersperse that defines a single type parameter T. It accepts an array of values of type T array. It accepts a separator value of type T.

[0:13] This function returns a new array of type T that has the separator value interspersed between all of the array elements. Let's say, we've defined an array of values A, B, and C.

[0:26] We're going to pass this array to the interspersed function and we're going to sprinkle in the value x. What we're going to get back is a new array which we're going to store in the variable, values with separators. Go ahead and log both arrays to the console.

[0:43] I'm going to open the terminal, compile our typescript project, and execute the result in JavaScript file in node. As you can see, here we have the two arrays as expected. Note that our values variable is inferred to be of type string array.

[1:00] That's because we've initialized the variable with an array of strings. Alternatively, we could have also explicitly typed our variable as a string array. Now let's see what happens when we make our array type read-only.

[1:14] If you have a read-only array type, typescript will give you a type error if you're trying to mutate the array. For example, we cannot push additional values into the array and we also cannot remove existing values from the array.

[1:27] We get a type error saying that property push does not exist and property pop does not exist on type read-only string array. If we had been using a mutable array type here, both operations would have been type correct.

[1:42] We also get a type error in line 13 saying that the argument of type read-only string array is not assignable to a parameter of type string array. That's because the parameter of type string array is considered to be mutable.

[1:55] We can solve this issue by changing the type of our array parameter to read-only TRA. We're not mutating the array within our interspersed function. Working with a read-only array type is enough for us.

[2:09] Notice that even if the parameter is a read-only array, we can still parse a mutable array to it. It just means that within the function, we cannot access mutating methods on the array.

[2:21] There is another syntax for defining a read-only array type and that is using the read-only array type and parsing it a generic type argument. They're interchangeable so you can use whichever version you prefer.

[2:35] I prefer the version using the read-only keyword just because it looks closer to how we would usually be declaring an array type using the square bracket notation.