Original subtitles

1 1

In this short video, 2

2

let's quickly gonna talk about statics methods. 3

3

Now a good example to understand 4

4

what a static method actually is, 5

5

is the build in Array.from method. 6

6

And let's just do that here in the console. 7

7

so remember that we have the Array.from method 8

8

which converts any array like structure to a real Array. 9

9

So for example document.query selector. 10

10

All right. 11

11

So that's an error right there and so you see, 12

12

this now return an Array to us. 13

13

And for some reason it is empty. 14

14

And that's because query selector 15

15

doesn't return any note list. 16

16

So lets try query selector all, 17

17

and so now indeed we get an Array here. 18

18

But that's not really the point, 19

19

what's the point is that this from method here 20

20

is really a method that is attached 21

21

to the Array constructor. 22

22

So we could not use the from method on an Array. 23

23

So this is not gonna work. 24

24

All right. 25

25

So from is not a function. 26

26

And so that is because this from method here 27

27

is really attached to the entire constructor, 28

28

so the Array constructor 29

29

and not to the prototype property of the constructor. 30

30

All right. 31

31

And so therefore all the Arrays do not inherit this method. 32

32

Again because its not on their prototype. 33

33

Its simply attached to the constructor itself. 34

34

So Array.from here is basically just a simple function, 35

35

but its a function that's attached to the Array constructor. 36

36

And the reason for that is simply, 37

37

so that developers know that it is related to Arrays. 38

38

We also say that the from method is in the Array name space. 39

39

And we actually used that term before for some methods 40

40

in the number and in the internationalization name space. 41

41

Remember for example numbers.parsefloat. 42

42

So that's the same thing. 43

43

Okay. 44

44

So this method is another static method 45

45

and its static on the number constructor. 46

46

So its not available on numbers, 47

47

but only on this very constructor. 48

48

All right. 49

49

So these are some good examples that we understand 50

50

what a static method is. 51

51

And we usually use these kind of as helpers, 52

52

that should be related to a certain constructor. 53

53

And so maybe you can imagine that it should be pretty easy 54

54

to implement static methods or selfs. 55

55

And let's do that for both or constructor function 56

56

and also for the class. 57

57

So here I already have the constructor function 58

58

that we wrote right in the beginning of the section. 59

59

So this person here and to add a static method, 60

60

all we have to do is write, 61

61

person and let's say I want to create a very simple 62

62

hey function 63

63

okay. 64

64

So which simply like waves when we call it. 65

65

So lets just say console.log, 66

66

hey there. 67

67

And then maybe some emojis so we can actually 68

68

see it better in the console. 69

69

And so now in order to call this, it is pretty easy. 70

70

We just have to do 71

71

person.hey 72

72

and that's it. 73

73

So somewhere up here we now should get this hey there. 74

74

Great but of course this one is not inherited. 75

75

So just like we cannot call the from method on an Array. 76

76

we cannot say Jonas.hey 77

77

because it is simply not in the prototype of 78

78

the Jonas object. 79

79

So there's noway that the Jonas object could inherit it. 80

80

All right. 81

81

Now just let's just take a look at the disc key word, 82

82

but this again should be pretty obvious. 83

83

And so that's essentially the entire 84

84

constructor function here. 85

85

And the reason for that is because, 86

86

that is exactly the object that is calling the method. 87

87

And so as always that is basically the rule. 88

88

So whatever object is calling the method, 89

89

will be the disc key word inside of that function. 90

90

And so here the disc key word, 91

91

is simply that entire constructor function. 92

92

Great. 93

93

And now let's quickly take this do the same in class, 94

94

where it is even easier. 95

95

So here to create a static method, 96

96

all we need to do is to add the static keyword. 97

97

So static hey 98

98

and then that's it. 99

99

So let's just write it here so that is a static method. 100

100

While these ones is called instance method. 101

101

So as it says here these are methods 102

102

that will be added to the prototype property, 103

103

so that all instances can have access to them. 104

104

And therefore the name instance methods, 105

105

okay. 106

106

And now we can simply, let's do it here at the end. 107

107

Can simply do personcl.hey. 108

108

And so again we get hey there and this time, 109

109

disc key word points to the entire class. 110

110

All right. 111

111

So keep in mind that these static methods 112

112

are not available on the instances, 113

113

and sometimes they are still useful to implement 114

114

some kind of helper function about a class 115

115

or about a constructor function.