javascript : built-in object [array]

show data 

//? .length
// Returns the length (number) of an array.

const arr = ['a', 'b', 'c'];

console.log(arr.length); // 3

//? .at()
// Index the target array.

console.log(arr[0]); // a
console.log(arr.at(0)); // a
console.log(arr.at(-1)); // c

//? .find()
// Returns the first element in the target array that passes the callback test.

const arr = [5, 8, 130, 12, 44];
const foundItem = arr.find((item) => item > 10);

console.log(foundItem); // 130

const users = [
  { name: 'neo', age: 85 },
  {
    name: 'amy',
    age: 22,
  },
];

const foundUser = users.find((user) => user.name === 'amy');
console.log(foundUser); // { name: 'amy', age: 22 }

//? .findIndex()
// Returns the first index in the target array that passes the callback test.

const index = arr.findIndex((item) => item > 10);
console.log(index); // 2


//? .join()
// Returns a character concatenated with all elements of the target array by delimiters.

const arr = ['apple', 'banana', 'cherry'];

console.log(arr.join()); // apple,banana,cherry
console.log(arr.join(', ')); // apple, banana, cherry
console.log(arr.join('/')); // apple/banana/cherry




//? array.from()
// Returns a pseudo-array as the real array.

const arrayLike = {
  0: 'a',
  1: 'b',
  2: 'c',
  length: 3,
};

console.log(arrayLike.constructor === Array); // false
console.log(arrayLike.constructor === Object); // true

Array.from(arrayLike).forEach((item) => console.log(item));
// a
// b
// c

//? Array.isArray()
// Check if it is array data.

console.log(Array.isArray(arr)); // true
console.log(Array.isArray(arrayLike)); // false


// Flatten nested arrays into one array
let arr = [
  [1, 2, 3],
  [4, [5, 6, [3, 4]]],
];
console.log(arr); // [ [ 1, 2, 3 ], [ 4, [ 5, 6, [Array] ] ] ]
console.log(arr.flat(3)); // [ 1, 2, 3, 4, 5, 6, 3, 4]
arr = arr.flat(3);

check data

//? .every()
// Checks that all elements of the target array return true in the callback test.
const arr5 = [1, 2, 3, 4];
const isValid = arr5.every((item) => item < 5);

console.log(isValid); // true


//? .some()
// Checks if any element of the target array passes the callback test.
const arr2 = [1, 2, 3, 4];
const isValid = arr2.some((item) => item > 3);

console.log(isValid); // true


//? .includes()
// Check if the target array contains a specific element

const arr4 = [1, 2, 3];
console.log(arr.includes(7)); // false

const fruits = ['apple', 'banana', 'cherry'];
console.log(fruits.includes('Banana')); // false

console.log(users.includes({ name: 'neo', age: 85 })); // false

const neo = users[0];
console.log(users.includes(neo)); // true

modify original data

//? .pop()
// Removes the last element from the target array and returns that element.
// The source of the target array is changed.

const fruits = ['apple', 'banana', 'cherry'];

console.log(fruits.pop()); // cherry
console.log(fruits); // [ 'apple', 'banana' ]

//? .push()
// Adds one or more elements to the end of the target array and returns the new length of the array.
// The source of the target array is changed.

const newLength = fruits.push('orange');
console.log(newLength); // 3
console.log(fruits); // [ 'apple', 'banana', 'orange' ]


//? .reverse()
// Reverse the order of the target array.
// The source of the target array is changed.

const arr = ['A', 'B', 'C'];
const reversed = arr.reverse();

console.log(reversed); // [ 'C', 'B', 'A' ]
console.log(arr); // [ 'C', 'B', 'A' ]


//? .shift()
// Removes the first element from the target array and returns the removed element.
// The source of the target array is changed.

console.log(arr.shift()); // C
console.log(arr); // [ 'B', 'A' ]

//? .unshift()
// Adds the first element from the target array and returns the length.
// The source of the target array is changed.



//? sort()
// Sorts the target array according to the return value of blanks.
// If no callback is provided, the elements are converted to strings and sorted in Unicode code point order.
// The source of the target array is changed.

const numbers = [4, 17, 2, 103, 3, 1, 0];

numbers.sort();
console.log(numbers);
// [
//     0, 1, 103, 17,
//     2, 3,   4
//   ]

numbers.sort((a, b) => a - b);
console.log(numbers);
// [
//     0,  1,   2, 3,
//     4, 17, 103
//   ]

numbers.sort((a, b) => b - a);
console.log(numbers);
// [
//     103, 17, 4, 3,
//       2,  1, 0
//   ]

const users = [
  { name: 'neo', age: 85 },
  { name: 'amy', age: 22 },
  { name: 'lewis', age: 11 },
];

users.sort((a, b) => a.age - b.age);
console.log(users);
// [
//     { name: 'lewis', age: 11 },
//     { name: 'amy', age: 22 },
//     { name: 'neo', age: 85 }
//   ]


