1
00:00:00,770 --> 00:00:04,410
Go ahead and follow along using the latest
workspace by launching the workspace for

2
00:00:04,410 --> 00:00:05,720
this video.

3
00:00:05,720 --> 00:00:10,590
So, set is a new type of iterable
which can hold unique values.

4
00:00:10,590 --> 00:00:15,830
In the file classroom set .JS,
I have a new set object called classroom.

5
00:00:15,830 --> 00:00:18,820
I want to fill my classroom with students.

6
00:00:18,820 --> 00:00:22,180
So I create a couple of students,
StevenJ and Sarah.

7
00:00:22,180 --> 00:00:25,572
So we'll say, let StevenJ.

8
00:00:27,826 --> 00:00:32,064
And I'll give StevenJ a name,

9
00:00:32,064 --> 00:00:35,980
Steven, and an age of 22.

10
00:00:35,980 --> 00:00:41,959
Right below, create Sarah.

11
00:00:45,459 --> 00:00:49,630
And we'll give Sarah an age of 23.

12
00:00:49,630 --> 00:00:56,410
Next, I'll add these two students to
the classroom set, using the add method.

13
00:00:56,410 --> 00:01:06,175
So say classroom.add StevenJ.

14
00:01:06,175 --> 00:01:10,135
And right below classroom.add Sarah, and

15
00:01:10,135 --> 00:01:14,950
now to verify that the students
are in the classroom,

16
00:01:14,950 --> 00:01:20,099
I'll use the HAS method and
log a message to the console.

17
00:01:20,099 --> 00:01:25,540
Now, HAS is a convenient way to
check if a value exists in a set.

18
00:01:25,540 --> 00:01:32,635
So first, I'll say if classroom.has

19
00:01:32,635 --> 00:01:39,335
StevenJ console.log the message.

20
00:01:39,335 --> 00:01:40,805
StevenJ is in the classroom.

21
00:01:47,039 --> 00:01:51,080
And for Sarah,
I'll simply copy this if statement.

22
00:01:51,080 --> 00:01:56,582
Paste a new one below, and
we'll change it to if classroom.has Sarah.

23
00:01:56,582 --> 00:02:02,470
Console.log Sarah is in the classroom, and

24
00:02:02,470 --> 00:02:07,382
now all run node classroomset.js.

25
00:02:07,382 --> 00:02:12,420
In the console, to see if my students
are logged in the classroom, and perfect.

26
00:02:12,420 --> 00:02:15,260
Both StevenJ and
Sarah are in fact in the classroom.

27
00:02:16,960 --> 00:02:21,280
So now I'll create another
student right below Sarah.

28
00:02:23,060 --> 00:02:28,660
Let's create StephenS.

29
00:02:28,660 --> 00:02:34,770
Rename and say Steven,
and for age will say 22.

30
00:02:34,770 --> 00:02:40,440
Now, you might have noticed that StephenS

31
00:02:40,440 --> 00:02:44,160
has the same property values as StevenJ.

32
00:02:44,160 --> 00:02:49,200
Their name and
age values are Steven and 22.

33
00:02:49,200 --> 00:02:52,540
So, let's see if StevenS
exists in our classroom.

34
00:02:53,760 --> 00:02:58,416
So in our if statements, we'll say if

35
00:02:58,416 --> 00:03:03,219
classroom has StevenS console.log,

36
00:03:03,219 --> 00:03:06,865
StevenS is in the classroom.

37
00:03:06,865 --> 00:03:10,677
Now, I'll run the file in the console.

38
00:03:10,677 --> 00:03:14,817
I see that StephenS did not
get locked to the console,

39
00:03:14,817 --> 00:03:20,521
which is what I expected because I
didn't add StephenS to the classroom,

40
00:03:20,521 --> 00:03:25,213
but also StevenJ and
StevenS represent two unique objects,

41
00:03:25,213 --> 00:03:28,910
even though they appear to be the same.

42
00:03:28,910 --> 00:03:34,190
So if I change the value of StevenS
to equal the value of StevenJ,

43
00:03:35,230 --> 00:03:36,480
we'll have a different outcome.

44
00:03:37,620 --> 00:03:38,238
Let's take a look.

45
00:03:41,396 --> 00:03:44,810
And now we see that StevenS
is in the classroom.

46
00:03:44,810 --> 00:03:46,850
Well, this is only because the object,

47
00:03:46,850 --> 00:03:51,880
StevenS, is referencing the same
object that StevenJ is referencing.

48
00:03:53,720 --> 00:03:59,380
I'm going to change StevenS back so
that it's referencing its own object.

49
00:03:59,380 --> 00:04:02,966
And then I'll add StevenS
to the classroom.

50
00:04:02,966 --> 00:04:08,070
We'll say classroom.add StevenS,

51
00:04:08,070 --> 00:04:12,250
and to verify that my classroom
set has three students,

52
00:04:12,250 --> 00:04:16,730
I'll log my set size
property to the console.

53
00:04:16,730 --> 00:04:21,923
So right below my if statements,

54
00:04:21,923 --> 00:04:28,414
I'll say console.log classroom size,

55
00:04:28,414 --> 00:04:32,130
and classroom.size.

56
00:04:35,219 --> 00:04:39,323
The size property is similar to
the length property of an array,

57
00:04:39,323 --> 00:04:43,790
it returns the total number of
values stored in a set object.

58
00:04:43,790 --> 00:04:49,350
So now, when I run this file, the console
log returns classroom size three.

59
00:04:49,350 --> 00:04:49,850
Good.

60
00:04:52,161 --> 00:04:58,060
So now let's see what happens when I try
to add a student that's already in my set.

61
00:04:58,060 --> 00:05:02,800
So over in my add methods,
I'll copy Sarah and

62
00:05:02,800 --> 00:05:09,590
paste her again right below StevenS,
and when I run the file in the console,

63
00:05:09,590 --> 00:05:14,310
you'll notice that there are still
only three values in my set object.

64
00:05:14,310 --> 00:05:18,640
Well, this is because a set
must have unique values,

65
00:05:18,640 --> 00:05:22,650
you see set comes with
a series of built in methods.

66
00:05:22,650 --> 00:05:27,720
I've shown you add, which lets you
add new values to your set object and

67
00:05:27,720 --> 00:05:31,180
has, which checks if
a value exists in a set.

68
00:05:31,180 --> 00:05:34,240
Now, if we wanted to remove
a student from the classroom,

69
00:05:34,240 --> 00:05:36,000
we would use the delete method.

70
00:05:36,000 --> 00:05:36,850
So, let's give that a try.

71
00:05:38,590 --> 00:05:43,168
I'm going to remove StevenJ
from the classroom by

72
00:05:43,168 --> 00:05:46,656
typing classroom.delete StevenJ.

73
00:05:50,122 --> 00:05:55,580
Then I'll add another classroom size
console.log right below the delete method.

74
00:05:57,150 --> 00:06:01,518
So now, over in the console,
when I run the file,

75
00:06:01,518 --> 00:06:06,926
the classroom size is still
three before StevenJ is removed,

76
00:06:06,926 --> 00:06:11,400
then shows that it's two
after the delete method.

77
00:06:18,020 --> 00:06:21,346
Finally, at some point in
developing applications,

78
00:06:21,346 --> 00:06:25,760
you'll likely need to pass data
back to the server as an array.

79
00:06:25,760 --> 00:06:30,810
Well, ES 2015 adds a new method to
the array prototype for cases like this.

80
00:06:32,460 --> 00:06:35,840
So first, I'll create an array of
students from the classroom set.

81
00:06:35,840 --> 00:06:44,350
I'll write a comment that says create
an array of students in the classroom set.

82
00:06:46,090 --> 00:06:49,298
To create the array,

83
00:06:49,298 --> 00:06:54,110
I'll type let array of students

84
00:06:54,110 --> 00:06:58,923
equal array.from classroom,

85
00:06:58,923 --> 00:07:07,122
then right below our
console.log array of students,

86
00:07:07,122 --> 00:07:12,220
and I could also do the reverse.

87
00:07:12,220 --> 00:07:15,580
Create a set from an existing array.

88
00:07:15,580 --> 00:07:20,450
So I'll write the comment,
create a set from an existing array.

89
00:07:24,030 --> 00:07:31,600
And to create the set,
I'll type let alumni,

90
00:07:31,600 --> 00:07:36,077
new set array of students.

91
00:07:37,287 --> 00:07:41,670
And right below, we'll

92
00:07:41,670 --> 00:07:46,679
console.log alumni size,

93
00:07:46,679 --> 00:07:51,696
followed by alumni.size.

94
00:07:55,896 --> 00:08:00,120
All right, so
I'll save my file and run it.

95
00:08:01,560 --> 00:08:02,410
And perfect.

96
00:08:02,410 --> 00:08:07,610
I have an array of students which
I converted from my classroom set,

97
00:08:07,610 --> 00:08:12,110
then I created an alumni set
from the array of students.

98
00:08:12,110 --> 00:08:15,460
I've included a link to the documentation
in the teacher's notes if

99
00:08:15,460 --> 00:08:17,280
you'd like to learn more.

100
00:08:17,280 --> 00:08:21,670
We've covered a lot of ES2015
material in this video, so good job.

101
00:08:21,670 --> 00:08:24,880
Coming up next,
I'll introduce you to the map object, and

102
00:08:24,880 --> 00:08:26,990
you'll see how it compares to set.

103
00:08:26,990 --> 00:08:27,490
See you there.