WEBVTT 1 00:00:01.160 --> 00:00:04.130 Starting from year's 2021. 2 00:00:04.130 --> 00:00:07.600 We can use a feature called "Numeric Separators" 3 00:00:07.600 --> 00:00:09.850 to format numbers in a way 4 00:00:09.850 --> 00:00:11.550 that is easier for us, 5 00:00:11.550 --> 00:00:15.393 or for other developers to read and to understand. 6 00:00:16.980 --> 00:00:18.850 Let's say that we wanted to represent 7 00:00:18.850 --> 00:00:20.760 a really large number. 8 00:00:20.760 --> 00:00:24.113 For example, the diameter of our solar system. 9 00:00:25.320 --> 00:00:27.670 Let's say a diameter, 10 00:00:27.670 --> 00:00:32.670 which is 287,460,000,000. 11 00:00:34.070 --> 00:00:36.640 And just from looking at this number here, 12 00:00:36.640 --> 00:00:41.050 it's really difficult to read and to understand it. 13 00:00:41.050 --> 00:00:45.730 Does this mean like 28 billion or is it just 2 billion 14 00:00:45.730 --> 00:00:48.090 or really what is this number? 15 00:00:48.090 --> 00:00:50.120 It's really hard to read like this. 16 00:00:50.120 --> 00:00:52.363 There is just too many zeros here. 17 00:00:53.970 --> 00:00:55.660 Now to help with this, 18 00:00:55.660 --> 00:00:58.210 when we write a number this large 19 00:00:58.210 --> 00:01:00.010 under normal English language, 20 00:01:00.010 --> 00:01:03.713 we usually use a thousand separator like the comma. 21 00:01:04.650 --> 00:01:07.533 We would write this number like this. 22 00:01:08.640 --> 00:01:10.340 And then it becomes really easy 23 00:01:10.340 --> 00:01:14.993 to immediately see that this means 287,460,000,000. 24 00:01:16.980 --> 00:01:18.440 And now, fortunately, 25 00:01:18.440 --> 00:01:21.380 we can do the same thing in JavaScript as well, 26 00:01:21.380 --> 00:01:23.910 using the new numeric separators. 27 00:01:25.090 --> 00:01:27.930 Numeric separators are simply underscores 28 00:01:27.930 --> 00:01:30.610 that we can place anywhere that we want in 29 00:01:30.610 --> 00:01:32.010 or numbers, 30 00:01:32.010 --> 00:01:36.000 and which will make it really easy to understand 31 00:01:36.000 --> 00:01:38.493 and to parse numbers this large. 32 00:01:39.670 --> 00:01:42.820 Using the underscore here as a thousand separator, 33 00:01:42.820 --> 00:01:44.800 then makes it really easy to understand, 34 00:01:44.800 --> 00:01:45.970 that this number here 35 00:01:45.970 --> 00:01:48.883 means in fact, 287 billion. 36 00:01:51.680 --> 00:01:54.040 Now let's just log it to the console 37 00:01:54.040 --> 00:01:56.433 to see what JavaScript actually sees. 38 00:01:57.460 --> 00:01:59.680 And so here we see that in fact, 39 00:01:59.680 --> 00:02:03.140 the engine basically ignores these underscores. 40 00:02:03.140 --> 00:02:05.210 So these numeric separators. 41 00:02:05.210 --> 00:02:08.040 It simply sees the number itself. 42 00:02:08.040 --> 00:02:09.560 And so what this means, 43 00:02:09.560 --> 00:02:12.063 is that we can actually place the underscores, 44 00:02:12.900 --> 00:02:15.663 the numeric separators, anywhere that we want. 45 00:02:17.860 --> 00:02:19.950 Let's do another example. 46 00:02:19.950 --> 00:02:24.480 Let's call this one price in cents, 47 00:02:24.480 --> 00:02:26.030 and I'm gonna set it to 345_99. 48 00:02:31.170 --> 00:02:33.240 Again, using the underscore here, 49 00:02:33.240 --> 00:02:34.740 then makes it really obvious 50 00:02:34.740 --> 00:02:37.843 that this is actually a price in cents. 51 00:02:39.990 --> 00:02:43.160 Of course the number itself, does again, 52 00:02:43.160 --> 00:02:45.590 not contain the underscore. 53 00:02:45.590 --> 00:02:49.827 And our price is indeed 35,599 cents. 54 00:02:51.470 --> 00:02:53.490 But by placing the underscore here, 55 00:02:53.490 --> 00:02:55.070 it makes it really obvious, 56 00:02:55.070 --> 00:02:57.510 that we have first this value here 57 00:02:57.510 --> 00:03:00.770 and then this other value here in cents. 58 00:03:00.770 --> 00:03:04.690 And in fact, it's so obvious that we could even get rid 59 00:03:04.690 --> 00:03:08.093 of the cents part here in a variable name. 60 00:03:11.400 --> 00:03:13.770 Basically we can use the underscore now 61 00:03:13.770 --> 00:03:18.123 to give meanings to certain parts of our numbers. 62 00:03:18.123 --> 00:03:20.200 Here we said, these are thousands, 63 00:03:20.200 --> 00:03:22.483 and here we said that these are a cents. 64 00:03:25.300 --> 00:03:27.100 Lets try another one. 65 00:03:27.100 --> 00:03:30.373 Lets call this transfer fee. 66 00:03:32.810 --> 00:03:37.010 And here again, we placed the underscore like this. 67 00:03:37.010 --> 00:03:38.010 And so here immediately, 68 00:03:38.010 --> 00:03:43.010 it looks like it is $15 for example and 0 cents. 69 00:03:43.340 --> 00:03:45.703 But if we did the same thing like this, 70 00:03:48.060 --> 00:03:50.000 so placing to underscore here, 71 00:03:50.000 --> 00:03:53.633 then it suddenly looks like 1_500. 72 00:03:55.140 --> 00:03:58.590 While in fact it is the exact same number. 73 00:03:58.590 --> 00:04:01.140 Both of them are exactly 1,500. 74 00:04:01.140 --> 00:04:02.980 But just the underscore alone, 75 00:04:02.980 --> 00:04:04.500 gives them different meanings. 76 00:04:04.500 --> 00:04:06.680 And so we can use that to our advantage, 77 00:04:06.680 --> 00:04:09.833 whenever we write numbers in or JavaScript code. 78 00:04:13.250 --> 00:04:18.250 Another variable here, called PI. 79 00:04:18.300 --> 00:04:20.560 And this one is to show you some restrictions 80 00:04:20.560 --> 00:04:22.733 as to where we can place the underscore. 81 00:04:24.620 --> 00:04:26.103 PI is, 82 00:04:26.103 --> 00:04:29.110 3.1415, 83 00:04:29.110 --> 00:04:32.993 and we can only place underscores between numbers. 84 00:04:33.840 --> 00:04:35.490 We could place it here, 85 00:04:35.490 --> 00:04:37.373 and there would be no problem at all. 86 00:04:38.760 --> 00:04:39.853 Lets just log it, 87 00:04:41.640 --> 00:04:43.060 but actually to underscore 88 00:04:43.060 --> 00:04:45.450 doesn't make a lot of sense here. 89 00:04:45.450 --> 00:04:48.453 Lets remove it and let's say we wanted to place it here. 90 00:04:50.270 --> 00:04:51.680 Here we get to an error, 91 00:04:51.680 --> 00:04:53.383 because that is not allowed. 92 00:04:55.270 --> 00:04:57.840 It's also not allowed to place here, 93 00:04:57.840 --> 00:05:01.923 and also not at the beginning of a number or at the end. 94 00:05:02.820 --> 00:05:05.210 All of these are illegal, 95 00:05:05.210 --> 00:05:08.950 and like this it works, 96 00:05:08.950 --> 00:05:11.423 but we can also not place two in a row. 97 00:05:12.650 --> 00:05:15.343 The error message here is pretty explicit about that. 98 00:05:18.400 --> 00:05:21.930 And now just one final detail that we need to be aware of 99 00:05:21.930 --> 00:05:24.870 is that when we try to convert strings, 100 00:05:24.870 --> 00:05:26.430 that contain underscores, 101 00:05:26.430 --> 00:05:29.873 to a number that will not work as expected. 102 00:05:32.010 --> 00:05:34.960 Lets try to use the number of function 103 00:05:34.960 --> 00:05:38.173 that we learned before to convert a number. 104 00:05:40.260 --> 00:05:43.423 Of course with this, it should work just fine, 105 00:05:45.199 --> 00:05:50.060 We have 230,000 to the number or actually the string 106 00:05:50.060 --> 00:05:51.960 and then here it converts to a number. 107 00:05:53.230 --> 00:05:56.250 However, if we place an underscore here, 108 00:05:56.250 --> 00:05:59.430 so if we want to have a numeric separator here, 109 00:05:59.430 --> 00:06:01.370 that would not work. 110 00:06:01.370 --> 00:06:02.713 Now it is not a number. 111 00:06:04.150 --> 00:06:04.983 What that means, 112 00:06:04.983 --> 00:06:06.840 is that you should really only use, 113 00:06:06.840 --> 00:06:08.380 these numeric separators, 114 00:06:08.380 --> 00:06:11.330 when you are writing down numbers like this. 115 00:06:11.330 --> 00:06:12.780 Really in the code. 116 00:06:12.780 --> 00:06:15.330 If you need to store a number in a string, 117 00:06:15.330 --> 00:06:17.300 for example, in an API, 118 00:06:17.300 --> 00:06:20.630 or if you get a number as a string from an API, 119 00:06:20.630 --> 00:06:23.410 you should not use underscores in there, 120 00:06:23.410 --> 00:06:25.800 because then JavaScript will not be able 121 00:06:25.800 --> 00:06:29.220 to parse the number correctly out of that string. 122 00:06:29.220 --> 00:06:31.210 It's not gonna work as expected 123 00:06:31.210 --> 00:06:33.570 and you will get it's not a number, 124 00:06:33.570 --> 00:06:36.723 that might then introduce bugs into your application. 125 00:06:37.560 --> 00:06:40.907 And the same is true with the "parseInt" function. 126 00:06:44.220 --> 00:06:46.320 Here we do not get not a number, 127 00:06:46.320 --> 00:06:49.350 but we only get to 230. 128 00:06:49.350 --> 00:06:53.250 Only the parts that is here in front of the underscore. 129 00:06:53.250 --> 00:06:55.100 Everything else will then be ignored.