forEach, filter, map, sort, reduce

Trochę operacji na tablicach 🙂

const employments = [
  { name: 'Andrzej', category: 'Finanse', start: 1982, end: 2017 },
  { name: 'Agnieszka', category: 'Sprzedaż', start: 1992, end: 2008 },
  { name: 'Mariola', category: 'Samochody', start: 1991, end: 2007 }
];

const digits = [23, 22, 10, 1, 5, 54, 25, 24, 21];

Chcemy pobrać imię pracownika.
Najpierw w starym stylu.

for (let i = 0; i < employments.length; i++) {
  console.log(employments[i].name); // Andrzej, Agnieszka, Mariola
}

forEach – teraz pobierzemy przez forEach

employments.forEach(function(employment) {
  console.log(employment.name);
});

Możemy to zrobić jeszcze szybciej prze ES6

employments.forEach(employment => {
  console.log(employment.name);
});

filter – użyjemy teraz filter aby pobrać liczbę 21 lub większą

Najpierw w starym stylu.

let digitNumber = [];
for(let i = 0; i < digits.length; i++) {
  if(digits[i] >= 21) {
    digitNumber.push(digits[i]);
  }
}

console.log(digitNumber); // 23, 22, 54, 25, 24, 21

Teraz krócej 🙂

const digitNumber = digits.filter(function(digit) {
  if(digit >= 21) {
    return true;
  }
});

console.log(digitNumber);

I jeszcze krócej.

const digitNumbers = digits.filter(digit => digit >= 21);

console.log(digitNumbers);

A może by tak wyszukać osoby po kategorii np. Technologie

const retailEmployments = employments.filter(function(employment) {
  if(employment.category === 'Samochody') {
    return true;
  }
});

console.log(retailEmployments); // { category: "Samochody", end: 2007, name: "Mariola", start: 1991 }

A może da się jeszcze szybciej

const retailEmployments = employments.filter(employment => employment.category === 'Samochody');

console.log(retailEmployments);
const eightiesEmployments = employments.filter(employment => (employment.start >= 1980 && employment.start < 1990));

console.log(eightiesEmployments); // { category: "Finanse", end: 2017, name: "Andrzej", start: 1982 }

map – użyjmy map
Utworzymy tablice imion.

const employmentsNames = employments.map(function(employment) {
  return employment.name;
});

console.log(employmentsNames); // Andrzej, Agnieszka, Mariola

Możemy połączyć to z template.

const testEmployments = employments.map(function(employment) {
  return `${employment.name} [${employment.start} - ${employment.end}]`;
});

console.log(testEmployments); // ["Andrzej [1982 - 2017]", "Agnieszka [1992 - 2008]", "Mariola [1991 - 2007]"]

Lub nawet krócej.

const testEmployments = employments.map(
  employment => `${employment.name} [${employment.start} - ${employment.end}]`
);

console.log(testEmployments);

Możemy wielokrotnie użyć map.

const testDigits = digits
  .map(digit => Math.sqrt(digit))
  .map(digit => digit * 3);

console.log(testDigits); // [14.387494569938157, 14.071247279470288, 9.486832980505138, 3, 6.708203932499369, 22.045407685048602, 15, 14.696938456699067, 13.74772708486752]

sort – teraz przechodzimy do sort

const sortEmployments = employments.sort(function(ec1, ec2) {
  if(ec1.start > ec2.start) {
    return 1;
  } else {
    return -1;
  }
});

console.log(sortEmployments);
/*
{
  category: "Finanse",
  end: 2017,
  name: "Andrzej",
  start: 1982
}, [object Object] {
  category: "Samochody",
  end: 2007,
  name: "Mariola",
  start: 1991
}, [object Object] {
  category: "Sprzedaż",
  end: 2008,
  name: "Agnieszka",
  start: 1992
}
*/

Wersja skrócona.

const sortEmployments = employments.sort((a, b) => (a.start > b.start ? 1 : -1));

console.log(sortEmployments);

reduce – użyjmy reduce

let digitSum = 0;
for(let i = 0; i < digits.length; i++) {
  digitSum += digits[i];
}

console.log(digitSum); // 185

Inna wersja reduce.

const digitSum = digits.reduce(function(total, digit) {
  return total + digit;
}, 0);

console.log(digitSum); // 185
const digitSum = digits.reduce((total, age) => total + age, 0);

console.log(digitSum); // 185

I na koniec łączenie wszystkich metod.

const combined = digits
 .map(digit => digit * 2)
 .filter(digit => digit >= 40)
 .sort((a, b) => a - b)
 .reduce((a, b) => a + b, 0);

console.log(combined); // 338

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *