No-Primitives data type in TypeScript
Tags: typescript, architecture, coding, codenewbie
Published: 2024-04-24 10:58:14

# No-Primitive Type in TypeScript

### Hello there 👋! I am Birusha Ndegeya.

Now you feel comfortable with those number, string and boolean data. now it time to move to some complex data types which are: 
:white_check_mark: **arrays**, 
:white_check_mark: **object**, 
:white_check_mark: **tuples**, 
:white_check_mark: **enums**, 
:white_check_mark: **type**, 
:white_check_mark: **interface** & 
:white_check_mark: **enums**.

I you want to play around the starter code you can visit my github project [learn-typescript-data-type]() and switch to branch **array-object-tuple-enum**.

# ARRAY

To create an array we need to create a variable that hold the data

```ts
// to create an empty array to takes any values
const arr: any [] = [10, true, "banana"];

console.log(arr); // output: 10, true, banana

```

1. **String Array**

```ts

const names: string[] = [];
names.push("Dylan"); // no error
// names.push(3); // Error: Argument of type 'number' is not assignable to parameter of type 'string'. 

```

**Readonly**

The readonly keyword can prevent arrays from being changed.
```ts
const names: readonly string[] = ["Dylan"];
names.push("Jack"); // Error: Property 'push' does not exist on type 'readonly string[]'.
// try removing the readonly modifier and see if it works? 
```

2. Type inference

TypeScript can infer the type of an array if it has values.

```ts
const numbers = [1, 2, 3]; // inferred to type number[]
numbers.push(4); // no error
// comment line below out to see the successful assignment
numbers.push("2"); // Error: Argument of type 'string' is not assignable to parameter of type 'number'.
let head: number = numbers[0]; // no error 
```

2. **TypeScript Tuple**

Known as Typed Arrays

A tuple is a typed array with a pre-defined length and types for each index.
Tuples are great because they allow each element in the array to be a known type of value.
To define a tuple, specify the type of each element in the array:

```ts

// define our tuple
let ourTuple1: [number, boolean, string];

// initialize correctly
ourTuple1 = [5, false, 'Coding God was here'];
S
// define our tuple
let ourTuple2: [number, boolean, string];

// initialized incorrectly which throws an error
ourTuple2 = [false, 'Coding God was mistaken', 5];

```

**Readonly Tuple**

```ts

// define our readonly tuple
const ourReadonlyTuple: readonly [number, boolean, string] = [5, true, 'The Real Coding God'];
// throws error as it is readonly.
ourReadonlyTuple.push('Coding God took a day off');


let tuple: readonly [number, boolean];
/*
tuple.push(10);
tuple.push(true);

Throws an error
*/

// tuple = [10, true];

console.log(tuple);

```

If you have ever used React before you have worked with tuples more than likely.

useState returns a tuple of the value and a setter function.
```ts
const [firstName, setFirstName] = useState('Dylan');
```
Because of the structure we know our first value in our list will be a certain value type in this case a string and the second value a function.

**Named Tuples**

Named tuples allow us to provide context for our values at each index. 

```ts

const graph: [x: number, y: number] = [55.2, 41.3];

console.log(graph);


```

**Destructuring Tuples**

Since tuples are arrays we can also destructure them.
Example
```ts
const graph: [number, number] = [55.2, 41.3];
const [x, y] = graph;
console.log(x, y);
```

3. **TypeScript Object Types**

```ts

const car: { type: string, model: string, year: number } = {
  type: "Toyota",
  model: "Corolla",
  year: 2009
};

```

TypeScript can infer the types of properties based on their values.

```ts

const car = {
  type: "Toyota",
};
car.type = "Ford"; // no error
car.type = 2; // Error: Type 'number' is not assignable to type 'string'.

```

Index signatures can be used for objects without a defined list of properties.

```ts
const nameAgeMap: { [index: string]: number } = {};
nameAgeMap.Jack = 25; // no error
nameAgeMap.Mark = "Fifty"; // Error: Type 'string' is not assignable to type 'number'. 
```


Now, if you need a starter code, you can visit my [GitHub profile]("https://github.com/BirushaNdegeya/learn-primitives-typescript"). 

Thanks for keeping up with the reading. 

**Happy coding!** 🚀🚀🚚🚚🚚