//? .splice()
// Adds, deletes, or replaces elements in the target array.
// The source of the target array is changed.

const arr3 = ['a', 'b', 'c'];
arr3.splice(2, 0, 'x');

console.log(arr3); // [ 'a', 'b', 'x', 'c' ]

arr3.splice(1, 1);
console.log(arr3); // [ 'a', 'x', 'c' ]


//? .unshift()
// Adds a new element to the beginning of the target array and returns the length of the new array.
// The source of the target array is changed.

const arr4 = ['a', 'b', 'c'];

console.log(arr4.unshift('x')); // 4
console.log(arr4); // [ 'x', 'a', 'b', 'c' ]


// Fill an array with specific values
arr.fill(0); 
console.log(arr); // [ 0, 0, 0, 0, 0, 0, 0, 0 ]
arr.fill('s', 1, 3);
console.log(arr); // [ 0, 's', 's', 0, 0, 0, 0, 0]

return new data

//? forEach()
// Executes the given callback as long as the length of the target array.
// Use when you don't need to end a loop => Use a for if statement when you need to end a loop in the middle
const arr3 = ['a', 'b', 'c'];

arr3.forEach((item) => console.log(item));
// a
// b
// c


//? .concat() => new data
// Merges the target array with the given array and returns a new array.

const arr1 = ['a', 'b', 'c'];
const arr2 = ['d', 'e', 'f'];
const arr3 = arr1.concat(arr2);
const arr4 = [...arr1, ...arr2];

console.log(arr3); // [ 'a', 'b', 'c', 'd', 'e', 'f' ]
console.log(arr4); // [ 'a', 'b', 'c', 'd', 'e', 'f' ]


//? .slice()
// Extracts a portion of the target array and returns a new array.
// It extracts up to just before the second argument, and if the second argument is omitted, it extracts to the end of the target array.

const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];

console.log(arr1.slice(0, 3)); // [ 'a', 'b', 'c' ]
console.log(arr1.slice(4, -1)); // [ 'e', 'f' ]
console.log(arr1.slice(4)); // [ 'e', 'f', 'g' ]
console.log(arr1);
// [
//     'a', 'b', 'c',
//     'd', 'e', 'f',
//     'g'
//   ]



//? .filter()
// Returns all elements that pass the given callback test in a new array.

const numbers = [1, 20, 7, 9, 104, 0, 58];
const filteredNumbers = numbers.filter((number) => number < 30);

console.log(filteredNumbers); // [ 1, 20, 7, 9, 0 ]

const users = [
  { name: 'neo', age: 85 },
  { name: 'amy', age: 22 },
];

const adults = users.filter((user) => user.age >= 19);
console.log(adults); // [ { name: 'neo', age: 85 }, { name: 'amy', age: 22 } ]

//? .map()
// Executes the given callback as long as the length of the target array, collects the return values of the callback, and returns a new array.

const numbers = [1, 2, 3, 4];
const newNumbers = numbers.map((item) => item * 2);

console.log(newNumbers); // [ 2, 4, 6, 8 ]

const users = [
  { name: 'neo', age: 85 },
  { name: 'amy', age: 22 },
  { name: 'lewis', age: 11 },
];

const newUsers = users.map((user) => {
  return {
    ...user,
    isValid: true,
    email: null,
  };
});

console.log(newUsers);
// [
//     { name: 'neo', age: 85, isValid: true, email: null },
//     { name: 'amy', age: 22, isValid: true, email: null },
//     { name: 'lewis', age: 11, isValid: true, email: null }
//   ]


//? .reduce()
// Executes the given callback as long as the length of the target array, and returns the return value of the last called callback.
// The return value of each callback is passed to the next callback.
// 0 is the initial value

const numbers1 = [1, 2, 3];

const sum = numbers1.reduce((acc, cur) => {
  return acc + cur;
}, 0);

console.log(sum); // 6

const totalAge = users.reduce((acc, cur) => {
  return acc + cur.age;
}, 0);
console.log(totalAge); // 118

const namesArray = users.reduce((acc, cur) => {
  acc.push(cur.name);
  return acc;
}, []);
const names = namesArray.join(', ');
console.log(namesArray); // [ 'neo', 'amy', 'lewis' ]
console.log(names); // neo, amy, lewis


//? Flatmap 
// Unfold nested arrays into new arrays!
const nums = [1, 2, 3, 4, 5];

result = nums.map((item) => [1, 2]);
console.log(result);
/*
[ [ 1, 2 ], [ 1, 2 ], [ 1, 2 ], [ 1, 2 ], [ 1, 2 ] ]
*/

result = nums.flatMap((item) => [1, 2]);
console.log(result);
/*
[
  1, 2, 1, 2, 1,
  2, 1, 2, 1, 2
]
*/