JavaScript-30-Day-7

07 - Array Cardio Day 2

click here for demo

Today we worked on some more important JavaScript Array functions.

Let's quickly go through them.

Array.prototype.some()

This function checks if at least one thing in our Array meets what you are looking for.

According to MDN

The some() method tests whether at least one element in the array passes the test implemented by the provided function. It returns true if, in the array, it finds an element for which the provided function returns true; otherwise it returns false. It doesn't modify the array.

The some() method executes the callbackFn function once for each element present in the array until it finds the one where callbackFn returns a truthy value (a value that becomes true when converted to a Boolean). If such an element is found, some() immediately returns true. Otherwise, some() returns false. callbackFn is invoked only for indexes of the array with assigned values. It is not invoked for indexes which have been deleted or which have never been assigned values.

Question we did in the project:
is at least one person 19 or older?

here is the default array provided to us

const people = [
  { name: "Wes", year: 1988 },
  { name: "Kait", year: 1986 },
  { name: "Irv", year: 1970 },
  { name: "Lux", year: 2015 },
];

and here is our solution

const isAdult = people.some(function (person) {
   const currenYear = new Date().getFullYear();
   if (currenYear - person.year >= 19) {
     return true;
   }
 });
console.log({ isAdult });

using ES6 arrow functions we can significantly cut down the number of lines of code. Here is the solution using arrow functions and explicit return.

const isAdult = people.some(
  (person) => new Date().getFullYear - person.year >= 19
);
console.log({ isAdult });

Note: By using {} inside console.log(), it's going to output the name of the variable as well as the value.

Array.prototype.every()

This function checks if every single element in Array follows our criteria.

According to MDN

The every() method tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value.

The every method executes the provided callbackFn function once for each element present in the array until it finds the one where callbackFn returns a falsy value. If such an element is found, the every method immediately returns false. Otherwise, if callbackFn returns a truthy value for all elements, every returns true.

Question we did in the project:
is everyone 19 or older?

Here is our solution:

const allAdult = people.every(
  (person) => new Date().getFullYear - person.year >= 19
);
console.log({ allAdult });

Array.prototype.find()

.find() is kind of like .filter() but instead of returning a subset of the array, it's going to return the first item it finds.

According to MDN

The find() method returns the value of the first element in the provided array that satisfies the provided testing function. If no values satisfy the testing function, undefined is returned.

The find method executes the callbackFn function once for each index of the array until the callbackFn returns a truthy value. If so, find immediately returns the value of that element. Otherwise, find returns undefined.

Question we did in the project:
find the comment with the ID of 823423

here is the default array provided in the question:

const comments = [
  { text: "Love this!", id: 523423 },
  { text: "Super good", id: 823423 },
  { text: "You are the best", id: 2039842 },
  { text: "Ramen is my fav food ever", id: 123523 },
  { text: "Nice Nice Nice!", id: 542328 },
];

here is our solution:

const comment = comments.find(function (comment) {
   if (comment.id === 823423) {
    return true;
  }
 });
console.log(comment);

here is the solution using ES6 syntax:

const comment = comments.find((comment) => comment.id === 823423);
console.log(comment);

Array.prototype.findIndex()

It finds out the index where something is inside of the array.

According to MDN

The findIndex() method returns the index of the first element in the array that satisfies the provided testing function. Otherwise, it returns -1, indicating that no element passed the test.

The findIndex() method executes the callbackFn function once for every index in the array until it finds the one where callbackFn returns a truthy value.If such an element is found, findIndex() immediately returns the element's index. If callbackFn never returns a truthy value (or the array's length is 0), findIndex() returns -1.

Question we did in the project:
Find the comment with this ID and delete the comment with the ID of 823423

here is the use of .findIndex()

const index = comments.findIndex((comment) => comment.id === 823423);
console.log(index);

Now to delete the comment we have 2 ways:

• first we use .splice()

comments.splice(index, 1);

• second we create a new array of the updated comments using .slice() and the ES6 spread operator.

const newArray = [...comments.slice(0, index), ...comments.slice(index + 1)];

and with this our project for the day was completed.

GitHub repo:

cenacrharsh / JS-30-DAY-7

Blog on Day-6 of javascript30

JavaScript-30-Day-6

KUMAR HARSH ・ Jun 6 '21

#javascript #css #html #webdev

Blog on Day-5 of javascript30

JavaScript-30-Day-5

KUMAR HARSH ・ Jun 5 '21

#html #css #javascript #github

Blog on Day-4 of javascript30

JavaScript-30-Day-4

KUMAR HARSH ・ Jun 4 '21

#javascript #github #webdev #html

Follow me on Twitter
Follow me on Linkedin

DEV Profile

KUMAR HARSHFollow

The best way to learn is to teach.Programmer by Passion and Developer for Fun, and I love sharing my journey with everyone.

You can also do the challenge at javascript30

Thanks WesBos to share this with us! 😊💖

Please comment and let me know your views

Thank You!

Comments

[Mustapha Abdul-Rasaq]

This is great to read, like a refresher for some of the things I already knew, great write up there. 👍

[KUMAR HARSH]

Glad you liked it.

[RASHMI VERMA]

Best👍👍

[KUMAR HARSH]

Thanks.

[Pritesh Bhoi]

nice 👌

[KUMAR HARSH]

Thanks.

[ROHIT KUMAR]

mine too ,but is ramen real??༼ つ ◕_◕ ༽つ

[KUMAR HARSH]

It's a dream for me lol.