1
00:00:00,000 --> 00:00:08,686
[MUSIC]

2
00:00:08,686 --> 00:00:12,658
Most applications interact with the
outside world and often need to handle and

3
00:00:12,658 --> 00:00:14,910
process multiple things at a time.

4
00:00:14,910 --> 00:00:18,630
For example, accept user input,
request data from the server, or

5
00:00:18,630 --> 00:00:21,560
send data across the network and
wait for a response.

6
00:00:21,560 --> 00:00:25,240
Some apps might perform repeated
task at a fixed interval of time,

7
00:00:25,240 --> 00:00:28,930
like display a timer that
updates the UI every second.

8
00:00:28,930 --> 00:00:32,130
If you've written a fair amount of
JavaScript, there's a good chance that at

9
00:00:32,130 --> 00:00:36,008
some point you've written code
to handle these types of tasks.

10
00:00:36,008 --> 00:00:39,220
JavaScript is a synchronous
single threaded language,

11
00:00:39,220 --> 00:00:43,480
which means that it can process and
execute only one task at a time.

12
00:00:43,480 --> 00:00:45,370
Some tasks take time to execute.

13
00:00:45,370 --> 00:00:49,340
If there's a major delay between
the start and end of an operation and

14
00:00:49,340 --> 00:00:52,640
nothing else can run during that time,
it's going to create issues in your app,

15
00:00:52,640 --> 00:00:56,940
which negatively affect performance and
the overall user experience.

16
00:00:56,940 --> 00:00:59,820
For instance,
a function that's stuck waiting for data

17
00:00:59,820 --> 00:01:04,150
requested from a server can make an app
feel completely frozen and unresponsive.

18
00:01:04,150 --> 00:01:07,190
The user will not be able to do
anything until the requested data

19
00:01:07,190 --> 00:01:08,180
is eventually returned.

20
00:01:09,275 --> 00:01:13,695
Any time you have code that needs to
execute after some period of time in

21
00:01:13,695 --> 00:01:17,810
response to an event, like a mouse click,
or upon receiving the data it needs,

22
00:01:17,810 --> 00:01:21,685
you're introducing asynchronous
behavior into your program.

23
00:01:21,685 --> 00:01:22,485
JavaScript and

24
00:01:22,485 --> 00:01:27,030
its runtime environment provide efficient
ways to handle async operations.

25
00:01:27,030 --> 00:01:30,300
I'm Guil, a developer and
JavaScript instructor here at Treehouse.

26
00:01:30,300 --> 00:01:33,620
In this course, I'll introduce you to
the ways JavaScript makes it possible to

27
00:01:33,620 --> 00:01:38,510
program in an asynchronous way, that
is allow other parts of your program to

28
00:01:38,510 --> 00:01:43,180
carry on and run while other potentially
blocking script wait to complete.

29
00:01:43,180 --> 00:01:47,500
If you're used to programming JavaScript
in a synchronous style where one statement

30
00:01:47,500 --> 00:01:51,870
needs to run and execute before the next
statement does, it might be challenging to

31
00:01:51,870 --> 00:01:55,860
wrap your head around the concepts of
asynchronous programming at first.

32
00:01:55,860 --> 00:01:59,780
So in this course you'll first learn
the differences between synchronous and

33
00:01:59,780 --> 00:02:03,740
asynchronous code and
go over examples of each using JavaScript.

34
00:02:03,740 --> 00:02:07,360
You'll get an introduction to the
mechanics of asynchronous programming in

35
00:02:07,360 --> 00:02:11,770
the browser, learning concepts like
JavaScript's call stack and event loop.

36
00:02:11,770 --> 00:02:15,740
You'll get to know why asynchronous
code matters and how to design code that

37
00:02:15,740 --> 00:02:20,610
avoids blocking behavior using common
async patterns like callback functions and

38
00:02:20,610 --> 00:02:23,660
promises to the modern
async await pattern.

39
00:02:23,660 --> 00:02:26,570
By the end, you'll have learned to
write asynchronous programs that

40
00:02:26,570 --> 00:02:29,270
result in cleaner, more performant code.

41
00:02:29,270 --> 00:02:32,845
Now this course assumes that you have
experience working with JavaScript and

42
00:02:32,845 --> 00:02:36,940
the DOM as well as understand
the basics of sending HTTP requests and

43
00:02:36,940 --> 00:02:38,450
receiving responses.

44
00:02:38,450 --> 00:02:41,450
You should also feel comfortable
with using callback functions.

45
00:02:41,450 --> 00:02:44,890
If not, be sure to review the resources
posted in the teacher's notes first

46
00:02:44,890 --> 00:02:45,660
to get up to speed.