Tech Junkie Blog: December 2017

Friday, December 29, 2017

Arrays in JavaScripts are a collection of values stored in what are called elements.  Each element is represented by a numeric index that is zero based, meaning the first element of an array starts at index zero.  JavaScript arrays are dynamic and can contain many types of objects including functions.  The useful thing about arrays is that they are a specialized object that contains a variety of built-in methods that are useful in the manipulation of the array.

First let's create an empty array, there are several ways to do this:

  1. var empty = [ ];
  2. var empty = new Array();
  3. var empty = new Array(0);

The first example creates an empty array using the [ ] syntax, the second example creates an empty array by instantiating a new Array object with it's default constructor, then the third example creates an array with the Array constructor passing in the element argument of zero.  If you output the array with console.log(empty) they would all be the same output, an array with zero elements

Now let's create arrays with different types of data:

  1. var numbers = [1,2,3,4];
  2. var stringArray = new Array("USA", "Canada","China");
  3. var objectArray = {firstName: "Jack", lastName:"Johnson", weight:"200lbs"};
The first example is an array of numbers, the second array is an array of strings, and the the third array is an array of object.  If we use the console.log method to output the arrays we will find that the first two arrays has a prototype object of Array, but the last array has a prototype object of Object


If you look at the last array objectArray you will noticed that it's not an array at all its actually an object because it is using the prototype Object.  That's because it is declared as an object with just the { } braces.  To make it into an array you just need to surround it with the [ ] brackets. Like the example below:

var objectArray = [{firstName: "Jack", lastName:"Johnson", weight:"200lbs"}];

Now it's an array of objects

Now let's do something that only JavaScript can do very easily. Let's create a mix array of the three above examples.  Let's call it mixedArray, like the code below:

var mixedArray = [numbers, stringArray, objectArray];

If we output it in the console with console.log(mixedArray) we would see the we get all three arrays in mixedArray.  This is what is called an array of arrays or associative arrays.


Friday, December 22, 2017

Every JavaScript object has a toString() and a toLocaleString() method defined with it.  It is a string representation of the object. 

For example if we define a date object like the following:

 var date = new Date();

and we output the console.log(date.toString()) method without any extra code we would get the current date and time automatically

By default the toString() method outputs the long form of the date and time.  If we want to output a format that is tied to the current locale of the browser.  We can call the toLocaleString() instead. Like the following:


and the output will be like the following:

The toString() method works for arrays as well.  Let's say we have an array of countries like the example below:

var countries = new Array("U.S.A","Canada","China");

We can output the toString() method to the console with the following code:


and you would see the following output.

However, the toLocaleString() method will give you the same result because the method does not perform any special locale functions for you.  It only works for the date.  In order to out the locale representation for the array you need to write your own custom toLocaleString() method for the array.

Friday, December 15, 2017

Most people don't realize JavaScript has object property setters and getters or accessor methods.  When an object has a setter only it is a write only property, when it has a getter only method that it is a read only property.  If a property has both then it is a read/write property.  A perfect example is if you are working with a private property in JavaScript which has the $ prefix in front of it.

Let's say you have an object with a private property $n like the example below:

        var game = {

            $n: "Awesome Game!",

            get name() { return this.$n}

The code above only has a getter name that exposes the private property $n when you console.log you should get value of the $n like the code snippet below


  As you can see the output is as expected, it prints out the value of $n the private property because we have a getter method name()  things get interesting when we try to assign a value to name.  Its a bit confusing because we access the name method with a dot notation, the same as how we would access a property.

Friday, December 8, 2017

In JavaScript you can delete an object's property with the delete operator.  Let's use the product object again as an example.

Let say you have the following JavaScript code to create a product object.

        var product = new Object(); = "Chai";
        product.category = "Tea"; = "India";
        product.badProperty = "Bad Property";
        product.badProperty2 = "Bad Property 2";
        product.supplier = {
            name: "ACME Tea Of India",
            location: "New Delhi"


If you view the above code in a web browser window you will see the following.

We are going to use the delete operator to delete badProperty and badProperty2.  As with the way we access properties we can delete properties with either the dot notation or the [] operator.  To delete the properties type in the following.

delete product.badProperty;
delete product["badProperty2"];

If you type console.log(product) again the two properties will no longer be there

Friday, December 1, 2017

There are times when you will get an error when you tried to access a property in an object, sometimes you think a property exists in the object but it does not.  Let's use the product object from the previous blog post as an example.

        var product = new Object(); = "Chai";
        product.category = "Tea"; = "India";
        product.supplier = {
            name: "ACME Tea Of India",
            location: "New Delhi"

Let's say another developer works on the project and he assumes that since there's a "country" property that there should be a "city" property.  If he tries to access the access the "city" property in the product object he will get an undefined, because the property does not exist.   If he types the following he will get the undefined message.; or type console.log(

If the developer still persists and still tries to access property by checking it's length he will get the TypeError:

As you can see these errors are not very descriptive, so the best thing to do is to avoid them all together.  The way to do that is to check to if a property exists before you access it with the example below.

var length = undefined;

  if (
      length =;

Now if console.log(length) we will get an undefined if the "city" property does not exist.  It's way better than getting a TypeError exception and it's the expected result because you initialized the length variable to "undefined".  Another alternative is to use the .hasOwnProperty() method or the in
operator to test if the property exists in the product object.

For the .hasOwnProperty()

The code would look something like this

     length =;

With the in operator the code would look something like this.

if("city" in product)
   length =;