Data Types

Numbers

Represent numeric values, which can be either integers (whole numbers) or decimals (floating point numbers). This data type is essential for performing calculations, storing quantities, and representing values such as prices or points.

• Returning a Number:

  const number = 10;
  return number; // It will return 10

Text strings

Text strings represent sequences of characters, such as names, descriptions, messages, or any other type of textual information. In JavaScript, text strings are delimited by single ( ' ) or double ( " ) quotes.

• Display a message:

return `Hello world`;

• Display a custom welcome message:

return `Hello, ${v.username}! Welcome to our application.`;

• Concatenate (join) multiple text strings:

const name = "Mary";

const lastname = "Lopez";

return "Full name: " + first name + " " + last name; // Result: "Full name: María López"

Booleans (true and false)

Booleans represent logical values of true or false. They are essential for making decisions in your code and controlling the execution flow of your application.

• Check if an input field is empty:

return i.name.trim() === ''; // Returns true if the field is empty, false otherwise

Objects

In JavaScript, objects allow you to group related data into a single structure using key-value pairs.

• Creating an object: You can create an object using curly braces {} and separating properties with commas. Each property has a key (name) and a value, separated by a colon :. For example:

const person = {
  name: 'John',
  age: 30,
  city: 'Madrid',
}; // Object created with properties

• Accessing properties: You can access the value of a property of an object using dot notation or bracket notation. For example:

const personName = person.name; // "John" - Accessing with dot notation

const personAge = person['age']; // 30 - Accessing with bracket notation

• Modifying properties: If you need to change the value of an existing property, you can assign a new value to its key. For example:

person.age = 31; // Updates the value of the property "age" to 31

• Adding properties: You can add new properties to an object by assigning a value to a new key. For example:

person.profession = 'Developer'; // Adds the property "profession" to the object

Arrays (Lists)

An array in JavaScript is a structured way to hold an ordered collection of items. Each item in the array has a specific position, allowing you to store a variety of data types, including numbers, strings, booleans, objects, and even other arrays.

• Creating an Array: To create an array, use square brackets [] and separate the elements with commas. For example:

const myShoppingList = ['apples', 'milk', 'eggs', 'bread'];

• Accessing Elements: You can access a specific element in an array by using its index in square brackets. Remember that indexes start at 0, meaning the first element has an index of 0, the second has an index of 1, and so forth. For example:

const firstItem = myShoppingList[0]; // "apples"
const thirdItem = myShoppingList[2]; // "eggs"

• Modifying Elements: You can change the value of an existing element in an array by assigning it a new value using its index. For instance:

myShoppingList[1] = 'yogurt'; // Replace "milk" with "yogurt"

Iterating over Arrays: Go through your Data Element by Element

RenderList allow you to iterate through arrays and display each element individually on your page, without the need to write manual loops. This feature is invaluable when you need to present data dynamically, such as showing a list of products, users, or messages, with minimal setup.

The use of Render List automates the iteration process, making it easier to work with arrays by automatically repeating a template for each element of the array. This means that each item in your data source can be displayed consistently without the need for complex code, allowing you to focus on design and presentation.

Useful methods for arrays

JavaScript offers a variety of methods for working with arrays, such as:

• push() : Adds an element to the end of the array.
• pop() : Removes the last element from the array.
• shift() : Removes the first element from the array.
• unshift() : Adds an element to the beginning of the array.
• slice() : Creates a copy of a portion of the array.
• splice() : Add, remove or replace elements in the array.
• map() : Creates a new array by applying a function to each element of the original array.
• filter() : Creates a new array with the elements that meet a certain condition.
• reduce() : Reduces an array to a single value by applying a function to each element.