Array length in javaScript and addressing the confusion

You would think that Array length in javaScript is a trivial matter, and in some respects it might be. However on closer inspection there does seem to be more to it than what might appear to be the case on first inspection. Some might think that the number of elements in an array and the length of an array are one and the same, but that is not really the case actually depending on what you think an element is. If you think that an element can be just simply a kind of slot that can potentially be empty then maybe that is true, else it is not. In any case what I am driving at here is that arrays in javaScript are sparse in nature, and this sparse nature of javaScript arrays can result in problems and confusion if one is not aware of this, and how to go about dealing with it.

One way of thinking about array length might be that Array length in javaScript refers to the highest numbered index value of an array plus one because array length is one rather than zero relative. That is when it comes to the number index values of arrays the numbers start at zero rather than one as with the array length property so often the value of one has to be added and subtracted now in then in expressions to address problems with this. However the value can also be thought of more as just a potential for that actually, as all the elements could be empty elements as the length of an array might not always be the same as what is often called the count of an array.

So then because in some cases array length is just an object property that does not even reflect the highest indexed object key of the array, because there is nothing there actually in some situations. Then in a way it is just a way of declaring an element size of sorts, but many of those elements can be undefined, the default value for an object key that is not there.

The length differs from the size of an array which may refer to the amount of data that an array might take up in memory. There is also what if often called the count of an array that refers to the number of actual declared elements in the array, and that array count might differ in many respects depending on how you go about counting elements in the first place.

So then for the most part, on the surface at least, the length property of an array is easy to understand under a certain light. However there are a few situations that might cause a degree of confusion. So in this post on the subject of array length in javaScript I will take a moment to see about trying to clear up some of the confusion. As such this will be a lengthy post that I will be updating often.

Read More

javaScript Arrays a general overview of what to be aware of

In javaScript Arrays are a special kind of object in which elements exist in an ordered collection where each element has a certain numbered index value for the key name, along with an array length property that is the size of the array. When it comes to the size, or length of the array these arrays are sparse in nature which means it is possible for one or more of the key names to not be defined. In other words it is possible to have one or more elements that are empty, which is one root cause for problems when one is not aware of this and how to prevent these problems from happening in the first place.

There are many methods that can be used with arrays that are in the array prototype that can be used to preform all kinds of typical tasks with arrays, but there is not every little methods that comes to mind, so in some cases one might want to use some kind of additional library on top of what is in the native prototype object such as lodash. These native array prototype methods help with sorting, filtering, and mapping them in all kinds of different ways depending in additional logic that is used with them. Many of these methods have been part of the javaScript spec for a long time and are thus very safe to use when it comes to concerns of engine support. Others are a little newer so there should be a degree of concern at least maybe depending on the situation with platform support.

Often a javaScript developer will come across objects that are considered array like objects but are not an actual instance of Array, but Array methods can be used with them by using a function prototype method like call, apply or bind. The reason why is because the own properties of the object just happen to be the same as that of an array, it is just that the object was created with a constructor other than the Array constructor and as such does not have the same methods in the prototype of the object as with an instance of an array. On top of using function prototype methods to get these objects to work with array prototype methods there are also a number of ways to convert these kind of objects to arrays. There is also knowing about various tools to work with in native javaScript that help with the process of creating arrays from other kinds of collections such as object collection involving named keys rather than numbered ones.

There are many posts on the Internet that have to do with getting started with javaScript arrays, and also posts that get into all kinds of details about arrays when it comes to the various array prototype methods. However I thought I would take a moment to get together my own content on arrays when it comes to javaScript as there are all kinds of little things to get to in my own little way about them for what it is worth. This post will then serve as a general overview of Arrays in javaScript in which I will touch base on a lot of things concerting arrays themselves, and all kids of little things that might branch off from there. I will also be lining to all kinds of additional posts from here that get into certain array prototype methods, properties, and things that come up when working with arrays.

Read More

Array Slice in javaScript and related topics

In javaScript the Array.slice prototype method comes up a whole lot in many code examples. The method is one way to go about getting a new array that is a range of element from a source array. It works in a very similar fashion to that of Array.splice but with one very important difference, it returns a new Array rather than manipulating the existing one that it is used with. So then the array slice method is a great way to go about getting a sub section of elements from an array, without mutating the source array from which I call the method.

This nature of the array slice method that involves not mutating an array in place makes it more consistent with the concept of pure functions, and functional programing when working with an array in JavaScript. Although I would not go so far as to say the array slice method is a pure function , the main reason why being that the array slice method is still very much an array prototype method. So then the state of the result that is returned can differ with the same arguments depending on the state of the array off of which the array slice method is called. Still there is the nature of not mutating an array in place, that is a nice feature that is a step in that kind of a direction at least.

So for todays post on javaScript I will be covering some simple examples of Array.slice, as well as some related topics. At the end of the post I might also be able to get into at least one or more use case examples also while I am at it.

Read More

setTimeout in javaScript for delaying function calls and looping

When creating a javaScript project of some kind there will often be a need to implement some kind of main application loop for the project. There are a number of ways to go about doing this, and there is much ground to cover when it comes to this topic, but for this post I will be mainly writing about the setTimeout method, over that of the setInterval method that is very similar. It might not be the best option in all situations, often it might be better to use requestAnimationFrame these days in front end javaScript. Still settTimeout, or the similar setInterval is a good choice for some projects where it is called for in certain situations in which requestAnimationFrame is not an option such as with web workers.

The setTimeout method can be used to delay the calling of a function, that is I can call the setTimeout method, pass a function as the first argument, an amount of time in milliseconds as the second argument. The result of doing so is that the function that I passed as the first argument will fire when an amount of time greater than or equal to the amount of time I passed has elapsed. The function calling is not always guaranteed to fire at that time mind you though, so it is more of a target time. The setTimeout method is one option for setting up a situation in which a function keeps getting called over and over again at a certain rate by placing setTimeout in the function that will be called by setTimeout.

Read More

Set object values with a path string in lodash with set

A few months ago I wrote a post on the get method in the popular javaScript utility library known as lodash that is used for getting a property of an object by way of a path string, and returning a default value for the property in the event that the object property is undefined. When it comes to the default value that is given to the get method that is just a return value of get to use in the event that the property value is not in the source value, the get method as the name sugests just simply gets, it does not mutate the source object in any way.

So then because I wrote a post on the get method, it would make sense to write a post on the lodash set method as well. The _.set method works just like that of the _.get method in lodash, only it can be used to set a property rather than getting it when using path strings to do so. Another lodash method that comes to mind that might be considered a part of this set of method is the lodash _.has method that can be used to not get, or set, but simply check it an object has a certain path or not, returning a boolean value for the result of the check rather than any value, or default value.

However it might not be so hard to just do what these methods do with just plain vanilla javaScript by itself, so lets look a few quick examples of lodash set and other lodash methods. While I am at it in this post I should also touch based on any related topics that might come up as I do so when it comes to just plain vanilla javaScript by itself.

Read More