Javascript Arrays for Beginners (2023)

Arrays hold values.

An array is an ordered list of values.

Arrays are 0-based, in that the first value is 0, not 1 in terms of its position.

A JavaScript array has the following characteristics:

  1. First, an array can hold values of mixed types. For example, you can have an array that stores elements with the types number, string, boolean, and null.
  2. Second, the size of an array is dynamic and auto-growing. In other words, you don’t need to specify the array size up front.

source

W3schools describes an array as a “special variable, which can hold more than one value”.

An array can hold many values under a single name, and you can access the values by referring to an index number.

arrays w3schools

source

Creating & Fetching JavaScript arrays

JavaScript provides you with two ways to create an array. 

It is a common practice to declare arrays with the const keyword.

Image source

You can also use the following code to create a new array:

let values = new Array();

or

let values = [item1,item2,...]

Once you’ve created your array, you can print the values to the console.log with the code:

console.log(values);



With “values” being the name of the array.

You can call “values.length” to get the length of the array

console.log(values.length);

Again, in the above code “values” is the name of the array.

You can define and name an array, and then “push” values into it later:

The above code will add a single value of 5 to the array named “values”.

console.log(values[1]); will print the second value – 7

console.log(values[0]); will print the first value – 5

In summary – to create an array, it’s generally best to use the “const” keyword, or the “new” keyword.

Adding & Changing Stuff Within Arrays

Below, the array name is used,and the variable number to update, the first variable.

You can try it yourself on the w3 schools website.

Accessing Arrays

You access an array element by referring to the index number:

accessing arrays

You can also loop through arrays

Javascript Functions for Beginners

A function is a piece of code, that can be reused.

It’s similar to a variable but doesn’t hold a value like a variable does. So it’s not that much like a variable, but kind of is.

Screenshots are from the brilliant Javascript Course on Udemy here

The code on lines 16 and 17 shown in the image above, creates the function. It is named “logger”.

the shorter code logger(); is used to/for “invoke”, “running”, or “calling” the function.

Function Declerations Vs Expressions

Function Declerations

When you create a function with a name, then it is a function decleration.

Function statements, declare a function. A declared function can be used later when it is “invoked” or “called”.

Function declerations must start with “function”.

For example:

function mma() {

return 8;

}

The functioned mma is declared. to invoke it use the code mma();

You can call function declerations, above the code that creates it.

Function Expressions (good article here)

A JavaScript function can also be defined using an expression.

A function expression can be stored in a variable:

Image source

Function expressions are invoked to avoid polluting the global scope. Instead of your program being aware of many different functions, when you keep them anonymous, they are used and forgotten immediately.

To summarize, function declarations are utilized when you desire to establish a function in the global scope that can be accessed anywhere in your code. On the other hand, function expressions are employed to confine the accessibility of the function, reduce the weight of the global scope, and maintain a neat syntax.

JavaScript Arrow Function

Arrow functions have shorter syntax

They are best suited to non-method functions

source

Functions Calling Other Functions

An example, might be a function that cuts up fruit pieces, and then sends the result to a function that blends it into a smoothie.

The start function used above, will print out “I am first bo! 222222!!!”

Functions Summary

A function is like a procedure. It has tasks and calculates a value.

A function requires input and must return an output.

Functions need to be defined with the word “function” and brackets ()

Brackets can also be called paranthesies, and the input is sometimes called “arguments” or “parameters”.

Image source

Image Source

Excel – Find Cells that contain 2 Specific Words

If you are for example, searching an e-commerce site crawl or download for football goals…

If you want to identify cells that contain, for example “football” and “goal”, you can use the formula:

With the URLs in column A, in column B add the formula:

=AND(ISNUMBER(SEARCH("football",A2)),ISNUMBER(SEARCH("goal",A2)))

To find cells that contain “football” OR “goal”, use:

=AND(ISNUMBER(SEARCH("football",A2)),ISNUMBER(SEARCH("goal",A2)))


Bulk checking Hreflang Tags for SEO on an eCommerce Store (With Screaming Frog)

Find URLs that should have a hreflang tag – Indexable URLs

Crawl the website with Screaming Frog

Download the “internal” report on first tab

Filter relevant columns to find all URLs that return 200 (Status Code), are indexable (Indexability)

Paste the filtered sheet into a new tab/sheet and delete irrelevant columns so you just have URL and Canonical columns

Use =Exact formula to find all URLs that match the canonical URL

Filter Canonical URL column to “true”

You should be left with all URLs that are indexable – i.e. 200 status codes and URLs that exactly match canonical URLs.

Copy all the URLs that remain

Find Missing Hreflangs – Paste Back into Screaming Frog in List Mode

Use List Mode and Copy the URLs into screaming frog and crawl.

Check the crawl and go to the hreflang tab – order by hreflang “Occurences”

Export hreflang

Check the Screaming Frog Filters

Just discovered we have lots of non-200 hreflang links.

It’s definitely worth checking the filters on the hreflang tab

Official documentation from Screaming Frog here.