Continuing with working with variables, in this post we will go through various ways you can work with arrays and objects in Javascript.

Operations on Arrays

Arrays in JS have built-in methods(⏭️) and operations that enable you to manipulate and transform data like .pop(), .shift() and .unshift().

Adding and Removing Elements

Adding elements to arrays is extra simple, we use .push() to add to the end and .unshift() to add to beginning of an array. For removing we have .pop() that removes from end and .shift() that removes from the beginning of array.

let numbers = [1, 2, 3];
const newLen = numbers.push(4); // Adding an element to the end and returns new length of array
console.log(numbers); // [1, 2, 3, 4]
let item = numbers.pop(); // Removing the last element and assigning to variable
console.log(item); // 4
let first = numbers.shift(); // Removing the first element and assigning to variable
console.log(first); // 1
numbers = [1, 2, 3]; // reinitializing numbers array just to make it easier to follow
const b = numbers.unshift(5, 4); // Adds items to beginning of array and returs new total length
console.log(b); // 5

Accessing and Modifying Elements

In Javascript, arrays start from 0, that is why the first element is at 0 position

We can use .length to get length of an array. This also works for strings. Keep in mind that .length will give you length starting from 1 but as noted above, we need start from 0 when accessing values. Modyfing of strings using this approach does not work because strings are immutable in JS meaning once created, its value content cannot be modified (but we can still reassign new value to that variable).

When accessing elements in arrays we are using bracket notation.

let fruits = ["apple", "banana", "orange"];
console.log(fruits.length); // 3
let firstFruit = fruits[0]; // Accessing the first element
console.log(firstFruit); // apple
fruits[1] = "grape"; // Modifying an element
console.log(fruits); // ['apple', 'grape', 'orange']
let name = "Mario";
console.log(name[0]); // M
name[0] = "T"; // will not throw error but does not work
console.log(name); // Mario

Multidimensional Arrays

Arrays can hold any and multiple data types in them. That means that they can hold other arrays. Those we call multidimensional arrays. We access those using multiple brackets.

let items = ["apple", 2, 58, 5, "item23"];
let multiItems = ["apple", [76, "item", true], "it2"];

console.log(multiItems[1][1]); // item

We are accessing first element in the multiItems array (which is another array) and then we are accessing first element in that array and we get string item.

Assignments and Manipulations of Objects

Assigning and Modifying Properties

let person = { name: "Alice", age: 30 };
person.city = "New York"; // Adding a new property
person.age = 31; // Modifying an existing property
console.log(person); // {name: 'Alice', age: 31, city: 'New York'}
console.log(person.city); // New York

Accessing and Manipulating Values

let user = { username: "johndoe", points: 100 };
let userPoints = user.points; // Accessing a property value
user.points += 10; // Modifying a property value
console.log(user); // {username: 'johndoe', points: 110}
console.log(userPoints); // 100 because it is stored in another variable

What now?

Now you can work with all sorts of variables so do exactly that. Do 10 of every type of variable before moving to next post.