JavaScript: forEach, peta, Fungsi Anak Panah, setTimeout, setInterval, penapis, beberapa, setiap dan kurangkan

untukSetiap Kaedah

forEach digunakan untuk mengulangi tatasusunan. Berikut ialah contoh mudah:

const numbers = [1, 2, 3, 4, 5, 6, 7];

numbers.forEach(function (el) {
  if (el % 2 === 0) {
    console.log(el);
  }
});

Sekarang mari kita gunakan forEach dengan pelbagai objek:

const movies = [
  {
    title: 'Indiana Jones',
    score: 77,
  },
  {
    title: 'Star Trek',
    score: 94,
  },
  {
    title: 'Deadpool',
    score: 79,
  },
];

movies.forEach(function (movie) {
  console.log(`${movie.title} - ${movie.score}/100`);
});

Peta

Peta mencipta tatasusunan baharu dengan hasil daripada memanggil panggilan balik pada setiap elemen dalam tatasusunan.

Pertama, mari kita ulangi tatasusunan asas:

const lCase = ['jim', 'bob', 'abby'];
const uCase = lCase.map(function (t) {
  return t.toUpperCase();
});

console.log(lCase, uCase);

Sekarang, mari kita ulangi pelbagai objek:

const movies = [
  {
    title: 'Indiana Jones',
    score: 77,
  },
  {
    title: 'Star Trek',
    score: 94,
  },
  {
    title: 'Deadpool',
    score: 79,
  },
];

const titles = movies.map(function (movie) {
  return movie.title;
});
console.log(titles);

Fungsi Anak Panah

Kami boleh menulis fungsi anak panah seperti berikut untuk memudahkan sintaks kami:

const square = (x) => {
  return x * x;
};

const sum = (x, y) => {
  return x + y;
};

const rollDie = () => {
  return Math.floor(Math.random() * 6) + 1;
};

console.log(square(2), sum(2, 3));
console.log(rollDie());

Kami juga boleh melawat semula contoh filem dan menggunakan fungsi anak panah:

const movies = [
  {
    title: 'Indiana Jones',
    score: 77,
  },
  {
    title: 'Star Trek',
    score: 94,
  },
  {
    title: 'Deadpool',
    score: 79,
  },
];

const newMovies = movies.map((movie) => {
  return `${movie.title} = ${movie.score} / 10`;
});

Pulangan Tersirat

Pemulangan tersirat ialah satu lagi fungsi penulisan singkatan, beberapa contoh termasuk:

const rollDie = () => Math.floor(Math.random() * 6) + 1;
const isEven = (num) => num % 2 === 0;

Tetapkan Tamat Masa

Menjalankan panggilan balik selepas x milisaat

console.log('Apears 1st');
// takes callback, then milliseconds
setTimeout(() => {
  console.log('Apears 3rd');
}, 3000);

console.log('Apears 2nd');

Tetapkan Selang

Mengulang panggilan balik setiap x milisaat

setInterval(() => {
  console.log(Math.random());
}, 2000);

Jika kita mahu menghentikan panggilan balik, kita boleh melakukan ini:

const id = setInterval(() => {
  console.log(Math.random());
}, 2000);

clearInterval(id); // stops the loop

Kaedah Penapis

Penapis mencipta tatasusunan baharu dengan elemen yang menghantar pulangan benar dalam fungsi panggil balik

const nums = [9, 8, 7, 6, 5, 4, 3, 2, 1];
const odds = nums.filter((n) => {
  return n % 2 === 1; // our callback returns true or false
  // if it returns true, n is added to the filtered array
});
// [9, 7, 5, 3, 1]

const smallNums = nums.filter((n) => n < 5); // [4, 3, 2, 1]

Kami juga boleh menapis objek dalam tatasusunan:

const movies = [
  {
    title: 'Indiana Jones',
    score: 77,
  },
  {
    title: 'Star Trek',
    score: 94,
  },
  {
    title: 'Deadpool',
    score: 79,
  },
];

const badMovies = movies.filter((movie) => {
  return movie.score < 80;
});

console.log(badMovies);

Beberapa dan Setiap

• Sesetengah - menguji jika MANA-MANA ​​elemen dalam tatasusunan mengembalikan benar dalam fungsi panggil balik. Ia mengembalikan boolean

const firstWords = ['dog', 'jello', 'log', 'bag', 'wag', 'cupcake'];

words.some((word) => {
  return word.length > 4;
}); // true

words.some((word) => word[0] === 'Z'); // false
words.some((word) => word.includes('cake')); // true

• Setiap - menguji jika SEMUA elemen dalam tatasusunan mengembalikan benar dalam fungsi panggil balik. Ia mengembalikan boolean

const words = ['dog', 'dig', 'log', 'bag', 'wag'];

words.every((word) => {
  return word.length === 3;
}); // true

words.every((word) => word[0] === 'd'); // false

words.every((w) => {
  return w[w.length - 1] === 'g';
}); // true

Kurangkan

• Argumen pertama (dan berpotensi sahaja) dalam mengurangkan fungsi panggil balik.
  • Argumen pertama fungsi ini ialah nilai yang tertakluk kepada perubahan semasa kami mengulangi setiap item.
  • Argumen kedua dalam fungsi ini ialah nilai daripada indeks tatasusunan.
• Argumen kedua pilihan pengurangan ialah nilai yang kita mahu nilai pertama fungsi panggil balik bermula.

const prices = [9.99, 1.5, 19.99, 49.99, 30.5];

const total = prices.reduce((total, price) => {
  return total + price;
});

const min = prices.reduce((min, price) => {
  return Math.min(min, price);
});

console.log(min);

Kita boleh melakukan ini dengan pelbagai objek juga:

const movies = [
  {
    title: 'Indiana Jones',
    score: 77,
  },
  {
    title: 'Star Trek',
    score: 94,
  },
  {
    title: 'Deadpool',
    score: 79,
  },
];

let bestMovie = movies.reduce((best, movie) => {
  if (movie.score > best.score) {
    return movie;
  }
  return best;
});

console.log(bestMovie);

Kami juga boleh menetapkan nilai awal pengurang:

let nums = [1, 2, 3, 4, 5];

let maxPlus100 = nums.reduce((max, num) => {
  return (max += num);
}, 100);

console.log(maxPlus100); // 115

Atas ialah kandungan terperinci JavaScript: forEach, peta, Fungsi Anak Panah, setTimeout, setInterval, penapis, beberapa, setiap dan kurangkan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!