If you want to determine your career and reach a better level in that field, you should definitely follow the technologies. At least you should stay up to date. Especially if you are at the beginning of the road like me, these processes will tire you a little. If this job is a hobby for you, this process will be fun.
I have difficulty remembering the syntax. That's why I always follow the syntax of the technologies I am new to through a sample project to remember them. This way, it is easier to write. When I start a new technology, my focus is on understanding its logic. The part of understanding this logic takes less time when it is in the market.
There will be code sections in this article because I will come back and look at it later. In fact, you can use this as a cheatsheet.
TypeScript Types
Let's examine the most commonly used ones in a code block, I guess.
let name: string = "berat"; // should be string type.
let age: number; // should be number type
let phone: any; // can be any type
let technologies: string[]; // a string array
age = 22;
phone = "555 555 55 55";
technologies = ["React", "Redux"];
console.log(`${name}, ${age}, ${phone}, ${technologies.join(" - ")}`); // "berat, 22, 555 555 55 55, React - Redux"
I tweeted because I couldn't figure out the enum
logic in my head and I can say that I understood it a little bit as a result of the response.
As far as I understand, it allows you to not leave the type structure defined with enum. But in my opinion, it is easier to use string literal union
instead.
I usually don't know these terms and I'm not used to them. But after a certain point, it is necessary to know and be informed about them. That's why I learn them by using them.
enum Sizes {
small = "10px",
medium = "50px",
large = "100px"
}
console.log(`The product was ${Sizes.medium} the size.`) //"The product was 50px the size."
Tuple
is a type that you can use if the type of elements in a fixed array is known.
let errors: [number, string];
errors = [404, "Not found!"];
One of the other types is unknown
. The only difference with Any is that if you have a variable whose type you have previously determined, you cannot assign the variable you defined as unknown to that variable. Let's give an example.
let status = true;
let a: any = status; // works
let b: unknown;
status = b; // throw error
Object Type
Determining the object type.
let user: {
name: string,
age: number,
phone: any,
salary: () => number,
};
user = {
name: "Berat",
age: 22,
phone: 5555555555,
};
TypeScript Union Type
In short, it allows you to limit the values that a variable can take or assign values of several different types.
let role: {
role: "admin" | "user", // can only take the value admin or user.
id: string | number, // value can be of type string or number.
};
TypeScript Functions
const print = (
name: string,
age: number,
id: string | number,
phone?: string
): any => {
return `${name} ${age} ${id} ${phone}`;
};
print("Berat", 22, 11111111111);
I tried to explain the whole thing with a single function. Now let's see what's going on;
name: string
We send parameters like this. As we used before.
number?: string
Here the ?
sign comes into play. If we don't have to take this parameter, we use a question mark. If we don't use a question mark and this parameter doesn't come, the code will give an error.
(...) : any
function will return a value and we say that this value must be of any
type.
Since I am currently actively using the topics I mentioned above, I created this article on them. I am sure that I will be very interested in sections such as classes and interfaces in the future. We will update this article then :)
Actually, I would like to do a project about TypeScript, but as far as I examined the sample projects and videos, it did not seem like such a complicated thing. So it would be enough to just note down the general features somewhere.
Resources