UI.dev TypeScript Flashcards

1
Q

What is the main goal of TypeScript?

A

To get rid of the problem of having variables of the wrong type.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

What is TypeScript a combination of?

A

A compiler and a linter.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Any JavaScript program is also a valid TypeScript Program? Yah or Nah?

A

Yah - you don’t have to rewrite your whole app at the start.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

In what way is TypeScript like ESLint?

A

It’s a static validation tool.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

In addition to getting rid of having vairables of the wrong type - what is another goal of TypeScript?

A

To increase your confidence that the program behaves the way it is supposed to without unexpected bugs.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

The thing I love about TypeScript is that when you run your code, you do it to see if it works as intended, not to see if it works.

A

Just a well put quote from Donovon West, that’s all. From Twitts.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

TypeScript replaces ESLint and Automated Tests, right?

A

Nah, brah. It works with them to give you more confidence that the code is working correctly without having to run it - but it doesn’t replace them.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

TypeScript is a run-time language.

A

No. All of the types are removed at compile time. It’s just there to encourage you to use the types to add chacks so you have fewer errors and bugs.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

What escape hatches does TypeScript provide when you just can’t nail down a Type?

A

There’s both the Any type and @ts-ignore, which turns off the type checker for those parts of your code.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

How does TypeScript help you navigate a codebase?

A

Type Annotation takes the guess work out of figuring out how a program works and serves as a guide to others in your codebase.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

How does TypeScript help with refactoring?

A

It checks your change against any other files that might be affected and warns you if anything is broken. Then you just follow the warnings and update things. All without having to run the code!

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Explain compile time vs. run time

A

Anything that happens before your code is executed is Compile Time - anything that happens after you execute your code is Run Time.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Explain Dynamic Types vs. Static Types

A

Languages like Java and C++ expect variables to always be the same type after they are declared. They use static, or unchanging, types.

Other languages, like JavaScript and Python, let you change the type of variables at runtime. These use dynamic types.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

What is a Type Error?

A

This is when the program throws an error because a value of one type was used when the program was expecting another type. This happens when we use numbers in place of strings, or if we try to call a function, only to findout it is really undefined.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

What is Type Safety?

A

Type Safety is eliminating type errors by ensuring types are only used in the correct place. This usually happens by having a compiler warn you when you use a type in the wrong way.

There are varying degrees of type safety, from incredibly rigid with a low chance of type errors to more flexible with a higher chance of type errors.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

What is Static Analysis (aka Static Validation)?

A

This is when a tool analyzes your code without executing it. This can give you some insights into ways to improve your code and can warn you of errors before you run your code.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

What the hey is a compiler?

A

A compiler is a program that takes code and transofrms it into another format.

Typically compilers convert code into machine code which is run directly by the CPU, but other compilers, like TypeScript, convert from one programming language (TypeScript) to another programming language (JavaScript)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

What is a Type Annotation?

A

Just a small bit of code that tells TypeScript what type a value or variable is.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

What is a Type Declaration?

A

A file with the .d.ts extension which only holds type definitions for a JavaScript library.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

How are numbers stored in JavaScript?

A

As Floats - so you use the same type for both integers and decimal values. There are also values for infinity, negative infinity, and NaN.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

What method can you use on the Number class to check if a number is imaginary or not?

A

Number.isNaN()

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

What is the BigInt type?

A

It was introduced in ES2019, and it lets you represent very large integers. It is created by putting a lowercase n at the end of our number literal:

const someBigNumber = 1337n

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

What is the deal with Symbols?

A

“They are unique and immutable. Every symbol you create is never going to equal another symbol, even if they are passed the same description as an argument.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

What is the bug related to using typeof to check null?

A

“It instead returns ““object””, so if you’re checking for null values you shoudl do it with an equivalency instead:

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
Q

What is Hyrum’s Law?

A

If there’s a bug within the system, someone will inevitably come to depend completely upon that bug.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
26
Q

What is the difference between a structured type and a primitive type?

A

A structured type shapes the primitive types to represent more complex data structures.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
27
Q

What is the basic structural type?

A

An object

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
28
Q

How are structural types compared?

A

By reference, not by value. So, two objects with the exact same properties wil not equal each other.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
29
Q

What if we cloned a structured type and compared it to what we cloned it from?

A

They would be equal, because these are two instances of the same object.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
30
Q

What’s the difference between arrays and objects?

A

Arrays use numbers instead of strings or symbols to index the properties, so their values are ordered.

31
Q

How can we check if something is an array? (Not just an object, which is what we get with typeOf)

A

Array.isArray(myHopefulArray)

32
Q

When were classes introduced in JS?

A

2015

33
Q

How is a class defined in JS?

A

With the class keyword and with a constructor function which takes parameters and uses those to construct a particular class instance, assigning the properties to the Object.

34
Q

How can you check if an object is an instance of a specific class?

A

“The instanceof method:

35
Q

What are the primitive types?

A

SUS BNB (you don’t wanna stay there):

Symbol

Undefined

String

Boolean

Number

BigInt

36
Q

What are the structural types?

A

CAFO - like the bad farms

Classes

Arrays

Functions

Objects

37
Q

How do you initialize the tsconfig.json file?

A

You run tsc –init this tells Typescript how we want it to run its compiler.

38
Q

What is tsc?

A

