JavaScript Variable Datatypes

Variables

Variables, in a simple sense, serve as storage for a value the developer wants to be kept in order to be used later. In JavaScript, a variable has a datatype that is essentially how a value is kept by the variable. Datatypes are important to be kept in mind by developers as the datatype affects how variable values interact with each other. As W3 Schools rhetorically asks, "Does it make sense to add 'Volvo' to sixteen? Will it produce an error or will it produce a result?"

Variable Types

Numbers

Numbers store a numerical value.
var num = 0;
var num2 = 10 - 1; //num2 is equal to 9
var num3 = 2.14;
var num4 = 4 + true; //num4 will be equal to NaN, or not a number

Strings

Strings store characters between either single quotes or double quotes.
var string = 'This is a string.';
var string2 = "2"; //Though 2 is a numerical value it can be stored as a string
var string3 = 'Example2';
var string4 = 'text' + 4; //string4 is valued as 'text4'
var string5 = "You'd expect not to have quotes but you'd be wrong"; //quotes can be used within the string either by using different quotes from outer ones

Booleans

Booleans have two possible values, true or false.
var boolean = true;
var boolean2 = false;

Arrays

Arrays are able to store multiple values, which is done in an ordered list that starts at 0.
var arr = [1, 'two', [], false, {}];
console.log(arr[0]); //prints out first value in arr, 1
arr[1] = 'test'; //the value of arr at index one, 'two' is now 'test'

Objects

Objects are similar to arrays in that they store multiple values. Unlike arrays, objects store values in unordered lists known as key-value pairs.
var obj = {prop1: 1, prop2: 'two', prop3: [], prop4: false, prop5: {}};
console.log(obj.prop1); //will print the value of key prop1, or 1
console.log(obj['prop3']); //will print the value of key prop3, or []

Undefined

When a variable is declared without a value, the variable will be undefined in both type and value.
var example; //if accessed, example is undefined
var example2 = true; var example2 = undefined; //a variable can also be reassigned as undefined

Simple and Complex Datatypes

The six main datatypes (excluding undefined) are split into two different categories, simple and complex. The datatypes in each category share a couple qualities a developer should make note of.

Simple Datatypes

Simple datatypes, which are number, string, and boolean variables, possess these qualities:

They can only store a single value
They are copy by value Copy by value means that whenever a variable of a simple datatype is copied, the value of the variable is literally copied. For example: var val = 10; var newVal = val; //newVal is equal to 10 val = val - 1; //val is now equal to 9 console.log(newVal); //prints 10 to console In the example, the variable val value is copied by another variable newVal before the value of val is changed. However, the value in newVal remains unchanged as the value was merely copied. #### Complex Datatypes Complex datatypes, which are arrays and objects, possess these qualities:
They can store multiple values *They are copy by reference Copy by Reference means that whenever a variable of a complex datatype is copied, the reference of the variable is copied. For example: var arrVal = [1, 2, 3, 4]; var newArr = arrVal; //currently the value of newArr is [1, 2, 3, 4] newArr[0] = 33; //the array is now [33, 2, 3, 4] console.log(arrVal); //prints[33, 2, 3, 4] In the example, the variable arrVal is can array that is copied variable newArr. However, when a value in newArr is changed and arrVal is called on, arrVal has the change made to newArr. What happened is that since arrVal is an array newArr, when taking the value of arrVal, took the reference to the array so that both arrVal and newArr are both linked to the same array.

Conclusion

In conclusion javascript variables will store values that a developer wants to be held for later and these values are held in a variety of different datatypes which each have a series of behaviors and interactions for eachother.