To add a string array
type annotation to a variable or a constant, you can declare the variable name followed by a :
(colon) symbol, then the string
type with []
(opening and closing square brackets) symbol.
For example, let's say we have a variable called names
and want to only have the string
type as the values in the array. To do that we can annotate the string
array type to the names
variable like this,
// add string array type to a variable
let names: string[];
After initialization, let's add a string value of John Doe
to the names
array. It can be done like this,
// add string array type to a variable
let names: string[];
// add a string value to the names array
names = ["John Doe"]; // ✅ allowed
As you can see from the above code TypeScript allowed us to add the string value of John Doe
to the string type array names
since the allowed type for the names
array is a string
type.
Now let's try to add another value of number
type 1
to the names
array to see what happens,
// add string array type to a variable
let names: string[];
// add a string value to the names array
names = ["John Doe"]; // ✅ allowed
// add a value of type other than string
names = ["John Doe", 1]; // ❌ not allowed. Type 'number' is not assignable to type 'string'.
You can see that TypeScript will throw an error saying 'Type 'number' is not assignable to type 'string'
, which is also what we want.
Also, we cannot use the push()
method to add a value other than the string
type.
Bonus
When a variable is assigned a value, TypeScript will attempt to determine the type of the variable.
For example, let's declare a variable called cars
and add string
values like Audi
, BMW
, Benz
without actually declaring the string array type annotation as we did above. It can be done like this,
// Typescript infers the type from
// the value it is assigned
let cars = ["Audi", "BMW", "Benz"];
As you can see when you hover over the variable cars
, TypeScript has automatically detected that the variable cars
is a string
array type.
Since the TypeScript has already got the type is of string
array type and whenever we try to reassign a value other than the string
array type, The compiler will throw errors like from the above.
See the execution of the above codes live in codesandbox.
That's all 😃!