This content originally appeared on DEV Community and was authored by Zende Aditya
So, Welcome back everyone đź‘‹
I'm Aditya, and I'm starting a new series for the next 100 days to become an excellent Full-stack Developer.
Today is Day 1 of my journey. Today I revised the basic yet important concept in javascript.
Today I started with revising array, string, and object in javascript.
so whatever I learned today I want to share with you let's start
I started the revision with Objects in js.
## 1. Objects
So, an Object is nothing but a container that contains different types of values.
Here is the syntax of Object. There are mainly two types of Objects syntax
let obj = new Object();
this is the one way to create an object and the second and simple syntax is
let blogDetails = {
author: "aditya",
age: 21,
blogsWriteOn : ["Dev.to", "Medium.com", "Hashnode.com"],
location: "Pune"
}
this way you can create an object.
In the object, we store the data in the key: value pairs, we can store any type of data in an object.
Accessing the data from an object.
- Using (.) notation:
let authorLocation = blogDetails.location; // Pune
- Using ([]) notation:
let authorName = blogDetails['author']; // aditya
2. Arrays
Arrays -> It is used to store multiple items using one variable name.
In JavaScript, the array is resizable & can contain different types of data.
Here is what resizable means,
suppose the array is like this:
let fruits = ["apple", "orange", "banana", "pineapple"];
There are a total 4 elements in the array and if you push one element like
fruits[5] = "grapes";
This will be acceptable In js if we console this the output will remember that we skip the 4th index. but this still works.
[ 'apple', 'orange', 'banana', 'pineapple', <1 empty item>, 'grapes' ]
Array Methods:
There are almost 46 array methods for the array. We are discussing some but the important methods of array here!
To understand this method better way we are going to learn with example
let numbersArray = [1, 2, 3, 4, 5,6,7,8, 9,10, 11, 12, 13, 14, 15, 16, 17, 18];
- Array.at()
This method is used to access a particular element from the array with the help of its index.
Keep in mind that the index of the array starts with
0not with1.
If we want to access the element at index 0, we can write like
console.log(numbersArray.at(0)); // 1
If we want to access the last element of the array we can take the help of length property to get the total length of the array.
In this case numbersArray.length will output 18.
To access the last element
console.log(numbersArray[numbersArray.length-1]); // 18.
- Array.concat() This method is used to combine two arrays into a single array. Here is simple example to demonstrate this
let numbersArray = [1, 2, 3, 4, 5,6,7,8, 9,10, 11, 12, 13, 14, 15, 16, 17, 18];
let lettersArray = ["a", "b", "c", "d", "e", "f"];
The output of the above code is
console.log(numbersArray.concat(lettersArray));
// [1, 2, 3, 4, 5, 'a', 'b', 'c', 'd', 'e', 'f']
- Array.filter() This method is used to filter the array element on certain conditions that you write as a callback function. For example, if you want to print all the event numbers from the array so you can write
let evennumbers = numbersArray.filter((num)=> num % 2 === 0);
the output will be
[2, 4, 6, 8, 10, 12, 14, 16, 18]
another example with object
// Filter on an array of objects
const students = [
{ name: "aditya", age: 21, mark: 80 },
{ name: "rator", age: 19, mark: 89 },
{ name: "kevin", age: 22, mark: 38 },
{ name: "atharva", age: 18, mark: 80 },
{ name: "random", age: 25, mark: 80 },
];
and the output is
const eligible = students.filter((std)=> std.age>20 && std.mark>50);
console.log(eligible);
// [ { name: 'aditya', age: 21, mark: 80 }, { name: 'random', age: 25, mark: 80 }]
The filter function takes two parameters
- callbackFun
- thisArg
callbackFun - is a simple function that you provide the perform certain tasks.
thisArg - This is an optional parameter. A value to use as this when executing callbackFn.
filter returns the shallow copy of the original array after performing the callback function.
- Array.forEach() This method executes the callback function on each element of the array Here is example of forEach
let numbersArray = [1, 2, 3, 4, 5];
numbersArray.forEach((num , idx)=>{
console.log(`The number at index ${idx} is ${num}`);
})
and the output will be
The number at index 0 is 1
The number at index 1 is 2
The number at index 2 is 3
The number at index 3 is 4
The number at index 4 is 5
- Array.map() This is the method of array creates a new array populated with the results of calling a provided function on every element in the calling array.
the example of map is
let mapfun = numbersArray.map((num)=>num*2);
and the output is
[ 2, 4, 6, 8, 10 ]
This content originally appeared on DEV Community and was authored by Zende Aditya
Zende Aditya | Sciencx (2024-07-05T17:35:59+00:00) Basic Of Javascript – Day 1 of #100DaysOfFullStackChallnege. Retrieved from https://www.scien.cx/2024/07/05/basic-of-javascript-day-1-of-100daysoffullstackchallnege/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.