In yesterday’s post, we looked at numbers and the basic operators that we can use to manipulate these numbers in JavaScript. To give you a full understanding of the different styles of data that can be used in JavaScript we will now turn our attention towards strings. Luckily, we have already seen a string in our code: "Hello, World!".

Strings by strict definition are a grouping of characters that is surrounded by either single quotes ' or double quotes ". There are various reasons to use single quotes or double quotes in your strings, but for now, simply use double quotes for the sake of consistency, unless it is otherwise stated. Strings, like numbers in JavaScript, also have their own set of operators.

javascriptStrings can be added together (concatenated) through the use of the plus sign +. For example, if you write in your console "Hi there " + "Sam!";, the console will print out "Hi there Sam!". You may also assign strings to variables and then concatenate them together. If we assign var x = " dog"; and var y = "Bob the"; then enter y + x; into the console we will get "Bob thedog". The reason why we won’t have a space between “the” and “dog” is because we didn’t add a space character during the concatenation of the two strings. This can be corrected in a two ways, you may add a space in the assignment of the strings; changing var x = " dog"; or var y = "Bob the ";. If we re-enter y + x, we will now see “Bob the dog”.  A more consistent way of fixing this problem is to add a space in the concatenation process rather than during the assignment, for instance y + " " + x;. Now, we can assign any string in y and x and still have a space between them when we run the operation y + " " + x; .

There is one more way to concatenate strings which is worth noting at this point in time. We could write, var text = "Hi there, ";. If we then enter something like text += "Sam", when we now recall the variable text, we will get "Hi there, Sam" in return. This += notation is a shorthand notation for adding or in this case, concatenating the data inside of the variable with the data on the other side of the equal sign = and then reassigning the result to the original variable.  You may also use this notation for numbers, var x = 42; x += 12; will reassign the variable x to 54. You can also use -= like += with numbers to subtract a number before reassigning it to the variable. If you try to use -= on a String, you will get NaN (not a number) as your return value and the variable will be reassigned to NaN. This leads us into our next topic Null and Undefined.

Representing Nothing with Something

This NaN (not a number) result is JavaScript’s way of telling the user that the operation they just tried to run has failed.  This actually, is one of the larger downsides of JavaScript being an untyped or dynamically typed language. Operations that shouldn’t work can run anyways and when you are working with thousands of lines of code a problem like this can be difficult to debug.

Let us try some weird operations so we can see what kind of results we get. Adding a number to a string, for example, 5 + "the dog" will result in you getting the string "5the dog" back. This happens because JavaScript will automatically convert the 5 into a string before concatenation.  We’ve already seen that subtracting a number from a string gives us NaN or a fail state and so will multiplication and division.  Make sure never to use NaN in any of your JavaScript programs. NaN is toxic and is not even equal to itself.

Not a NumberThere is an operator in JavaScript called typeof which returns the type of the data you input into it. If we input typeof NaN, the return value will be number. The reason for this is because NaN is inherently the product of a failed operation on numbers and therefore a number data type. The compiler is trying to convert a string into a number to perform the operation but it can’t. You can, however, use a string that is made out of number characters to subtract, multiply, and divide a number without getting NaN as your result. For instance, "5" / 2 will give us 2.5. The compiler will automatically convert the string “5” into the number 5 and then divide it.  Be careful with this, however, because if you try to add a string made of numbers with a number you will get a returned concatenated string; "5" + 2 will return "52". With NaN out of the way, let us look at undefined.

undefined in JavaScript is returned when there is no return value for the function being run or when a more complex operation fails. undefined is also a primitive value that is used when a variable has not yet been assigned. It might sound abstract but undefined is basically an empty variable or the result of an operation that failed to return anything. If you try to run typeof undefined your return value will also be undefined.

null, on the other hand, is supposed to represent something that doesn’t exist. null as a primitive type represents an empty or non-existent reference to an object. You can use the properties of null to your advantage when you are working with objects to clear the data but not remove all the properties of that data. When you check the typeof null the return value will be object.

This all sounds much more complicated than it really is, but when we get objects and logical operators things will start to make a little more sense with regards to NaN,null, undefined.

Overview

In this post, we talked about strings and the various “empty” and fail states in JavaScript.  We also talked about some more basic operators that can be performed with strings, such as concatenation, as well as the typeof operator. We will come back later to talk about some more complex operators that can be used with strings and numbers. In the next post, we will start to talk about logical operators and control flow.