Thy typescript command line tool. We run it to compile our code into Javascript and to type check.

39
Q

Which typescript config lets us choose what version of JavaScript the compiler will transform our code into? (For instance, if we need to target older browsers, like IE 11)

A

target

40
Q

Which typescript default lets us change how our import and exports are transformed in the final JavaScript output?

A

module

41
Q

Which typescript module do you want to use if you’re using Node or a bundler like Webpack?

A

CommonJS

42
Q

Which tsconfig default tells TypeScript to expect every file to be a module? (That is, it must have an import or export statement)

A

isolateModules

43
Q

How can you turn a javascript file into a module?

A

Just add export default {} to the end of it.

44
Q

What does strict do in the tsconfig file?

A

Strict lets us control how strict the type checker is. There are options below it in the file to tweak individual things, but just setting strict true is the same as setting all the possibilities to true, which is what we want to get the most benefits out of TypeScript.

45
Q

What does the noImplicitAny setting in tsconfig do?

A

It makes you specify Any if that’s what you want, instead of the compiler assuming that’s what you meant and letting type-based bugs to slip through.

46
Q

Which tsconfig setting makes it so that if we try to access ‘this’, Typescript warns us to make a type annotation so that we know what properties we can expect to find on this?

A

noImplicitThis

47
Q

What does the strictNullChecks setting in tsconfig do?

A

If turned on, TypeScript will warn us any time that a variable could be null. This avoids the dreded ‘Cannot read property of undefined’ errors.

48
Q

Name a top error that you’ve run into so many times that TypeScript helps us eradicate.

A

”"”Cannot read property of undefined.”””

49
Q

What does the strictPropertyInitialization property in tsConfig do?

A

It tells TypeScript whether to warn us if any of our class properties aren’t initialized in the constructor. That would mean that the property is undefined, which always leads to weird bugs.

50
Q

Which setting in TypeScript config makes CommonJS and ES Modules play nicely with each other? (Needed when working with NPM packages)

A

esModuleInterop

51
Q

Which tsconfig setting tells TypeScript to skip what’s in node_modules so the compiler and type_checker can run faster? (meaning we trust the type definitions for the packages imported to be accurate)

A

skipLibCheck

52
Q

What doe sthe forceConsistenCasingInFileNames setting in TypeScript mean?

A

Some linux systems have case sensitive file systems. On these, MyFile.ts can’t be accessed by importing from myFile.ts. By forcing consistent casing, you fix the problem where it works on your local machine but not on the live one due to this issue.

53
Q

If you assign a string literal to a variable, what can TypeScript infer?

A

That the type of the variable is string.

54
Q

What happens to typing when you pull properties of an object into their own variables with destructuring?

A

No worries! They still have the correct type.

55
Q

What will TypeScript do when you create an array literal?

A

Infer the type of the array. Hooray!

56
Q

How does TypeScript denote arrays of a type?

A

It uses two square brackets after the type. For example: String[]

57
Q

TypeScript can infer the types of variables based on the context where they’re created. What does that mean?

A

By that, we mean that when we run .map on an array, the first parameter’s type will be the type of an array item and the second parameter will be a number representing the current index. So we don’t have to tell typescript anything about our types in that case - it already knows.

58
Q

What happens is we transform our array from one type to another?

A

“TypeScript will recognize the transformation:

59
Q

What happens if we create a function and pass that to our array’s map function?

A

“TypeScript can’t infer the parameter types anymore. This is because the function is no longer directly associated with the .map function, so TypeScript can’t directly know how our function will be used.

In the following example, the parameters end up as Any:

60
Q

What does TypeScript’s inference always fall back to?

A

The special Any type.

61
Q

What are the pros and cons of the Any type?

A

It can be handy when it’s difficult to figure out an appropriate type, but we lose basically the whole point of TypeScript. Try to avoid implicit anys - that flag is normally turned on.

62
Q

What’s one great thing that sets TypeScript above other typed languages?

A

It supports implicit type checking - it automatically reads our code and determines the types of values for us so we don’t have to annotate all of our types.

63
Q

When can’t TypeScript implicitly type check our variables?

A

When we define a variable before assigning a value to it - it isn’t going to go back and retroactively apply the type - it’s a one-time thing that happens at declaration.

64
Q

What does TypeScript set the Type to if one isn’t explicitly state, and it can’t implicitly apply one?

A

any

65
Q

Why do we add annotations?

A

To tell TypeScript what type a variable should hold.

66
Q

What does explicit types help avoid?

A

Runtime errors

67
Q

How do we declare a type for a variable?

A

“Put a colon after the variable declatation, followed by the type you want to declare.

68
Q

Types are always title case. T/F

A

FALSE - those are the object variables. Typescript type declarations are always in lowercase.

69
Q

How can you use a variable before a value has been assigned to it?

A

“Normally, TypeScript assumes this isn’t what we want and throws an error. If we want to do it, we put a bang after the variable name, before the colon. Like this:

70
Q

How do we define array types?

A

“Using square brackets after the string type.

71
Q

What’s that old bad way of declaring array types?

A

“Typing Array or whatever type.

72
Q

How do you define Object types?

A

“You place a colon after the property name:

73
Q

How do we restore TypeScript’s type checking to an a value of type any?

A

“We can add annotations - think of a network request - you don’t know what that return data will look like before you get it, so it can be helpful to assign the type afterward: