All language subtitles for 11. String Lengths and Retrieving the Number of Characters

Now, another really cool feature of Javascript strings is that we can easily figure out the number of characters
1

in a string by simply tapping into its length property.
2

So we can simply write word.length, and we'll be able to get the number of characters inside the word.
3

So let me show it to you in practice.
4

Let's head over to our Chrome Snippets.
5

So let's say our variable name is equal to Angela, and say if I'm too lazy to count how many characters
6

are in the string
7

Angela, then I can simply write name.length in order to get the number of characters.
8

And you can see printed in our console is 6.
9

And if you really want to verify you can also count 1 2 3 4 5 6.
10

So in the previous version of Twitter you had only 140 characters that you could use in order to create
11

a tweet.
12

And as you were writing the tweet you would get a count of how many characters you've used and how many
13

characters you have remaining and your tweet would get cut off at 140 characters.
14

Now, in the last year, Twitter has decided to increase the character count to 280, but I kind of preferred
15

it when it was only 140 characters.
16

I find that 280 is a little bit too long and people end up writing mini essays, instead of what it should
17

be, which is kind of one or two sentences.
18

So here's a slightly harder challenge.
19

So I want you to write some Javascript code in order to create a prompt where the user can enter a long
20

string such as a paragraph of text from a blog post and you will tell them how many characters they
21

have written and also how many characters they have remaining out of either 140 or 280 characters.
22

The output that you should get should be something like 'You have written 182 characters,
23

you have'. What is 140 - 182?
24

That will be '-42 characters left'.
25

So you would get an output that looks something like this
26

if you have coded up your Twitter character count correctly.
27

So this is going to involve some concatenation, as well as a little bit of maths, and also what you have
28

learned about the length property.
29

So I'll leave this challenge to you. Pause the video now and try to complete it.
30

All right. So how did that go?
31

Let's comment this out,
32

so that means putting two forward slashes in front of it, which takes it out of the code and instead
33

gets completely ignored by the computer so that it's not treated as any sort of code.
34

Now there's two ways of commenting text.
35

You can either put two forward slashes in front of it,
36

and this means you'll have a single line comment,
37

so the next line becomes code once more,
38

or you can put a forward slash plus a star, and then you can have a star and forward slash to end it,
39

and this means that you can have multiline comments like so, which is pretty cool.
40

All right.
41

So I'm going to push that towards the bottom.
42

And we're going to write our code up here.
43

So I'm going to create a prompt that asks the user input a tweet,
44

so something like 'Compose your tweet', and this will simply ask the user to write the tweet in here.
45

And once they have created that tweet, then I'm going to bind whatever it is that they wrote in there
46

to a variable and I'm going to call that variable tweet. Seems to make sense, right? Now, once we have that
47

variable tweet, I'm going to use it to check its length.
48

So I can create a new variable called tweetCount,
49

and this can equal tweet.length.
50

Now finally I can create my alert and inside the alert I'm going to tell the user "You have written "
51

+ tweetCount + " characters, you have " + (140 - tweetCount) + " characters remaining. ".
52

So now if I copy this first paragraph and I go ahead and I run my code and paste that paragraph in here,
53

then I can hit OK and I will get an alert back that says 'You have written 187 characters, you have
54

-47 characters remaining.'.
55

And this of course works also if I just write in some gobbledygook and I will also get my character count
56

and how many I have remaining to be a valid tweet.
57

Now some of you might have run the code and then tried to navigate to a different tab to get your text
58

and then when you came back you saw this error that says 'Cannot read property 'length' of null'.
59

And that's because when you navigate away from the tab the pop up gets dismissed,
60

and this tweet variable is now a null value, so it doesn't have a value.
61

And when you try to get the length of something that doesn't exist then you get this error here.
62

So don't worry too much about this.
63

We'll explain all of the nil values such as null or undefined or NaN in the coming lessons.
64

But for now just make sure that when you hit prompt you actually give it a value or any value you wish.
65

The other thing is that some of you guys might have skipped this stage of having a tweetCount variable,
66

so simply having tweet.length where I have tweetCount, and that works just as well.
67

So I can just replace these two places where I have the tweetCount, and I can delete this, and if I run
68

you can see that this works exactly the same.
69

And the only reason why I added that extra step is just to make it more visible so you can understand the
70

logic of the code more clearly.
71

Now in the next lesson I want to talk to you about, you guessed it, yet another feature of Javascript
72

strings, which is the slice function, which will enable us to slice and dice our strings.
73

So for all of that and more, I'll see you on the next lesson.