JavaScript Bootcamp: Learn the Basics of JavaScript Programming in 2 Weeks (2016)
Chapter 2. The Different Aspects of JavaScript
Data and Bits
Data forms the digital world. If you’ll“visit” the world inside a computer, there is one thing you will see: data. You may read, edit, and generate data. Whenever you save new data, it will be stored as sequences of bits. This is the reason why stored pieces of data have similar appearance and characteristics.
In programming, a bit is anything that has two values (often represented by ones and zeros). You can reduce any piece of data into a series of ones and zeros. This process is known as data-to-bit conversion.
Values
Typical computer systems involve billions of bits. That means working with data can be extremely confusing. If you want to work with such a staggering amount of information, you have to divide it into smaller chunks. In JavaScript, these chunks of information are known as values. Although all values are formed by bits, they have different types and functions. JavaScript supports six types of values, namely: strings, numbers, functions, objects, undefined values, and Booleans.
To generate a value, you just have to indicate its name. This process is easy and simple. You won’t have to collect materials or pay any fee. Just indicate a value’s name, and BAM! You have it.
This chapter will introduce the basic elements of the JavaScript language (i.e. operators and value types). These elements can interact with the values in JavaScript.
For now, let’s talk about the different types of values.
The Numbers
Values that belong to this type are… you guessed it right: numeric values. You have to use the following format when writing a JavaScript application:
<number>
For example, let’s say you entered this value into your JavaScript program: 99. This will create a bit sequence for the number 99 inside your machine’s memory.
The JavaScript language uses 64 bits to store each number value. The number of patterns you can create with 64 bits is limited, so the numbers that you can represent with them is also limited. For x decimal numbers, the numbers that you can represent is equal to 10x. In the same manner, since you have 64 digits, you may represent up to 264 number values.
Before, computer memory was so small people had to use sets of eight or sixteen bits to indicate number values. Since the memory was insufficient, users often experienced“data overflows” when working with JavaScript. Today, however, even basic desktops possess lots of memory. That means you can easily use 64-bit sequences– you won’t have to worry about data overflows anymore.
Number values can also store negative integers. Here, one of the bits represent the value’s sign (either“+” or“-“). Additionally, JavaScript supports non-whole numbers (i.e. decimal numbers). To accomplish this, some bits store the decimal point’s position in the number value.
You can write decimal and fractional numbers using a period. Here’s an example:
99.99
For extremely large or extremely small numbers, on the other hand, you may add an“e” to use the scientific notation. Just follow it up with the correct exponent. Here’s an example:
9.999e9 = 9.999 x 109
Computations with integers (also known as whole numbers) are 100% accurate. Computations with fractions, however, are not. For example, the value of“pi” cannot be expressed accurately by a limited quantity of decimal numbers. A lot of number values lose their accuracy because there are only 64 bits to keep them. If you want to avoid problems related to fractions, you have to remember that these numbers are just estimates. Don’t treat them as accurate values.
Arithmetic Operations
This is what you do with numeric values. In general, arithmetic operations (e.g. addition, division, subtraction, etc.) use two numeric values to generate a new value. Here’s a sample arithmetic operation written in the JavaScript language:
10 + 4 * 5
The“*” and“+” signs are known as“operators.” The“+” sign represents addition while“*” represents multiplication. You can generate a new numeric value by placing an operator between 2 numeric values. It is important to note that arithmetic operations in JavaScript follow operator precedence (also called order of operations). Here, you should perform operations in this order: parentheses, exponents, multiplications/divisions, and additions/subtractions. If you will apply operator precedence in the example given above, 10 will be added to the product of 4 * 5.
You can use parentheses to modify the order of operations. For example:
(10 + 4) * 5
In the JavaScript language, the“-” sign represents subtraction while“/” represents division. You don’t have to worry about operator precedence. If you aren’t sure, however, you can simply add parentheses in your codes.
The Special Numbers
When using JavaScript, you’ll encounter three values that are referred to as numbers even if they don’t behave as such. These special values are: Infinity, -Infinity, and NaN.–Infinity and Infinity represent negative and positive infinities. In general, you shouldn’t trust computations based on infinities. These calculations aren’t mathematically reliable.
NaN, on the other hand, means“not a number.” You’ll get this special value if you will perform arithmetic operations that give imprecise or meaningless result. For example, you’ll get NaN if you will divide zero by zero (i.e. 0 / 0).
Strings
You should use strings to represent text-based information. You should use quotes (i.e. either single or double quotes) to enclose your strings. Check the following examples:
‘Five little monkeys’
“I’m riding a bicycle”
When creating strings, make sure that you are consistent with your quotes. If you started a line using double quotes, end the line using that same symbol.
In general, you can use quotes to enclose almost anything. Put something between a pair of quotes and the JavaScript language will turn it into a usable string value.
How to“Escape” a Character
There are times when you have to add special characters in your statements. For example, you have to add“newlines” (i.e. the characters you’ll get after pressing the Enter key) when writing text strings. Currently, JavaScript requires programmers to add a backslash into quoted texts. By placing a backslash, you are telling the computer that the next character has a special function or meaning. This process is known as“escaping a character.”
Quotes that come after a backslash will be considered as a part of the line: they won’t terminate the string. If you’ll place“n” after the backslash, a newline character will be added to the statement. Likewise, a“t” that is introduced by a backslash will result to a“tab” character (i.e. the one you’ll get after pressing the Tab key). Here is a simple example:
“I’m the first one\nYou are the last”
If you will execute the string given above, you’ll get the following:
I’m the first one
You are the last
In certain situations, you want to use an“ordinary” backslash in your codes. You don’t want it to be a special tool. You can do this by placing a backslash before another backslash. That is, you are escaping a backslash so you can turn it into a normal character. Analyze the following example:
“You should use \\t to add a tab character in your statements”
Once compiled and executed, that line will give you:
You should use \t to add a tab character in your statements
Strings aren’t numbers so you can’t perform mathematical operations on them. However, you can use the“+” on your strings to concatenate (i.e. combine) them. Here’s an example:
“Jav” +“aSc” +“ript”
Because of the“+” signs, the segmented line given above produces: JavaScript.
The Unary Operators
In this section, you’ll learn about the non-symbol operators. To start the discussion, let’s talk about an operator called“typeof.” This operator can help you in identifying the type of any value. Check the following examples:
The sample code given above used console.log to show the results you’ll get with“typeof.” Whenever you run this kind of code, you should immediately see the value on your computer screen.
The operators given in the previous section required two values, while typeof requires one. Operators that require two values are known as binary operators. Those that work with a single value, however, are known as unary operators.
The Boolean Values
Usually, programmers need values that can distinguish between two options, such as“on” or“off” and“yes” or“no.” For this purpose, the JavaScript language supports a value type called Boolean (which has two values only: true and false).
Comparisons
You can use the following method to create Boolean values:
The < and > characters are the usual symbols used to represent“is less than” and“is greater than”, respectively. Both of these symbols fall under the“binary operators” category. If you’ll apply them in your codes, you will get a Boolean value that shows whether they are true. You can compare strings using the same method.
Strings are ordered alphabetically. Also, lowercase letters are“more important” than uppercase ones. That means“a” >“b” is true. JavaScript also includes special characters (e.g. -, !, ?, etc.) in arranging strings. The process of comparison follows Unicode– it assigns a number to each character you might need in programming. This functionality is extremely useful since it allows you to store strings by converting them into number sequences. While comparing string values, JavaScript works from left to right, it checks the number sequences of each character individually.
You may also use similar operators such as <= (i.e. less than or equal to), >= (i.e. greater than or equal to), != (i.e. not equal to), and == (i.e. equal to). Check the following example:
In JavaScript, there is just one value that is unequal to itself. This value is NaN or“not a number.”
Originally, NaN is used to represent the outcome of an irrational calculation. As such, it cannot be equal to the outcome of other irrational calculations.
The Logical Operators
In this section, you’ll learn about the different operations that you can apply to a Boolean value itself. The JavaScript language offers three operators, namely: and, not, and or. You can use these operators to perform logical processes on Boolean values. Because of that, they are known as“logical operators.”
a) and
The && symbol represents“and.” This operator is binary. Additionally, it provides a“true” result ONLY IF the two values you are working on are both true. Here are some examples:
b) or
You should use the“||” symbol to if you want to use the“or” operator.“Or” will give you a“true” result if one of the values you are working on is true. Check the image below:
c) not
You must use“!” (i.e. an exclamation mark) to indicate the“not” operator. This logical operator is unary: you can use it on a single value. However,“not” is unique in that it reverses the value you’ll assign to it. For example, !false will give you true while !true will give you false.
The Ternary Operator
This logical operator works on three different values. Known as the conditional operator, it requires you to use“?” and“:” in your scripts. The following code will show you how to use it:
The value placed on the left-hand side of the“?” determines which of the remaining values will be selected. If it is“true,” the first option is selected. If it is false, however, the second option is chosen.
Undefined Values
The JavaScript language supports two special values to indicate the lack of a useful value. These special values are“undefined” and“null.” Although these two are considered as legitimate values, they don’t carry any information.
Often, if a JavaScript operation cannot generate a useful value, it gives out“undefined” just because it is required to generate a value.
According to experts, the difference between null and undefined is a mistake on the part of JavaScript designers. That means these two values are considered equal most of the time. If you have to work on these values, just think of them as interchangeable elements in your scripts.
How to Convert Types Automatically
You probably know that JavaScript accepts any application, even those that perform unusual things. The expressions listed below will demonstrate this concept clearly:
If you will apply an operator to an incorrect value type, JavaScript will automatically convert the said value into the proper type. JavaScript performs this function using a collection of rules that are sometimes unexpected or undesirable. Programmers refer to this automatic process as“type coercion.” Because of this, the null in the first line is converted to 0, while the“5” in the next line is converted to 5 (i.e. string-to-number conversion). The third line, however, tries to concatenate the values using the“+” sign, so the 1 becomes“1” (number-to-string-conversion).
If you’ll convert a non-number value (“six” or undefined) into a number, you’ll get NaN as a result. Applying mathematical operations on a NaN value will produce more NaNs, so if you are getting this value in unexpected or undesirable situations, check your codes for unwanted type conversions.